5

我尝试从仅限 Twitter 应用程序的身份验证接收 accessToken，但我不断收到来自 twitter api 的 405（不允许的方法）响应。有谁知道如何解决这个问题？我绝望地卡住了..

我知道以下事实：
- 最佳实践是从服务器端执行此操作，但我想在客户端使用 angular 进行尝试
- X-Requested-With 应该从标题中删除

这是我创建的工厂：

twitterServices.factory('Connect', function($http){
var factory = {};
var baseUrl = 'https://api.twitter.com/';

var bearerToken = function(){
    var consumerKey = encodeURIComponent('****');
    var consumerSecret = encodeURIComponent('****');
    var tokenCredentials = btoa(consumerKey + ':' + consumerSecret);

    return tokenCredentials;
};

factory.fetchAccessToken = function(scope){
    var oAuthurl = baseUrl + "oauth2/token";
    var headers = {
            'Authorization': 'Basic ' + bearerToken(),
            'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8'
        };
    $http.defaults.useXDomain = true;
    delete $http.defaults.headers.common['X-Requested-With'];
    $http({method: 'POST', url: oAuthurl, headers: headers, data: 'grant_type=client_credentials'}).
        success(function(data, status){
            scope.status = status;
            scope.data = data;
        }).
        error(function(data, status){
            scope.status = status;
            scope.data = data || "Request failed";
        });
};

factory.fetchTimeLine = function(scope){
    scope.fetchAccessToken();
    //the rest
};
return factory;
});

这是 Chrome 中的标头请求/响应：

Request URL:`https://api.twitter.com/oauth2/token`
Request Method:OPTIONS
Status Code:405 Method Not Allowed
Request Headersview source
:host:api.twitter.com
:method:OPTIONS
:path:/oauth2/token
:scheme:https
:version:HTTP/1.1
accept:*/*
accept-encoding:gzip,deflate,sdch
accept-language:en-US,en;q=0.8
access-control-request-headers:accept, authorization, content-type
access-control-request-method:POST
origin:`http://localhost`
referer:`http://localhost/test/app/
user-agent:Mozilla/5.0 (Macintosh; Intel Mac OS X 10_8_5) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/30.0.1599.69 Safari/537.36

Response Headersview source
content-length:0
status:405 Method Not Allowed
version:HTTP/1.1

我的控制台显示以下内容：

OPTIONS https://api.twitter.com/oauth2/token 405 (Method Not Allowed) angular.js:9312
OPTIONS https://api.twitter.com/oauth2/token Origin http://localhost is not allowed by Access-Control-Allow-Origin. angular.js:9312
XMLHttpRequest cannot load https://api.twitter.com/oauth2/token. Origin http://localhost is not allowed by Access-Control-Allow-Origin. (index):1
4

2 回答 2

1

我在使用 google API 时遇到了类似的问题，即使您在系统中注册了来自 localhost 的请求，它也会被拒绝。

我们通过向 /etc/hosts 文件添加多部分名称并将其绑定到 127.0.0.1 来解决此问题

例如

127.0.0.1 www.devsite.com

这解决了我为 API 编写角度服务时遇到的最基本问题

按要求更新：

公司控制对其 API 的访问的方法之一是通过白名单。当您向服务注册应用程序时，该平台通常会将您在应用程序中列出的域添加到其白名单中。通常这样做是为了强制您为单独的服务使用单独的 API 密钥。当您在本地进行测试时，这会使开发人员的工作变得困难。

在这种情况下，我相信 twitter 已经明确禁止使用 localhost 的请求，以防止使用 3rd 方工具和机器人。

将您使用 API 密钥注册的域绑定到 hosts 文件中，将导致您机器上对该域的任何 Web 请求跳过 dns 查找，而是将请求路由到本地开发服务器。这意味着您将在本地通过以下方式测试您的代码：

www.devsite.com:[what ever port your local server is running on]

这可能不是 100% 的 api 访问问题的解决方案，但它是我经历过的最常见的问题之一。

基于其他响应的注释：您可能会遇到与 CORS 相关的错误的原因有多种。但是仅仅因为你收到了一个并不意味着它不可能在前端实现你的代码。通常在 Angular CORS 中遇到以下情况：

a) 您未能正确格式化您的请求——其中一个示例可能是您添加了一个标头以指示 json 是预期结果，而实际上响应是文本。

b) 服务或 API 配置了一个白名单，需要明确包含“localhost”或本文中讨论的其他域。

于 2014-01-03T06:12:02.150 回答