因为业务需要,在每一个请求里面都需要添加token等验证信息。但是在axios的请求的headers里面加了token等字段后,出现了跨域错误

from origin ‘http://192.168.1.100:8020’ has been blocked by CORS policy: Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

但是之前在项目中已经使用django-cors-headers做了跨域配置了呀。啥问题呢??

首先,通过请求发现,添加了token之后,请求会先发出一个OPTIONS请求,大概是查询后台服务允许请求的方法,和headers字段。

由于使用了全局组件拦截了非post请求,所以就出现了被拦截时返回的错误信息。所以需要把OPTIONS请求给放出去,不拦截它了。

接着,由于options请求会查询配置允许的headers信息,所以将headers要携带的参数配置到django允许的headers服务里面。

...
token,
signature
...

配置完成后重启服务。这时重新发起请求,你会发现,OPTIONS请求没有了,只有一个post请求。而且比对返回的res信息,也会发现返回时,headers里面携带的一些数据也会被返回。

所以解决方法的步骤是
1.允许OPTIONS请求
2.配置跨域的headers信息
3.重启服务

Logo

华为开发者空间,是为全球开发者打造的专属开发空间,汇聚了华为优质开发资源及工具,致力于让每一位开发者拥有一台云主机,基于华为根生态开发、创新。

更多推荐