来自nginx的422状态代码的响应缺少“Access-Control-Allow-Origin”标头

时间:2017-09-06 11:46:51

标签: nginx cors http-error

nginx配置如下:

server {
            listen 80;
            listen [::]:80;

            add_header 'Access-Control-Allow-Origin' $http_origin;
            add_header 'Access-Control-Allow-Methods' 'GET, POST, OPTIONS, DELETE, PUT, PATCH';
            add_header 'Access-Control-Allow-Headers' 'DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Content-Range,Range';
            add_header 'Access-Control-Max-Age' 1728000;

            server_name erp.dev.thinkerx.com;
            access_log  /home/thinkerx/nginx/access.log;
            error_log /home/thinkerx/nginx/error.log;
            location ~ /.well-known {
                    allow all;
            }

            # The rest of your server block
            root /usr/share/nginx/html/men2017-back-dev/public;
            index index.html index.htm index.php;

            location /api/ {
                    try_files $uri $uri/ /index.php$is_args$args;
            }

            location ~ \.php$ {
                            try_files $uri /index.php =404;
                            fastcgi_pass 127.0.0.1:9000;
                            fastcgi_index index.php;
                            fastcgi_buffers 16 16k;
                            fastcgi_buffer_size 32k;
                            fastcgi_param SCRIPT_FILENAME $document_root$fastcgi_script_name;
                            include fastcgi_params;
                    }
    }

js代码如下:

$.ajax({
    type: 'post',
    dataType: 'json',
    contentType: 'application/json; charset=UTF-8',
    url: "http://erp.dev.thinkerx.com/api/external/material/catalogs",
    data: JSON.stringify({
        domain_id: 2222,
        code:'X01',
        name:'123063'
    }),
    success: function (response) {
        console.log(response);      
    },
    error: function (xhr, status, error) {
        console.log(xhr, status, error);    
    },
});
然后,在浏览器中发送请求,chrome控制台显示两个请求。第一个请求是预检,方法是 OPTION 。第二个是真实请求并且有响应,其状态代码是201。 preflight request

{"data":{"id":"16b7d6a0-9eb6-42ca-9ddb-fc61f5e082c0","domain_id":2222,"name":"1230464","code":"X01","parent_id":null,"created_at":1504698369,"updated_at":1504698369}}

如上所述,事情是预期的,但我更新了ajax数据。

$.ajax({
    type: 'post',
    dataType: 'json',
    contentType: 'application/json; charset=UTF-8',
    url: "http://erp.dev.thinkerx.com/api/external/material/catalogs",
    data: JSON.stringify({
        domain_id: 2222,
        code:'X01',
        // name:'123063'
    }),
    success: function (response) {
        console.log(response);      
    },
    error: function (xhr, status, error) {
        console.log(xhr, status, error);    
    },
});

我再次发送请求。偶然发生错误。 also two requests, the second status code is 422

  

{“message”:“验证失败”,“错误”:[[“密钥名称必须为   本 “]]” STATUS_CODE“:422}

     

XMLHttpRequest无法加载   http://erp.dev.thinkerx.com/api/external/material/catalogs。没有   请求中存在“Access-Control-Allow-Origin”标头   资源。因此,不允许原点“http://localhost”访问。   响应的HTTP状态代码为422。

我有一些问题如下:

  1. 为什么报告同一来源政策错误?
  2. 我在控制台中看到响应,为什么ajax xhr.responseJSON未定义?如何获取回复?

1 个答案:

答案 0 :(得分:2)

我有同样的问题。问题是nginx仅为200,204,301,302和304状态代码添加标头。

要为每种类型的状态代码获取相同的标题,您必须在add_header指令的末尾添加[always],如下所示。

add_header 'Access-Control-Allow-Origin' $http_origin always;

希望它能帮到你)