文章目录
- 一、静态资源文件配置
- 二、域名配置
- 三、前后端跨域问题
- 1.安装django-cors-headers
- 2.添加应用
- 3. 添加中间件
- 4.设置白名单
- 5.允许访问的域名
一、静态资源文件配置
settings文件加如下代码
代码语言:javascript复制STATIC_URL = '/static/'
# STATIC_ROOT = posixpath.join(*(BASE_DIR.split(os.path.sep) ['static']))
#告知系统去哪里 查找静态文件
STATICFILES_DIRS = [
os.path.join(BASE_DIR,'static'),
]
二、域名配置
编辑文件
代码语言:javascript复制sudo vim /etc/hosts
将两个域名添加到文件中
代码语言:javascript复制127.0.0.1 api.xxxx.com
127.0.0.1 www.xxxx2.com
前端xxxx/js目录中,创建host.js文件用以为前端保存后端域名
代码语言:javascript复制var host = 'http://api.xxxx.com:8000';
在所有需要访问后端接口的前端页面中都引入host.js,使用host变量即可指代后端域名
修改setting.py中的ALLOWED_HOSTS
代码语言:javascript复制ALLOWED_HOSTS = ['127.0.0.1', 'api.xxxx.com', 'www.xxxx2.com','localhost']
#或者设置 通配域名,允许全部域名
ALLOWED_HOSTS = ['*']
三、前后端跨域问题
来自A服务器的js发起请求B服务器的资源或服务称之为跨域请求 如果前端与后端的数据来自不同的域名,就会形成跨域问题,只要是协议、域名、端口三者其一不同那就会形成跨域,我们可以使用 CORS 来解决后端对跨域访问的支持
1.安装django-cors-headers
代码语言:javascript复制pip install django-cors-headers
2.添加应用
我们打开项目配置文件,在INSTALLED_APPS列表添加corsheaders
代码语言:javascript复制INSTALLED_APPS = (
...
# 添加 django-cors-headers 使其可以进行 cors 跨域
'corsheaders',
...
)
3. 添加中间件
我们打开项目配置文件,在MIDDLEWARE 列表添加corsheaders中间件
代码语言:javascript复制MIDDLEWARE = [
...
# 添加 django-cors-headers 使其可以进行 cors 跨域,放在最上面注册
'corsheaders.middleware.CorsMiddleware',
]
4.设置白名单
因为从前端发起的请求与后端不一致,我们需要给它设置白名单让它允许访问
我们打开项目配置文件,添加CORS_ORIGIN_WHITELIST 列表如下
代码语言:javascript复制# CORS跨域请求白名单设置
CORS_ORIGIN_WHITELIST = (
'http://127.0.0.1:8080',
'http://localhost:8080',
'http://www.mysite.site:8080',
)
CORS_ALLOW_CREDENTIALS = True # 允许携带cookie
5.允许访问的域名
即使设置了白名单,那只是为了解决跨域问题,但如果在ALLOWED_HOSTS 列表没有添加允许访问的域名那也是不行的(就算是不跨域也不行),所以可以在ALLOWED_HOSTS 添加指定的域名或全部域名
我们打开项目配置文件(这里是dev.py),修改ALLOWED_HOSTS 列表如下
代码语言:javascript复制ALLOWED_HOSTS = ['www.mysite.site']
#或者设置 通配域名,允许全部域名
ALLOWED_HOSTS = ['*']