Node.js 否'；访问控制允许原点'；当使用角度传感器时，会出现表头

我试图使用angular->节点->twitter将oauth发送到twitter，但我不断收到错误

请求的资源上不存在“Access Control Allow Origin”头。因此，向混合中添加角度时，不允许访问原点“null”

。我的应用程序配置

• 在端口4200上运行的Angular UI
• 在端口3000上运行的Express节点服务器
• 服务器上的CORS被设置为允许访问节点的源localhost:4200 api调用

使用调用快捷路线的快捷模板可以很好地工作，如下所示

模板->本地主机：3000/auth/twitter

Response Headers
    Access-Control-Allow-Credentials:true
    Access-Control-Allow-Origin:http://localhost:4200
    Location:https://api.twitter.com/oauth/authenticate?oauth_token=placeholdertokenstackoverflow
    Vary:Origin

Request Headers
    Host:localhost:3000
    Referer:http://localhost:3000/

RESPONSE HEADERS
    Access-Control-Allow-Credentials:true
    Access-Control-Allow-Origin:http://localhost:4200
    Location:https://api.twitter.com/oauth/authenticate?oauth_token=placeholdertokenstackoverflow
    Vary:Origin

REQUEST HEADERS
    Host:localhost:3000
    Origin:http://localhost:4200
    Referer:http://localhost:4200/

localhost:3000/auth/twitter->//api.twitter.com/oauth/…

GENERAL
    Request URL:https://api.twitter.com/oauth/authenticate?oauth_token=placeholdertokenstackoverflow
    Request Method:GET
    Status Code:200 

Request Headers
    :authority:api.twitter.com
    :method:GET
    :scheme:https
    referer:http://localhost:3000/

GENERAL
    Request URL:https://api.twitter.com/oauth/authenticate?oauth_token=placeholdertokenstackoverflow
    Request Method:GET
    Status Code:200 

REQUEST HEADERS
    :authority:api.twitter.com
    :method:GET
    :scheme:https
    ***origin:null
    referer:http://localhost:4200/***

当使用angular调用express routes而不是模板时，会导致我假设的CORS错误，如下所示

angular.http.get->localhost:3000/auth/twitter

Response Headers
    Access-Control-Allow-Credentials:true
    Access-Control-Allow-Origin:http://localhost:4200
    Location:https://api.twitter.com/oauth/authenticate?oauth_token=placeholdertokenstackoverflow
    Vary:Origin

Request Headers
    Host:localhost:3000
    Referer:http://localhost:3000/

RESPONSE HEADERS
    Access-Control-Allow-Credentials:true
    Access-Control-Allow-Origin:http://localhost:4200
    Location:https://api.twitter.com/oauth/authenticate?oauth_token=placeholdertokenstackoverflow
    Vary:Origin

REQUEST HEADERS
    Host:localhost:3000
    Origin:http://localhost:4200
    Referer:http://localhost:4200/

localhost:3000/auth/twitter->//api.twitter.com/oauth/…

GENERAL
    Request URL:https://api.twitter.com/oauth/authenticate?oauth_token=placeholdertokenstackoverflow
    Request Method:GET
    Status Code:200 

Request Headers
    :authority:api.twitter.com
    :method:GET
    :scheme:https
    referer:http://localhost:3000/

GENERAL
    Request URL:https://api.twitter.com/oauth/authenticate?oauth_token=placeholdertokenstackoverflow
    Request Method:GET
    Status Code:200 

REQUEST HEADERS
    :authority:api.twitter.com
    :method:GET
    :scheme:https
    ***origin:null
    referer:http://localhost:4200/***

---

向上看

origin:null

在angular呼叫快速路线时出现。尽管express server在这两个实例中的设置相同，并调用twitter，但标题是不同的，我不理解。角度设置视图而不是express是否会使浏览器对请求的来源感到困惑？

修改节点服务器以添加标头访问控制允许来源：*以从任何位置启用跨来源请求（或指定域而不是*）。这应该能解决你的问题。 以下是我解决问题的方法：

const app = express()
app.use(function(req, res, next) {
    res.header("Access-Control-Allow-Origin", "*");
    res.header(
        "Access-Control-Allow-Headers",
        "Origin, X-Requested-With, Content-Type, Accept"
    );
    next();
});

---

如果您使用的是Express，您可以试试这个

编辑：

---

嗯。你的服务器和你的express服务器在不同的服务器上吗？通常，使用express作为中间商是为了避免CORS。如果您请求express，为什么您的请求的位置是twitter api？express与此有什么关系？从我在这里看到的情况来看，您实际上并没有在这个请求中使用express。有些东西看起来很不对劲。angular调用express server，该服务器配置向twitter进行身份验证所需的设置。然后express调用验证twitter，获取令牌并通过angularOk将其转发回浏览器，从这里开始。从测试中删除twitter api。你能用这种方式与express服务器通信吗？还有。。。为什么要为OAuth使用中间人服务器？你不应该这样做。twitter需要我不能向浏览器公开的凭据，如我的应用程序令牌和机密。是的，这是一个更大的应用程序的一部分，可以与express server配合使用。请在您的帖子中包含一个解决方案。不要只链接到一个。