首先下载一个专门解决跨域的组件：
pip3 install django-cors-headers
下载好后就可以开干了！
django的初始化
首先是admin.py 我使用了之前我公布的自动注册算法
from django.contrib import admin # Register your models here. from myapp.models import * import inspect,sys clsmemebers = inspect.getmembers(sys.modules[__name__],inspect.isclass) for name,cls in clsmemebers: admin.site.register(cls)
然后是urls.py中，配置上v_love项目的路径，毕竟我们的首页入口是vue项目的index.html （这个之后说）
from django.contrib import admin from django.urls import path from django.views.generic import TemplateView urlpatterns = [ path('admin/', admin.site.urls), path('home/', TemplateView.as_view(template_name='index.html')), ]
然后是settings.py 这个改的地方比较多。
把自己的myapp写到installed_apps里
然后是Middleware中间件，这里我们要在第三行插入一个新的，也就是刚刚下载的那个。然后再注释掉俩个。
然后是紧接着顶格写一个变量 和上面的中间件设置都是为了解决跨域问题。
然后是html寻址路径,这里写的也是指向vue项目的打包后文件路径
然后是语言和时区
然后是最后一个，给静态资源寻址路径设置一下,同样指向vue项目的静态资源路径
好到这里。django部分的初始化算是完事了，接着来干vue项目的初始化
Vue项目v_love的初始化设置
首先给v_love目录下创建一个名为 vue.config.js的文件，用来做配置。
然后在这个vue.config.js这个文件内写上如下的内容,其实我们之后很多设置都可以写这里，不过目前我们就下一个，意思是打包后的前端静态资源统一放入到static文件夹内，以便django调用。
module.exports = { // 输出目录 assetsDir: 'static', };
接下来我们去手动创建一个空的static文件夹，放在public文件夹下：
然后我们给vue安装常用插件，bootstrap和jquery和axios 在v_love项目根目录分别一句一句执行命令：
npm install jquery --save npm install bootstrap --save npm install axios --save
执行完后，记得打开package.json看看是不是出现了这三个插件：
如果运气好和上面图一样，就证明你安装成功了。
然后我们检查下django和vue的连调情况。在v_love项目根目录下执行打包命令：npm run build
看上图，执行了打包命令成功后，可以看到v_love文件夹下自动新增了一个打包后的成品文件夹dist。
展开dist，可以看到里面的入口页面index.html还有自己的static静态资源文件夹。
然后我们运行django项目，是的，运行django项目：
启动成功后，进入我们设置好的入口url：
就发现了神奇之处，django项目的端口和网址，居然打开了vue的首页。至此，我们的联调算是通了。并且没有任何跨域问题。
之后的开发节奏就是，在v_love项目内写前端，能前端处理的都在前端写。数据方面直接通过axios去django的后端内请求数据库。
下节课预告，架构设计分析等。
