【测开中台教程-03】打通django和vue的链接。

2024-09-17 14:45:19 浏览数 (3)

以后本号的这个教程会在每天的早上九点左右发出,大家在工作中有闲暇的就打开这个项目跟一跟,几分钟就看完了。每天学一点点,几个月后就大不相同了!

进粉丝群送源码项目压缩包:v: qingwanjianhua

必须打通,否则请求不过去哦~ 还要涉及到django寻找vue打包的静态模版资源等问题。

首先Django方面:

首先安装中间件 跨域用的:pip3 install django-cors-headers

把中间件注册进去,在django的settings.py中实现:

新增一个,有来个注释掉

然后别忘了这里,要加上中间件的设置:

设置settings.py中的html模版寻址位置为vue的项目打包后结果

设置静态资源寻址位置为vue的打包后结果,把下面这句加进去就可以,就是新建了一个变量。

设置url的默认空路由指向为vue的打包后入口html,需要在django的urls.py中修改。

然后就是设置vue方面:

设置静态资源打包路径,vue.config.js加入下面这段

然后打包试一试,看看有没有生成dist文件夹和内部结构是否正确

和上图一样,就代表ok了。

然后去修改django的启动项,命令设置成这样:

注意启动后,控制台显示的网址是0.0.0.0:8000,但我们不要直接点击这个进入。

我们要点击127.0.0.1的路径进去django的主页。如果django主页此时展示的是vue的欢迎页,那就说明成功了:

到此,算是打通了哦~

接下来的工作,就是正式开发具体页面了哦~

1 人点赞