记一次跨域和nginx配置问题

问题描述

1. 请求是跨域请求，从a.mycompony.com到b.mycompony.com；后端设置了以下参数,表示前端容许post和get方式跨域请求

response.setHeader("Access-Control-Allow-Origin", "*");
response.setHeader("Access-Control-Allow-Methods", "POST,GET");
response.setHeader("Access-Control-Allow-Headers", "Authentication,Content-Type");

1. 一样的跨域请求，get方式的请求可以正常访问到上游服务器，post请求却不能，报403 forbidden request；
2. 还有一个重要信息，这个post请求在之前是能够正常访问到后端的，而且前段没有改动过这部分代码

问题排查

1. 请求方式不一样，致使差别，说明问题出在后端服务器上游；
2. 前端没有变更，且之前能够正常访问，说明问题出在代理服务器nginx上
3. 查看nginx配置，发现相似以下代码

if($request_method != (POST|GET|HEAD)){
    return 403;
}

关于跨域

1. 跨域可分为简单请求和非简单请求
2. 简单请求相似正常请求，只是在请求头信息和响应头加以区别；
3. 非简单请求会将请求分为两次请求，第一次的请求为OPTION方式，用于预检是否支持第二次的请求方式、域名的访问请求，好比POST等；例如后端设置：

response.setHeader("Access-Control-Allow-Origin", "a.mycompony1.com");
response.setHeader("Access-Control-Allow-Methods", "POST,GET");

若是前端请求用PUT方式或者跨域域名为b.mycompony.com，后端返回200状态码，可是实际是不容许跨域的。错误以XHR对象的onError事件表现出来，须要前端用户手动处理。若是容许访问，则进行第二次相似简单请求的请求

OPTIONS /getListCORS HTTP/1.1
Origin: http://b.mycompony.com
Access-Control-Request-Method: PUT

总结：咱们的403报错是由于nginx不支持OPTION请求方式的访问，删除访问限制后可正常进行 参考文档： 阮一峰的blo MDN开发者文档