前端代码如何部署到django中(怎么把django程序部署到服务器上)

导读：本篇文章首席CTO笔记来给大家介绍有关前端代码如何部署到django中的相关内容，希望对大家有所帮助，一起来看看吧。

安装软件

安装Python2.7、PyCharm、pip（Python包管理工具）、Django（pipinstallDjango）

部署

PyCharm新建Django工程

完成后，其目录如下：

子目录MyDjangoProject下表示工程的全局配置，分别为setttings.py、urls.py和wsgi.py,其中setttings.py包括了系统的数据库配置、应用配置和其他配置，urls.py则

表示web工程Url映射的配置。

子目录student则是在该工程下创建的app，包含了models.py、tests.py和views.py等文件

templates目录则为模板文件的目录

manage.py是Django提供的一个管理工具，可以同步数据库等等

启动

创建完成后，就可以正常启动了。点击Run按钮，启动时报错了：

Traceback(mostrecentcalllast):

File"D:/workspace/MyDjangoProject/manage.py",line10,inmodule

execute_from_command_line(sys.argv)

File"D:\Python27\lib\site-packages\django\core\management\__init__.py",line338,inexecute_from_command_line

utility.execute()

File"D:\Python27\lib\site-packages\django\core\management\__init__.py",line312,inexecute

django.setup()

File"D:\Python27\lib\site-packages\django\__init__.py",line18,insetup

apps.populate(settings.INSTALLED_APPS)

File"D:\Python27\lib\site-packages\django\apps\registry.py",line89,inpopulate

"duplicates:%s"%app_config.label)

django.core.exceptions.ImproperlyConfigured:Applicationlabelsaren'tunique,duplicates:admin

应该是admin配置冲突了，打开setttings.py文件，发现admin配置重复了

INSTALLED_APPS=(

'django.contrib.admin',

'django.contrib.auth',

'django.contrib.contenttypes',

'django.contrib.sessions',

'django.contrib.messages',

'django.contrib.staticfiles',

'django.contrib.admin',

'student',

)

注释掉其中一行后（为什么会有这个问题，估计是个bug），重新启动，ok

web工程添加页面

此时，我们尚没有写一行代码，程序就duang跑起来了!快添加一个HelloWorld的页面吧。

打开student/views.py文件，输入以下内容

defsayHello(request):

s='HelloWorld!'

current_time=datetime.datetime.now()

html='htmlhead/headbodyh1%s/h1p%s/p/body/html'%(s,current_time)

returnHttpResponse(html)

打开url.py文件，需要进行url映射的配置：

url(r'^student/',sayHello)

当用户输入http://**/student时，便会调用sayHello方法，该方法通过HttpResponse()将页面内容作为响应返回。

重启服务，访问

在views.py页面可以将页面需要的元素通过字符串的形式，调用HttpResponse()类作为响应返回到浏览器。但这样，页面逻辑和页面混合在一起，手写起来很繁琐，工作量比较大。如果我们需要展示一些动态的数据，而页面基本不改变的情况下，该怎么做呢？

比如在用户访问时，我们想动态展示一些学生的数据。可以这样做：

首先在templates目录下，新建student.html文件，该文件作为模板，内容如下：

!DOCTYPEhtml

html

head

title/title

/head

body

ul

{%forstudentinstudents%}

li

id:{{student.id}},姓名：{{student.name}},age:{{student.age}}

/li

{%endfor%}

/ul

/body

/html

修改views.py文件，添加方法showStudents()

defshowStudents(request):

list=[{id:1,'name':'Jack'},{id:2,'name':'Rose'}]

returnrender_to_response('student.html',{'students':list})

该方法将list作为动态数据，通过render_to_response方法绑定到模板页面student.html上。

添加url映射，url(r'^showStudents/$',showStudents)

修改settings.py模板配置：'DIRS':[BASE_DIR+r'\templates'],

重启服务，访问，出现：

至此，我们已可以正常将一些“动态”数据绑定到模板上了。但是怎么样访问数据库呢？

从数据库获取需要的数据，展示在页面上？

首先需要安装数据库驱动啦，即mysql_python，

接着配置数据库连接：

DATABASES={

'default':{

'ENGINE':'django.db.backends.mysql',

'NAME':'student',

'USER':'root',

'PASSWORD':'1234',

'HOST':'127.0.0.1',

'PORT':'3306',

#'NAME':os.path.join(BASE_DIR,'db.sqlite3'),

}

}

配置完成之后，需要检测数据库配置是否正确，使用manage.pyshell命令，进入shell交互界面：

输入：

fromdjango.dbimportconnection

cursor=connection.cursor()

如果不报错，说明配置正确。

创建model,打开models.py，定义model如下：

classStudent(models.Model)

id=models.BigIntegerField

name=models.CharField(max_length=20,default='a')

然后调用manage.pysyncdb

正常情况下，该步骤做完之后，model会和数据库保持一致性。但是在测试中，命令执行成功后，却发现数据库并没有建立该表。

