企业管理系统定制开发正确配置Access-Control-Allow-Origin,千万不要设置成*

企业管理系统定制开发随着前后台架构的兴起,企业管理系统定制开发以及各种小程序、企业管理系统定制开发客户端等异地前端的部署架构,企业管理系统定制开发相信大家都经常会遇到CORS问题,CORS问题会阻止后台数据的正常返回,如果你搜索相关错误,你会遇到很多教程,教你修改Access-Control-Allow-Origin,解决CORS问题。

那这里我要多说一句,如果搜到的方案是让你把Access-Control-Allow-Origin配置成*,请不要这么做,至少在生产环境不要这么做。

Access-Control-Allow-Origin配置成*什么意思?意思是允许任意网站跨域访问该服务端口,在这种情况下,任意一个前端程序都可以随意集成该端口内容,实现数据获取。

那正确的方法是什么呢?应该配置成为你允许的网站。例如百家饭的域名是rongapi.cn,访问方式是https,那就应该是https://rongapi.cn/,最保险的获取该地址的方式是打开你的前端调试窗口,查看任意网络请求中标头里面origin的内容,如下图,请注意,有些地方会说要用referer的值,但是从下图我们可以看出,origin这个值和referer的值是不同的。

 那我们拿到这个origin的值,配置到Access-Control-Allow-Origin里面是完全没有问题的。

配置Access-Control-Allow-Origin的方法

配置Access-Control-Allow-Origin的地点可以有很多,在通常的负载均衡-Web服务器架构中,我们推荐可以在nginx配置中完成该配置。配置方法是在server段内或者location段内,添加

add_header 'Access-Control-Allow-Origin' 'xxxxx';

注意,配置成多域名不可以

那如果我们的业务域名是多个域名应该怎么办呢,我们在搜索该解决方案的时候,有时候会遇到有方案讲,把多个域名同时添加到里面,但是这个方案经测试已经过期或者不是一个正确方案。

正确的nginx配置方式是先测试http_origin是否符合要求,如果符合,将用户传入的http_origin填入中。

例如

  1. location / {
  2. if ($http_origin ~* "^https?://(rongapi.cn|www.rongapi.cn)$") {
  3. add_header Access-Control-Allow-Origin "$http_origin";
  4. }
  5. }

这里用的是正则表达式,当然直接使用=或者!=比较字符串也可以。

其他CORS常见的错误

post出错,get不出错

大量现代浏览器似乎会在post之前传输一个options来确认服务器行为,该现象在ios和android之间不统一。

如果你的web服务器没有能够处理该行为的关联关系,可能会出现get接口都是好的,但是post出错的情况,这时,我们需要为options操作配置一个特殊的返回结构,例如我们用到的(从网上摘抄)

  1. if ($request_method = 'OPTIONS') {
  2. add_header 'Access-Control-Allow-Origin' '*';
  3. #
  4. # Om nom nom cookies
  5. #
  6. add_header 'Access-Control-Allow-Credentials' 'true';
  7. add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS';
  8. #
  9. # Custom headers and headers various browsers *should* be OK with but aren't
  10. #
  11. add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type';
  12. #
  13. # Tell client that this pre-flight info is valid for 20 days
  14. #
  15. add_header 'Access-Control-Max-Age' 1728000;
  16. add_header 'Content-Type' 'text/plain charset=UTF-8';
  17. add_header 'Content-Length' 0;
  18. return 204;
  19. }

Options因为只是预请求,所以我们就不用麻烦去配 Access-Control-Allow-Origin了,反正正式请求的时候再判断也可以。

网站建设定制开发 软件系统开发定制 定制软件开发 软件开发定制 定制app开发 app开发定制 app开发定制公司 电商商城定制开发 定制小程序开发 定制开发小程序 客户管理系统开发定制 定制网站 定制开发 crm开发定制 开发公司 小程序开发定制 定制软件 收款定制开发 企业网站定制开发 定制化开发 android系统定制开发 定制小程序开发费用 定制设计 专注app软件定制开发 软件开发定制定制 知名网站建设定制 软件定制开发供应商 应用系统定制开发 软件系统定制开发 企业管理系统定制开发 系统定制开发