蒸汽API接入控制允许原始问题

Steam API Access-Control-Allow-Origin Issue

本文关键字：原始 问题 许原始 API 接入 控制 蒸汽      更新时间：2023-09-26

对web编程有点陌生，对此有点困惑。我有一个基本的express node.js web服务器来提供一个网站。我想把一个gameid交给一个函数，让它使用他们的web api从steam获取成就信息，应该使用以下RESTapi调用来支持：

https://developer.valvesoftware.com/wiki/Steam_Web_API#GetGlobalAchievementPercentagesForApp_.28v0002.29

我有一个正在提供的脚本文件，我正试图在这样的客户端文件中进行请求。

function GetSteamGameAchievements(appid)
{
   var request = new XMLHttpRequest();
    request.addEventListener('load',function(){
       console.log(JSON.stringify(this.responseText));
    });
    request.open("GET","http://api.steampowered.com/ISteamUserStats/GetGlobalAchievementPercentagesForApp/v0002/?gameid="+ appid + "&format=json",true);
    request.send(null);
}

我得到以下错误

XMLHttpRequest无法加载http://api.steampowered.com/ISteamUserStats/GetGlobalAchievementPercentagesForApp/v0002/?gameid=440&format=json。请求的上不存在"Access Control Allow Origin"标头资源原点'http://localhost:3000因此不允许通道

我读过一些关于这个错误的文章，但它似乎需要更改服务器端的代码或其他什么。尽管所有的服务器端代码都做了类似的事情：

// Add headers
app.use(function (req, res, next) {
  // Website you wish to allow to connect
  res.setHeader('Access-Control-Allow-Origin', 'http://api.steampowered.com');
  // Request methods you wish to allow
  res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');
  // Request headers you wish to allow
  res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type');
  // Set to true if you need the website to include cookies in the requests sent
  // to the API (e.g. in case you use sessions)
  res.setHeader('Access-Control-Allow-Credentials', true);
  // Pass to next layer of middleware
  next();
});

使用Open Weather API，这是我使用过的唯一其他第三方REST API，就像原始代码一样，是可以的，所以我不确定为什么Steam API不能正常工作。使用Postman，我提交的查询字符串很好，但当我在客户端javascript中执行时，安全性有问题。。。但不是开放天气API。。。我不确定为什么它对其中一个有效，但对另一个无效。任何帮助都将不胜感激，我已经讨论过一些类似的问题，但我认为我的无知让我很难理解我哪里出了问题，以及需要在哪里进行修复。

我读过一些关于这个错误的文章，但它似乎需要更改服务器端的代码或其他什么。

是--由要从读取数据的服务提供。即通过蒸汽。

您不能允许自己使用访问者的浏览器从他人的网站读取数据。

由于您无法更改Steam的服务器，因此您需要使用服务器而不是从访问者的浏览器从Steam获取数据。

您可以轻松地'cors'模块。使用该命令

npm install cors --save.

并将这些行添加到您的app.js 中

var cors = require('cors');    
app.use(cors());

你不需要弄脏你的代码。这是一种更清洁的方式。

删除此

app.use(function (req, res, next) {
  // Website you wish to allow to connect
  res.setHeader('Access-Control-Allow-Origin', 'http://api.steampowered.com');
  // Request methods you wish to allow
  res.setHeader('Access-Control-Allow-Methods', 'GET, POST, OPTIONS, PUT, PATCH, DELETE');
  // Request headers you wish to allow
  res.setHeader('Access-Control-Allow-Headers', 'X-Requested-With,content-type');
  // Set to true if you need the website to include cookies in the requests sent
  // to the API (e.g. in case you use sessions)
  res.setHeader('Access-Control-Allow-Credentials', true);
  // Pass to next layer of middleware
  next();
});
相关文章：