对于该种情况，做如下操作即可正常：

（1）注释掉models.py文件代码，执行manage.pymakemigerationsstudent

【和manage.pymigerate--fake】

（2）打开注释，执行【manage.pymakemigerationsstudent和】manage.pymigerate命令

通过以上两步，便可正常操作了

views.py中添加方法：showRealStudents

defshowRealStudents(request):

list=Student.objects.all()

returnrender_to_response('student.html',{'students':list})

urls.py添加映射url(r'^showRealStudents/$',showRealStudents)

重启服务，打开连接：

页面输出正常。

至此，使用Django，可以正常操作数据库，自定义模板，在页面展示数据了。

服务器

由于Django自带轻量级的server，因此默认使用该server，但实际生产中是不允许这么干的，生产环境中通常使用ApacheHttpdServer结合mod_wsgi.so来做后端服务器。

以下部署环境为：Python2.7.6

1、安装httpd-2.2.25-win32-x86-no_ssl.msi

2、将下载好的mod_wsgi.so放在D:\ProgramFiles\ApacheSoftwareFoundation\Apache2.2\modules模块下。

3、在新建的web工程MyDjangoProject目录下新建django.wsgi文件

内容如下（相应的目录需要修改）：

importos

importsys

djangopath="D:/Python27/Lib/site-packages/django/bin"

ifdjangopathnotinsys.path:

sys.path.append(djangopath)

projectpath='D:/workspace/MyDjangoProject'

ifprojectpathnotinsys.path:

sys.path.append(projectpath)

apppath='D:/workspace/MyDjangoProject/MyDjangoProject'

ifapppathnotinsys.path:

sys.path.append(apppath)

os.environ['DJANGO_SETTINGS_MODULE']='MyDjangoProject.settings'

fromdjango.core.wsgiimportget_wsgi_application

application=get_wsgi_application()

4、修改httpd.conf,添加如下：

LoadModulewsgi_modulemodules/mod_wsgi.so

WSGIScriptAlias/"D:/workspace/MyDjangoProject/django.wsgi"

Directory"D:/workspace/MyDjangoProject/"

OptionsFollowSymLinks

AllowOverrideNone

Orderdeny,allow

Allowfromall

/Directory

ok,重启server，页面正常了。

在部署的过程中，遇到一个异常，如下：

Thetranslationinfrastructurecannotbeinitializedbeforetheappsregistryisready

原因是django.wsgi一开始按照较为古老的写法，改为新版本的写法就Ok了。

后端用的drf，使用的是uwsgi+nginx

进入服务器项目文件目录下，我的django项目放在了“/usr/myProjects/”目录下了。在manage.py同级目录下创建uwsgi.ini文件，配置如下：

测试效果命令：

如果访问：xxx.xxx.xxx.xx:8000成功，则uwsgi.ini配置成功

我的nginx.conf所在位置是“/etc/nginx/nginx.conf”

配置文件如下：

1、第一行

主要就是给nginx加权限，vue部署后使用history路由时会去掉地址后面的‘#’号，打包部署后不加权限会有bug。

2、如配置所示，有两个Server，分别部署了前端服务，和后端服务，值得注意的是两个Server用的是同一个服务器，监听的端口不同。

3、vue部署需要注意的是反向代理地址：

以及后面的端口问题

4、后端的Server需要注意location中的uwsgi_pass后面的端口号要和uwsgi.ini中配的相同，否则监听不到

5、后端跨域问题。如果遇到跨域需要自己网上找配置，我的没遇到，可能是因为我在django的settings中配置了跨域。

6、django-suit后台管理样式崩了，需要改，但是api可以正常访问，这个有空再说

7、我开始后台监听的是8008端口，vue前端监听的是80端口，这样前端显示好看。然而问题出现了，虽然后台api可以正常访问，vue的本地开发环境也能正常运行且文字、图片资源均显示正常，但是前端vue打包线上部署后，文字信息显示正常，图片信息缺失8008端口，导致显示不出来。为图方便我选择了前端监听8008端口，后端监听80，部署后显示正常。原因不太清楚///////有空再说吧。

8、不要问我为啥都前后端分离了还部署到一个服务器上？穷，而且只是测试，没必要

9、此文仅适合入门

关于django后台admin（suit）缺失的修改（参考：django中文网：）

在环境中进入项目目录，需要收集css样式，在终端输入命令：

接下来你就回发现static文件中包含了css文件，此时再打开网站，样式显示正常

uWSGI通过xxx.ini启动后会在相同目录下生成一个xxx.pid的文件，里面只有一行内容是uWSGI的主进程的进程号。

关于uwsgi,进入同届目录下

教训

获取不到环境，那就指定环境

另外：记得重启uwsgi，重启Nginx，实在不行就先把监听的端口kill掉再重启

暴力删端口：fuser-k80/tcp

netstat-aptn命令行，查看所有开启的端口号

netstat-ntlp|grep80查看具体的端口是否使用

ps-ef|grepuwsgi查看是否有uwsgi端口存在