如果资源不允许CORS，如何发出“简单”GET请求？

Question

我正在尝试在Chrome新选项卡扩展中使用W3C的。医生们声称请求是--对URI的简单HTTP调用，因此我认为应该可以：

fetch('http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fwww.w3.org%2F&profile=css3&output=json')
.then((response) => {
  // do stuff with response
});

不幸的是，这个承诺失败了，我收到了这样的信息：

装载失败。请求的资源上没有“访问-控制-允许-原产地”标题。因此，“原产地”不允许访问。

如果资源不允许GET，我如何提出“简单”的CORS请求？

谢谢!

Answer 1

2017-10-22更新： 更改将CORS支持添加到CSS Validator中被合并并推送到生产中，因此下面的工作如下：

​

const validatorURL = 'https://jigsaw.w3.org/css-validator/validator' +
  '?uri=http%3A%2F%2Fwww.w3.org%2F&profile=css3&output=json';
fetch(validatorURL)
  .then(response => response.json())
  .then(results => console.log(results))

​

原始答案：

不发送必要的CORS响应头。为了解决这个问题，我使用了对CSS Validator源进行更改，引发拉请求。，它将使您的代码片段按原样工作。一旦将更改合并并推送到生产中，我将在这里发布更新。

同时，您可以通过CORS代理提出请求来解决这个问题：

​

const proxyURL = 'https://cors-anywhere.herokuapp.com/';
const validatorURL = 'http://jigsaw.w3.org/css-validator/validator' +
  '?uri=http%3A%2F%2Fwww.w3.org%2F&profile=css3&output=json';
fetch(proxyURL + validatorURL)
  .then(response => response.json())
  .then(results => console.log(results))

​

有关这一工作原理的详细信息，请参阅如何使用CORS代理绕过https://stackoverflow.com/questions/43871637/no-access-control-allow-origin-header-is-present-on-the-requested-resource-whe/43881141#43881141回答中的“无访问控制-允许-原产地标题”部分。

Answer 2

您需要对扩展清单进行注册允许的原产地：

  "permissions": [
    "http://jigsaw.w3.org/"
  ],

您可能还需要为fetch函数使用设置原点模式：

fetch(
 'http://jigsaw.w3.org/css-validator/validator?uri=http%3A%2F%2Fwww.w3.org%2F&profile=css3&output=json', 
  {mode: 'no-cors'})
.then((response) => {
  // do stuff with response
});

Answer 3

从铬网店，你可以添加CORS过滤器扩展。只需在运行代码之前启用筛选器即可。

通过这里，您可以将筛选器添加到您的铬浏览器中。