Question

我有一个使用Passport Steam策略的网站。我的服务器（Node with Express）当前正在localhost：3000上运行，而我的前端正在localhost：8080上运行。只有在尝试通过Steam进行授权时，我才会遇到跨域问题。我的请求是通过Axios进行的，我使用的是CORS。我花了几个小时谷歌搜索和尝试各种各样的东西，但我似乎无法让它工作。

这是我得到的错误：

XMLHttpRequest无法加载 https://steamcommunity.com/openid/login?openid.mode=checkid_setup&openid.ns ... 3000％2Fsteam％2Fauth％2Freturn＆安培; openid.realm = HTTP％3A％2F％2Flocalhost％3A3000％2F。请求中不存在“Access-Control-Allow-Origin”标头资源。因此，不允许原点'null'访问。

这是从前端调用路线的地方：

    linkSteam(){
        api('http://localhost:3000/steam/auth')
            .then(res => {
                console.log(res);
                state.user = res.data.user;
            })
    }

这是我前端的axios配置。

let api = axios.create({
  baseURL: 'http://localhost:3000/api/',
  timeout: 3000,
  withCredentials: true
})

我的CORS设置如下

var whitelist = ['http://localhost:8080', 'https://steamcommunity.com', 'http://localhost:3000', 'null'];
// I added null here as someone said that it worked as their origin displayed null like mine does
var corsOptions = {
  origin: function (origin, callback) {
    var originIsWhitelisted = whitelist.indexOf(origin) !== -1;
    callback(null, originIsWhitelisted);
  },
  credentials: true
};

然后我将我的CORS导入我的主文件并按如下方式使用

app.use(cors(corsOptions))
app.use('*', cors(corsOptions))

我一直看到你可以设置你的Access-Control-Allow-Credentials等，并且这样做了

app.use(function (req, res, next) {
  res.setHeader('Access-Control-Allow-Credentials', true);
  res.setHeader('Access-Control-Allow-Origin', 'http://localhost:8080');
  res.setHeader('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE');
  res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With, X-HTTP-Method-Override, Content-Type, Accept');
  if ('OPTIONS' == req.method) {
     res.send(200);
   } else {
     next();
   }
});

这没有帮助。我已经尝试分解我的原始函数，其中调用/ steam / auth并运行console.log（req.headers.origin）并吐出我正确的URL，但是然后错误仍然报告Origin为null。如果我将Access-Control-Allow-Origin'设置为'*'，我会得到一个稍微不同的错误，我必须提供凭据，因此不允许Origin'localhost：8080'。

这是我的/ steam / auth路线。

router.get('/steam/auth',
  passport.authenticate('steam', {
    failureRedirect: '/'
  }),
  function (req, res) {
    res.redirect('/');
  });

如果我点击无法加载的网址然后登录Steam，这会有效。然后它会将我的Steam配置文件信息完整地重定向回我的网站。错误是尝试将初始重定向返回Steam以便登录。我也尝试在res.redirect中执行此操作，直到他们的直接URL，我得到了同样的错误。

提前感谢您的帮助！如果我错过重要信息，请告诉我。我试图把所有东西都包括在内，但如果我错过了什么，我就不会感到惊讶。

Answer 1

如果问题中的错误消息是浏览器报告的实际消息，那是因为您的客户端代码正在尝试向https://steamcommunity.com/openid/login发送请求。

因此，无论您在localhost:3000上对节点服务器进行了哪些配置更改，都不会改变任何内容。相反，您似乎需要弄清楚客户端代码向https://steamcommunity.com/openid/login发送请求的位置以及原因。

请求https://steamcommunity.com/openid/login失败的原因是服务器在其响应中不包含Access-Control-Allow-Origin响应标头。

https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS有更多详情。

因为您无法更改服务器的行为，所以只要缺少Access-Control-Allow-Origin标头，您的浏览器就会继续阻止您的代码获取响应。

我不知道Steam如何处理授权，但您可能需要以某种方式通过现有的Node后端向Steam发出授权请求，或者使用例如{{3}来设置您自己的CORS代理}，并通过它将您的客户端授权请求代理到Steam。

没有'Access-Control-Allow-Origin'，Origin'null'不允许访问 - Passport-SteamStrategy，Node

1 个答案: