【记录】Django解决与VUE跨域问题

1 梗概

这里记录Django与VUE的跨域问题解决方法,主要修改内容是在 Django 中。当然其他的前端项目 Django 也可以这样处理。

2 安装辅助包

复制代码
pip install django-cors-headers

3 配置 settings.py

INSTALLED_APPS = [

...

'corsheaders',

...

]

为了响应头的处理,更新MIDDLEWARE设置,确保CorsMiddleware位于适当的位置:

MIDDLEWARE = [

确保CorsMiddleware放置在可以生成响应的中间件之前,例如CommonMiddleware之前。

'corsheaders.middleware.CorsMiddleware',

'django.middleware.common.CommonMiddleware',

其他中间件...

同时可注释掉

'django.middleware.csrf.CsrfViewMiddleware',

]

可以通过设置CORS_ALLOWED_ORIGINS来指定哪些域被允许访问你的API:

CORS_ALLOWED_ORIGINS = [

"http://example.com",

"https://another-example.com",

]

若在开发阶段希望允许任何源,可以暂时设置为:

CORS_ALLOW_ALL_ORIGINS = True

开发过程中 可在settings.py 中增加下面的内容,

复制代码
CORS_ALLOW_CREDENTIALS = True
CORS_ALLOW_ALL_ORIGINS = True
CORS_ALLOW_HEADERS = ('*')

【注】在生产环境中应该明确限制来源以增强安全性

相关推荐
用户2136610035721 小时前
Vue2非父子通信与动态组件
前端·vue.js
金銀銅鐵16 小时前
[Python] 扩展欧几里得算法
python·数学·算法
Duckdblab17 小时前
DuckDB 性能调优终极指南:打造闪电般的分析体验
python
如果超人不会飞17 小时前
脉络清晰的业务演进:TinyVue Timeline 时间线组件全方位实战指南
vue.js
如果超人不会飞17 小时前
从扁平到立体:掌握 TinyVue Grid 树形表格的高级实战指南
vue.js
带派擂总17 小时前
Python全栈开发精华版最全合集(包含各种面试题) Day24_异常和错误
python
用户21366100357220 小时前
Vue2组件化开发与父子通信
前端·vue.js
金銀銅鐵20 小时前
n^5 和 n 的个位数是否总相等?
python·数学
用户21366100357221 小时前
Vue2事件系统与指令进阶
前端·vue.js