Question

我在后端使用laravel并尝试使用jQuery向Instagram发送请求但是我在Chrome浏览器检查器中的响应正常时收到此错误

test?code=a3679b3…:1 XMLHttpRequest cannot load https://api.instagram.com/oauth/access_token. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://example.com' is therefore not allowed access.

这是我发送请求的代码

                $.ajax({
                method: 'POST',
                url: 'https://api.instagram.com/oauth/access_token',
                data: {
                    client_id: "client_id",
                    client_secret: "client_secret",
                    grant_type: "authorization_code",
                    redirect_uri: "example.com",
                    code: "{{$code}}"
                }

            });

我已尝试在我的Nginx Access-Control-Allow-Origin文件中添加default.conf，但这并未解决我的问题。我该如何解决？

Answer 1

此错误消息是由于CORS。在您的浏览器中，您的AJAX请求应该在同一个源上。因此，如果您使用的是example.com，Chrome将仅支持对example.com的AJAX请求。但是，如果其他域（如api.instagram.com）具有Acces-Control-Allow-Origin标头。你可以在这里阅读更多相关信息：

https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS

您可以尝试从后端访问Instagram。这样你的AJAX请求就会在同一个源头上发送到你的后端，你的后端可以轻松访问Instagram的API。

您也可以尝试dataType: "jsonp"，在这个答案中您可以找到更多信息：

instagram jquery ajax type="GET, can't get around CORS

No＆＃39; Access-Control-Allow-Origin＆＃39; PHP Nginx出错

1 个答案: