【记录】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 = ('*')

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

相关推荐
江城开朗的豌豆4 分钟前
Vue图片懒加载:极简方案 vs 兼容全攻略
前端·javascript·vue.js
都叫我大帅哥8 分钟前
Python中的TypedDict:给字典穿上类型的外衣
python
江城开朗的豌豆9 分钟前
Vue组件data必须用函数?这个设计暗藏玄机!
前端·javascript·vue.js
amazinging16 分钟前
北京-4年功能测试2年空窗-报培训班学测开-第五十天
python·学习·面试
江城开朗的豌豆24 分钟前
组件封装实战:如何设计灵活又好用的前端组件?
前端·javascript·vue.js
橡晟8 小时前
深度学习入门:让神经网络变得“深不可测“⚡(二)
人工智能·python·深度学习·机器学习·计算机视觉
墨尘游子8 小时前
神经网络的层与块
人工智能·python·深度学习·机器学习
倔强青铜39 小时前
苦练Python第18天:Python异常处理锦囊
开发语言·python
企鹅与蟒蛇9 小时前
Ubuntu-25.04 Wayland桌面环境安装Anaconda3之后无法启动anaconda-navigator问题解决
linux·运维·python·ubuntu·anaconda
autobaba9 小时前
编写bat文件自动打开chrome浏览器,并通过selenium抓取浏览器操作chrome
chrome·python·selenium·rpa