无法使用 XML 向网址发送请求

Question

我已经开始构建一个 Vue.js网站，将 AWS 放大版用于后端。在其中一个页面中，我需要访问外部URL地址，从中获取响应，并查看对用户的响应。重要的是要说URL没有链接到我的网站，它与我无关。它完全是外部的，超出了我的控制范围。我已经尝试多次访问该网址，使用许多方法，但到目前为止，每次尝试访问该网址时，我都会收到以下错误消息：:8080/#/myPage:1 Access to XMLHttpRequest at 'https://~URL~?~DATA~' from origin 'http://localhost:8080' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. xhr.js?b50d:178 GET https://~URL~?~DATA~ net::ERR_FAILED（我将实际网址替换为 ，并将文件名替换为 ）。https://~URL~?~DATA~myPage当我尝试打印从函数收到的错误时。我收到以下消息：myPage.vue?3266:161 Error: Network Error                         at createError (createError.js?2d83:16)                         at XMLHttpRequest.handleError (xhr.js?b50d:83)当我尝试使用浏览器（谷歌浏览器）访问网址时，它运行良好，没有任何问题。它没有要求我进行任何类型的身份验证或类似的东西。我也用邮递员尝试过，它工作得很好。我只在使用我的 Vue.js 网站时才遇到此问题。当我从主机运行网站时，当我在主机上运行网站时（对无服务器网站使用 AWS Amplify 托管 - S3 存储桶），就会发生此问题。当网站无法在本地主机上运行时，我仍然收到相同的错误消息。localhost以下是我尝试访问URL的一些方法：阿克西奥斯var config = {  method: 'get',  url: 'https://~URL~?~DATA~',  headers: {    'Access-Control-Allow-Credentials': true  }};axios(config).then(function (response) {  console.log(response);}).catch(function (error) {  console.log(error);});获取var requestOptions = {  method: 'GET',  redirect: 'follow'};fetch("https://~URL~?~DATA~", requestOptions).then(response => response.text()).then(result => console.log(result)).catch(error => console.log('error', error));断续器var xhr = new XMLHttpRequest();xhr.withCredentials = true;xhr.addEventListener("readystatechange", function() {  if(this.readyState === 4) {    console.log(this.responseText);  }});xhr.open("GET", "https://~URL~?~DATA~");xhr.send();请求var request = require('request');var options = {  'method': 'GET',  'url': 'https://~URL~?~DATA~',  'headers': {  }};request(options, function (error, response) {  if (error) throw new Error(error);    console.log(response.body);});我真的需要你的帮助，因为到目前为止，我无法在网络上找到任何解决方案。

Answer 1

据我所知，这是一个 CORS 策略错误，应该从服务器端修复。执行 API 调用时，浏览器首先会向服务器发送预检请求。服务器使用一些标头进行响应，其中一个标头是标头，如果此标头设置为或请求域，则实际请求将通过，否则 api 调用将收到 CORS 策略错误。Access-Control-Allow-Origin*

从服务器端可以控制哪些域可以对此服务器执行API调用。

您可以从此处阅读有关CORS策略错误的更多信息，一些解决方法以及如何修复它，https://medium.com/@dtkatz/3-ways-to-fix-the-cors-error-and-how-access-control-allow-origin-works-d97d55946d9