Question

我正在使用vue js开发应用程序。根据我的设置，我需要在设置更改时将变量传递给我的URL。

foo(bar)

但是当我的应用点击了网址时，会显示以下信息。

无法加载http://172.16.1.157:8002/firstcolumn/2017-03-01/2017-10-26：重定向来自＆＃39; http://172.16.1.157:8002/firstcolumn/2017-03-01/2017-10-26＆＃39;到＆＃39; http://172.16.1.157:8002/firstcolumn/2017-03-01/2017-10-26/＆＃39;被CORS政策阻止：No＆＃39; Access-Control-Allow-Origin＆＃39;标头出现在请求的资源上。起源＆＃39; http://localhost:8080＆＃39;因此不允许访问。

Answer 1

除了awd提到让负责服务器的人重新配置（本地开发的一个不切实际的解决方案）之外，我使用了一个像这样的change-origin chrome插件：

https://chrome.google.com/webstore/detail/moesif-origin-cors-change/digfbfaphojjndkpccljibejjbppifbc

您可以让local dev server (ex: localhost:8080)看似来自172.16.1.157:8002 or any other domain。

Answer 2

要求维护服务器的人http://172.16.1.157:8002/将您的主机名添加到Access-Control-Allow-Origin主机，服务器应返回类似于以下内容的标头以及响应 -

DECLARE
  v_SQL VARCHAR2(32767 CHAR);
  v_Result VARCHAR2(32767 CHAR);
BEGIN 
  v_SQL := 'SELECT 
  ALIASBASE.CDCMPANY, 
  ALIASBASE.PAFCODCTR, 
  ALIASBASE.PAFDTSCAD, 
  NUMFLUSSO.NUMERO, 
  ALIASBASE.PAFDESC, 
  ALIASBASE.PAFTYPE, 
  ALIASBASE.PAFNATURE, 
  ALIASBASE.PAFRECEIV, 
  ALIASBASE.PAFCAUSAL, 
  ALIASBASE.PAFCODDNE, 
  ALIASBASE.PAFMATURITY
  FROM ALBSIAE';

  BEGIN
    SELECT 
      REGEXP_SUBSTR (v_SQL, '(?:\s*(?=\w+\.|.*as\s+|)(\*|\w+)(?=\s*(?=,|from)))',1, NULL,'i') REGEX_RESULT 
    INTO
      v_Result
    FROM DUAL;
  END;

  DBMS_OUTPUT.put_line('v_Result: ' || v_Result);
END;

Answer 3

Chrome出现此问题时，您不需要扩展程序。
从控制台启动Chrome：

chrome.exe --user-data-dir =“ C：/ Chrome开发者会话” --disable-web-security

也许您必须关闭Chrome中的所有标签页，然后重新启动。

Answer 4

谢谢大家，我通过Chrome扩展解决了这个问题。

https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi

Answer 5

您好如果我理解正确您正在使用XMLHttpRequest到与您的网页不同的域名。因此浏览器会阻止它，因为出于安全原因，它通常允许同一来源的请求。当您想要执行跨域请求时，您需要做一些不同的事情。关于如何实现这一目标的教程是Using CORS。

当您使用邮递员时，他们不受此政策的限制。引自Cross-Origin XMLHttpRequest：

常规网页可以使用XMLHttpRequest对象从远程服务器发送和接收数据，但它们受相同原始策略的限制。扩展不是那么有限。扩展可以与其来源之外的远程服务器通信，只要它首先请求跨域权限。

Answer 6

您正在从本地开发服务器向外部域172.16.1.157:8002/发出请求，这就是它提供跨源异常的原因。要么必须在前端和后端都允许标头Access-Control-Allow-Origin:*，要么使用此扩展名cors header toggle - chrome extension，除非您在同一个域中托管后端和前端。

Answer 7

要使用Apache向标头添加CORS授权，只需在服务器配置的<Directory>，<Location>，<Files>或<VirtualHost>部分中添加以下行（通常位于* .conf文件中，例如httpd.conf或apache.conf中）或.htaccess文件中：

标头设置了Access-Control-Allow-Origin“ *”

然后重新启动apache。

更改标头需要使用mod_headers。默认情况下，Apache中已启用Mod_headers，但是，您可能要确保已启用它。

Answer 8

或者像这样：

npm install cors

cors = require("cors");
app.use(cors());

Answer 9

此问题的批准答案无效。

您需要在服务器端代码上设置标头

app.use((req,res,next)=>{
    res.setHeader('Acces-Control-Allow-Origin','*');
    res.setHeader('Acces-Control-Allow-Methods','GET,POST,PUT,PATCH,DELETE');
    res.setHeader('Acces-Contorl-Allow-Methods','Content-Type','Authorization');
    next(); 
})

