Angular/Node/Express/Passport - 连接到 facebook（CORS）时的问题

Posted 2023-03-04

【中文标题】Angular/Node/Express/Passport - 连接到 facebook（CORS）时的问题

【英文标题】：Angular/Node/Express/Passport - Issues when connecting to facebook(CORS)

【发布时间】：2014-07-08 08:53:49

【问题描述】：

我正在尝试在我的 NodeJs 服务器上使用 facebook 身份验证。我来到http://scotch.io/ 的教程，并在使用 REST 客户端（邮递员等）时让它在本地工作。

为了改进 UI，我使用 Angular JS 作为前端。但是当我调用 http.get 到我在 NodeJs 后端给出的特定路由时，我在 chome 和 firefox 中收到以下错误：

XMLHttpRequest 无法加载 https://www.facebook.com/dialog/oauth?response_type=code&redirect_uri=http%…0%2Fapi%2Fauth%2Ffacebook%2Fcallback&scope=email&client_id=3000000000006。请求的资源上不存在“Access-Control-Allow-Origin”标头。因此不允许访问 Origin 'localhost:8080'。

我已经在 *** 上尝试了几种解决方案，但仍然无法正常工作... 我的 NodeJs 使用 Express 4.* 和一个 CORS 中间件。 对于 Angular，我找到了几种启用 CORS 的方法，目前都没有。

希望你能帮助我：D 提前谢谢！

【问题讨论】：

您正在尝试向您在帖子中的 facebook.com-url 发出 ajax 请求。 Facebook 不允许你这样做。而且我不明白您最有可能希望在弹出窗口中打开该网址或重定向到它会做什么

你能解决这个问题吗？我也有同样的问题

@LarissaLeite，不，我还没有

有什么解决办法吗？我遇到了同样的问题。

【参考方案1】：

您可以在 Angular 控制器 中使用 'window.location="http://localhost:3000/auth/facebook"';，然后将请求发送到包含 passport.authenticate 内容的 Express 服务器。

这将阻止您将 facebook 身份验证对话页面称为 AJAX 请求。

它对我有用！

【讨论】：

看起来和感觉就像一个黑客。这是唯一的方法吗！？

是的，我没有找到解决方案，但无论如何它都能正常工作！

【参考方案2】：

我也将 Angular 与 Node/Express 一起使用，并且以下功能适用于我自己的后端服务（老实说，我目前没有在 Facebook 上使用它），所以请检查一下：

var allowCrossDomain = function(req, res, next) 
    res.header('Access-Control-Allow-Origin', '*');
    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');
    res.header('Access-Control-Allow-Headers', 'Content-Type, Authorization, Content-Length, X-Requested-With, Access-Control-Allow-Origin');
    res.header("Access-Control-Max-Age", "86400"); // 24 hours

    // intercept OPTIONS method
    if ('OPTIONS' == req.method) 
        res.send(200);
    
    else 
        next();
    
;

然后，您需要在app.confiure()方法中使用它，如下所示：

// configure Express
app.configure(function() 
   app.use(allowCrossDomain);
    ...
);

在所有其他指令之前使用它很重要！

【讨论】：

嗯，我试过了！到目前为止还没有工作，在我第一次打电话后原点更改为 localhost:8080，这就是问题的来源

这不适用于上述问题中的情况。问题是来自 facebook 的响应没有设置 CORS 标头。 Postman 没有问题的原因是它没有像浏览器那样检查 CORS 标头（出于安全原因）。您可以通过制作一个简单的 location.href 而不是 http.get

来解决问题

会试试看！ @Andreas 感谢您的回复