跨域请求被阻止:同源策略不允许在 https://localhost:3000/ 读取远程资源 [重复]

Posted

技术标签:

【中文标题】跨域请求被阻止:同源策略不允许在 https://localhost:3000/ 读取远程资源 [重复]【英文标题】:Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at https://localhost:3000/ [duplicate] 【发布时间】:2019-09-17 17:00:13 【问题描述】:

解决方案:事实证明我需要将 https://localhost:3000 更改为 http://localhost:3000。 (我的后续问题是为什么会这样,尤其是当我的代码适用于 https://www.remoteserver.com/` 时)。


我在https://localhost:3000 有一个开发服务器,在https://www.remoteserver.com (Node.js/Express) 有一个生产服务器。我的客户在https://localhost:4200(Angular)。

我使用以下代码修复了 https://www.remoteserver.com 的跨域请求被阻止问题:

var cors = require(cors());
app.use(cors());
app.options('*',cors());
var allowCrossDomain = function(req,res,next) 
  res.header('Access-Control-Allow-Origin', '*');
  res.header('Access-Control-Allow-Methods', 'GET, PUT, POST, DELETE');
  res.header('Access-Control-Allow-Headers', 'Content-Type');
  next();  

app.use(allowCrossDomain);

但是对我的开发服务器 https://localhost:3000 使用相同的代码我仍然面临 CORS 被阻止的问题,并且我无法摆脱这个问题。

上面的代码是否有任何理由适用于生产服务器但不适用于开发服务器?

关于修复的任何想法或我接下来应该尝试什么?

非常感谢!

【问题讨论】:

这里有一个想法:Allow CORS with localhost in Chrome. 是的,感谢您转发该链接(CORS 错误:“请求仅支持协议方案:http...”)。这提供了解决方案(即将 https 更改为 http)。 我刚google了一下,懒得尝试了,但这应该可以,将确切的主机名放在标题中medium.com/@alexishevia/using-cors-in-express-cac7e29b005b 【参考方案1】:

三种解决方案,避免CORS问题

    允许 CORS 到服务器端 使用代理服务器 使用 JSONP

尝试如下方式使用

app.use(function(req, res, next) 
  res.header("Access-Control-Allow-Origin", "*");
  res.header("Access-Control-Allow-Methods", "GET, PUT, POST");
  res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  next();
);

了解详情link

【讨论】:

谢谢。事实证明,在这种情况下不起作用。 . .解决方法是将 https 更改为 http,但我非常感谢您的意见和帮助!

以上是关于跨域请求被阻止:同源策略不允许在 https://localhost:3000/ 读取远程资源 [重复]的主要内容,如果未能解决你的问题,请参考以下文章

跨域请求被阻止:同源策略不允许读取远程资源

跨域请求被阻止:同源策略不允许在 http://........ 读取远程资源

Ajax:跨域请求被阻止:同源策略不允许读取远程资源

跨域请求被阻止:同源策略不允许在 http://localhost3000 读取远程资源

Ajax 跨域请求被阻止:同源策略不允许读取远程资源

跨域请求被阻止:同源策略不允许读取某个 URI 处的远程资源