Answer 10

您不会相信这一点， 请确保添加“。”在“网址”末尾

我在此代码中遇到了类似的错误：

fetch(https://itunes.apple.com/search?term=jack+johnson)
.then( response => {
    return response.json();
})
.then(data => {
    console.log(data.results);
}).catch(error => console.log('Request failed:', error))

我得到的错误：

 Access to fetch at 'https://itunes.apple.com/search?term=jack+johnson'
 from origin 'http://127.0.0.1:5500' has been blocked by CORS policy:
 No 'Access-Control-Allow-Origin' header is present on the requested
 resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled.

但是，经过大量研究，我意识到问题是我没有复制 iTunes API文档中正确的URL地址。

应该是

https://itunes.apple.com/search?term=jack+johnson.

不是

https://itunes.apple.com/search?term=jack+johnson

注意结尾处的点

关于为什么点对引用DNS和字符编码的问题非常重要，但事实是，您可能根本不在乎。尝试添加可能也适合您的点。

当我添加“。”时一切都像魅力一样。

我希望它也对您有用。

Answer 11

如果您可以控制服务器，则可以使用PHP：

<?PHP
header('Access-Control-Allow-Origin: *');
?>

Answer 12

请指定@CrossOrigin(origins = "http://localhost:8081") 在Controller类中。

Answer 13

安装：

npm i cors

然后包含cors（）：

app.get("/list",cors(),(req,res) =>{

});

Answer 14

尝试在终端中运行此命令，然后再次对其进行测试。

curl -H "origin: originHost" -v "RequestedResource"

例如：

如果我的originHost等于https://localhost:8081/，而我的RequestedResource等于https://example.com/

我的命令如下：

curl -H "origin: https://localhost:8081/" -v "https://example.com/"

如果您注意到以下一行，那么它应该对您有用。

希望这会有所帮助。

Answer 15

您必须为浏览器自定义安全性，或者通过自定义安全性允许权限。（这对于您的本地测试是不切实际的）要了解更多信息，请通过链接。
https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

Answer 16

我在Vue.js和SpringBoot项目中遇到了同样的问题。如果有人使用spring，可以添加以下代码：

@Bean
public FilterRegistrationBean simpleCorsFilter() {  
    UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();  
    CorsConfiguration config = new CorsConfiguration();  
    config.setAllowCredentials(true); 
    // *** URL below needs to match the Vue client URL and port ***
    config.setAllowedOrigins(Collections.singletonList("http://localhost:8080")); 
    config.setAllowedMethods(Collections.singletonList("*"));  
    config.setAllowedHeaders(Collections.singletonList("*"));  
    source.registerCorsConfiguration("/**", config);  
    FilterRegistrationBean bean = new FilterRegistrationBean<>(new CorsFilter(source));
    bean.setOrder(Ordered.HIGHEST_PRECEDENCE);  
    return bean;  
}

我在本文Build a Simple CRUD App with Spring Boot and Vue.js

中找到了解决方案

Answer 17

如果您使用的是Node js（制作API），唯一的最佳解决方案是，

第1步：-npm i cors 步骤2：-app.use（cors（）） {在app.js文件中} 然后再次运行服务器，您将找到解决方案... 对于视频，请转到我的YouTube频道并订阅https://www.youtube.com/channel/UCD8bHKf3eRE0bAWShADWAYw

Answer 18

您可以使用Firefox插件 CORS Everywhere 解决此临时问题。只需打开Firefox，按Ctrl + Shift + A，搜索并添加附件即可！

Answer 19

只需在 httpd.conf 文件中添加以下文本即可解决此问题。

标头设置了Access-Control-Allow-Origin“ *”

Answer 20

这些错误可能是由于以下原因引起的，请确保遵循以下步骤。将本地主机与本地虚拟机（主机）连接起来。在这里，我将 http://localhost:3001/ 连接到 http://abc.test 要遵循的步骤：

1.我们必须允许 CORS，在请求头中放置 Access-Control-Allow-Origin: 可能不起作用。安装启用 CORS 请求的 google 扩展程序。*

2.确保您在请求中提供的凭据有效。

3.确保 vagrant 已经配置。尝试 vagrant up --provision 这使本地主机连接到宅基地的数据库。

尝试更改标题的内容类型。 header:{ 'Content-Type' : 'application/x-www-form-urlencoded; charset=UTF-8;application/json' } 这一点非常重要。

Answer 21

$.get('https://172.16.1.157:8002/firstcolumn/' + c1v + '/' + c1b, function (data) { 
  // some code...
});

只需输入“ https”即可。

如何解决＆＃39;重定向已被CORS政策阻止：No＆＃39; Access-Control-Allow-Origin＆＃39;报头＆＃39 ;?

21 个答案: