Warning: file_get_contents(/data/phpspider/zhask/data//catemap/9/javascript/474.json): failed to open stream: No such file or directory in /data/phpspider/zhask/libs/function.php on line 167

Warning: Invalid argument supplied for foreach() in /data/phpspider/zhask/libs/tag.function.php on line 1116

Notice: Undefined index: in /data/phpspider/zhask/libs/function.php on line 180

Warning: array_chunk() expects parameter 1 to be array, null given in /data/phpspider/zhask/libs/function.php on line 181
Javascript Instagram API访问令牌请求和访问控制允许来源 上下文_Javascript_Ajax_Instagram_Access Token_Same Origin Policy - Fatal编程技术网

Javascript Instagram API访问令牌请求和访问控制允许来源 上下文

Javascript Instagram API访问令牌请求和访问控制允许来源 上下文,javascript,ajax,instagram,access-token,same-origin-policy,Javascript,Ajax,Instagram,Access Token,Same Origin Policy,我正在尝试使用Instagram API获取访问令牌 当用户成功验证并授权我的应用程序时,Instagram会使用代码参数将用户重定向到我的重定向uri。 获得此代码后,我将尝试调用Instagram API以获取访问令牌 问题 我已成功获取此代码,但为了进行此交换,我必须将代码以及一些应用程序标识参数发布到他们的访问令牌端点: $.ajax({ type: 'POST', url: 'https://api.instagram.com/oauth/access_token',

我正在尝试使用Instagram API获取访问令牌

当用户成功验证并授权我的应用程序时,Instagram会使用代码参数将用户重定向到我的重定向uri。 获得此代码后,我将尝试调用Instagram API以获取访问令牌

问题 我已成功获取此代码,但为了进行此交换,我必须将代码以及一些应用程序标识参数发布到他们的访问令牌端点

$.ajax({
    type: 'POST',
    url: 'https://api.instagram.com/oauth/access_token',
    // Disable credentials as they were enabled by default
    xhrFields: {
        withCredentials: false
    },
    crossDomain: true,
    data: {
        client_id: client_id,
        client_secret: client_secret,
        grant_type: 'authorization_code',
        redirect_uri: callback_http,
        code: token
    },
    }).always(function(res) {
    console.log('Res from Instagram API', res);
    });
问题是我遇到了一个访问控制允许源站问题:

XMLHttpRequest cannot load https://api.instagram.com/oauth/access_token.
No 'Access-Control-Allow-Origin' header is present on the requested resource.
Origin '[here is my callback_http]' is therefore not allowed access.
我尝试使用数据类型:“jsonp”作为Ajax调用的参数,但没有成功(401代码)


有什么想法吗?非常感谢您的帮助

在使用服务器端显式流时,必须为oauth使用服务器端代码,因为跨源请求,浏览器会阻止它。如果您只想使用javascript,那么就使用客户端隐式流,除非它托管在您的域中或您拥有url,否则您不能使用它

你可以参考这个

如果您是服务器的所有者,则可以使用htaccess解决您的问题。 stackoverflow中还有一个关于如何解决的问题


快乐编码!:D

使用window.location.href避免cors问题


window.location.href=
https://api.instagram.com/oauth/authorize/?app_id=${clientId}&redirect_uri=${redirectUri}&scope=${scope}&response_type=${responseType}

服务器端意味着必须从您的服务器访问它:)好的,我明白了。顺便问一下,您是否有任何解释,为什么这种完全相同的流(由于NodeJS/Express routing和Javascript,服务器端代码混合在一起)适用于Dropbox而不适用于Instagram?不确定它们的头是否具有访问控制。另外,如果您在node?中进行上述instagram ajax调用,那么它应该可以工作。这是最好的解释。实际上否:-节点与Instagram重定向后的路由匹配;-然后呈现一个进行上述Ajax调用的HTML页面。我被迫这样做,因为我想将访问令牌发布到我的API。对我的API的每次调用都必须经过签名(感谢cookies),因此是从客户端进行的。