Django和vue交互

本文记录了使用Django和Vue进行前后端分离开发时的跨域配置与交互过程。在Django端,通过安装和配置`django-cors-headers`来处理跨域请求,并在settings.py中设置中间件和允许的域名。Vue端则利用axios进行跨域访问。通过创建Django应用、定义模型、视图和路由,最后在Vue中验证数据获取,实现了前后端数据交互。
摘要由CSDN通过智能技术生成

最近写的毕设要求前后端分离进行开发,把前后端连起来就有一些小问题,结合之前springboot +vue的小设计也遇到过这样的问题,就可以小小的解决一下。那就浅记录一下吧。

Django方面

django这边主要是要使用一个命令,在settings.py中做一些操作。
首先就是一个命令,用pip下载:

pip3 install django-cors-headers

这个django-cors-headers可是个好东西,他专门就处理跨域请求的,有了他,就允许其他源向django发出浏览器内的请求。但是光下载还不太行,还是需要进行一系列的配置:
找到主目录下的settings.py文件,在里面进行相应的配置

INSTALLED_APPS = [
    ···
    'corsheaders',
    ···
]

这就跟要用DRF要在这个app里面添加rest_framework是一样的,没有就没法用
接下来就要进行进一步的配置(设置中间件),一样也是在settings.py文件里面:

MIDDLEWARE = [
    ···
    'corsheaders.middleware.CorsMiddleware',  # 解决跨域问题,注意与common.CommonMiddleware的顺序
    'django.middleware.common.CommonMiddleware',
    ···
]

我查了不少的文章,大致意思是说这个

'corsheaders.middleware.CorsMiddleware'

要放在最前面,我不太理解,我就没放,但是最后试了还是可以的,所以我觉得不是很必要,注意这两个的顺序就可以了我觉得。

最后的设置还是在settings.py文件中:

# 增加跨域忽略
CORS_ALLOW_CREDENTIALS = True
CORS_ORIGIN_ALLOW_ALL = True
# 允许所有方法
CORS_ALLOW_METHODS = ('*')
# 允许所有
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值