No 'Access-Control-Allow-Origin' error with PHP Nginx

Question

I'm using laravel for my backend and trying to send request with jQuery to Instagram api but I'm getting this error while response is OK in Chrome browser inspector

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.

and this is my code to send request

                $.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}}"
                }

            });

I've tried to add Access-Control-Allow-Origin in my Nginx default.conf file but that not solved my problem. How can I fix it?

I think you can follow this link. May be this will help. [http://stackoverflow.com/questions/6114436/access-control-allow-origin-error-sending-a-jquery-post-to-google-apis](http://stackoverflow.com/questions/6114436/access-control-allow-origin-error-sending-a-jquery-post-to-google-apis) — Md. Samsull Arefeen, May 14 '17 at 08:05

score 0 · Accepted Answer · edited May 23 '17 at 12:26

This error messages is because of CORS. In your browser, your AJAX request should be on the same origin. So if you are using example.com, Chrome will only support AJAX requests to example.com. Except, if an other domain (like api.instagram.com) has an Acces-Control-Allow-Origin header. You can read more about this here:

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

You could try to acess Instagram from your backend. This way your AJAX request is going to your backend on the same origin, and your backend can easily access Instagram's API.

Also you can try dataType: "jsonp", in this answer you can find out more:

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

You should try with `method: 'GET'`. Also check this tutorial, it should work: [Get photos from Instagram using jQuery](https://rudrastyh.com/javascript/get-photos-from-instagram.html) — Gábor Nádai, May 14 '17 at 08:59

No 'Access-Control-Allow-Origin' error with PHP Nginx

1 Answers1