Reddit oAuth 与 AngularJS答案

【问题标题】：Reddit oAuth with AngularJSReddit oAuth 与 AngularJS
【发布时间】：2014-06-01 22:12:21
【问题描述】：

我似乎无法从 reddit 获取访问令牌。这是我的代码，我不断收到[Error] XMLHttpRequest cannot load https://ssl.reddit.com/api/v1/access_token. Origin http://127.0.0.1:9000 is not allowed by Access-Control-Allow-Origin. (oauth, line 0)

这里是相关的sn-p代码：

var clientId = '############';
var cliendSecret = '##################';
var redirectUri = encodeURI('http://127.0.0.1:9000/oauth');
var grantType = 'authorization_code';

var getAccessToken = function (code) {
  var url = 'https://ssl.reddit.com/api/v1/access_token';

  var attrs = {
    'grant_type': grantType,
    'code': code,
    'redirect_uri': redirectUri
  };

  var encodedAuthHeader = 'Basic ' + btoa(clientId + ':' + cliendSecret);
  var promise = $http(
    {
      url: url,
      method: 'POST',
      data: attrs,
      headers: {'Authorization': encodedAuthHeader}
    }).then(function(response) {
      return response;
    }, function(response) {
      return response;
    });

  return promise;
};

我能够使用 chrome 上的 postman 插件获取访问令牌，因此我检查了来自 postman 和 angular 的请求，它们有很大不同（POST 与 OPTIONS）。知道如何使用 Angular 创建类似的请求吗？我知道 angular 是首先发出 CORS 请求。这是reddit服务器不支持的东西吗？

谢谢！

邮递员：

  POST /api/v1/access_token HTTP/1.1
  Host: ssl.reddit.com
  Connection: keep-alive
  Content-Length: 403
  Cache-Control: no-cache
  User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/34.0.1847.116 Safari/537.36
  Origin: chrome-extension://fdmmgilgnpjigdojojpjoooidkmcomcm
  Authorization: Basic Vmd2dUNXT3RCb214d3c6YWh5d21kVXd4czJEXzhScThaNEhSU3ZzMG1F
  Content-Type: multipart/form-data; boundary=----WebKitFormBoundarytxCWa5t6OHsTtEU0
  Accept: */*
  Accept-Encoding: gzip,deflate,sdch
  Accept-Language: en-US,en;q=0.8
  Cookie: reddit_session=8647320%2C2014-02-05T14%3A38%3A09%2C668f4a063ccd2b118a7504c9849d9f0ec4595444

角度：

  OPTIONS /api/v1/access_token HTTP/1.1
  Host: ssl.reddit.com
  Connection: keep-alive
  Access-Control-Request-Method: POST
  Origin: http://127.0.0.1:9000
  User-Agent: Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/34.0.1847.116 Safari/537.36
  Access-Control-Request-Headers: accept, authorization, content-type
  Accept: */*
  Referer: http://127.0.0.1:9000/oauth?state=test&code=40V-fHS-4r8COQgKUP08Q8dgzkk
  Accept-Encoding: gzip,deflate,sdch
  Accept-Language: en-US,en;q=0.8

【问题讨论】：

要检查它是否真的只是一个CORS问题，您可以按照stackoverflow.com/questions/3102819/…中所述暂时禁用chrome检查
是的，这解决了问题！
@PieterHerroelen 知道如何在不禁用安全模式的情况下解决此问题吗？如何获得角度来忽略 Access-Control-Allow-Origin 标头？
@nknj 您是否成功实施了 oauth？您使用的是 chrome 扩展程序吗？我正在尝试做类似的事情，如果你有一个工作示例，我很乐意看到一些代码。

标签： javascript angularjs oauth reddit

【解决方案1】：

查看我对这个问题的回答，了解有关 CORS 的一些背景知识：Angular force disable CORS

在您的情况下，我认为您应该将 Content-Type 标头设置为 multipart/form-data。

对于所有请求：

 $httpProvider.defaults.headers.post = {'Content-Type': 'multipart/form-data'}

只需一个请求：

 $http.post(url,data, {headers: {'Content-Type': 'multipart/form-data'}})

【讨论】：