Angular 和 Node 的 Oauth

Posted 2023-03-04

【中文标题】Angular 和 Node 的 Oauth

【英文标题】：Oauth with Angular and Node

【发布时间】：2016-03-08 07:14:05

【问题描述】：

我无法让 oauth 在 Angular 上工作。 当我直接输入浏览器的链接时

http://localhost:8080/auth/twiter

我能够使用 oauth 进行连接并获得响应 但是，当我尝试使用以下代码以角度进行操作时

    login_twitter : function login_twitter()
    var deferred = $q.defer();

    $http.get('auth/twitter')
      .success(function (data,status)
        if(status === 200 && data.state=='success')
          user = data.user.name;
          defered.resolve();
        
        else
          deferred.reject();
        
      )
      .error(function (data)
        deferred.reject();
      );
    return deferred.promise;

我从浏览器收到一个错误

XMLHttpRequest cannot load ....link... No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access.

在我的服务器中，我尝试使用 (res.header 和 res.setHeader)

app.use(function (req, res, next) 

    res.setHeader('Access-Control-Allow-Origin', 'http://localhost:8080');
    res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');
    res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type');
    res.setHeader('Access-Control-Allow-Credentials', true);

    next();
);

谁能帮帮我？我被困了一段时间。 或者是否有任何可以使用 Oauth 使用 angular 和 node 登录的示例，因为大多数教程都使用 node 和 ejs/jade

【参考方案1】：

Twitter 身份验证策略要求用户登录 Twitter，并允许您的“应用”权限访问您的 Twitter 帐户信息。这不能通过 XHR 完成，因为如果用户尚未登录，用户将如何输入他们的 Twitter 凭据来登录 Twitter？如果请求是通过 XHR 发送的，用户将如何批准您的 Twitter“应用”请求的权限？

这适用于所有使用 OAuth 或 OpenID 的 Passport 策略。用户的浏览器必须直接访问身份验证提供程序的站点，以便他们可以 A) 登录身份验证提供程序或 B) 批准您在应用程序中请求的权限。一旦用户完成了该操作，身份验证提供程序（在您的情况下为 Twitter）将使用某种令牌将用户的浏览器重定向回您的应用程序的端点，然后您的应用程序将使用该令牌从身份验证提供程序请求信息（例如电子邮件地址，全名等）

【讨论】：

谢谢，我可以直接输入链接localhost:8080/auth/twiter得到回复。但是，返回类型是一个对象 status, user，它打印在页面的前端。有什么方法可以从对象中读取吗？我尝试阅读该对象，然后重定向到有角度的其他页面

@user3423482 您必须更改服务器端应用程序以将该信息存储在用户会话中，然后重定向回您的 Angular 应用程序所在的页面。在该页面上，您要么希望将来自用户会话的信息直接放入*** javascript 对象并从中读取角度，要么让您的角度应用程序向您的服务器发出 ajax 请求以获取用户的会话数据。