Как решить "Перенаправление было заблокировано политикой CORS: Нет? Access-Control-Allow-Origin 'header'?

Я работаю над приложением, используя vue js. В соответствии с моей настройкой мне нужно перейти на переменную на мой url при изменении настроек.

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

но когда мое приложение попадает в URL-адрес, оно показывает следующий messsge.

Не удалось загрузить http://172.16.1.157:8002/firstcolumn/2017-03-01/2017-10-26: Перенаправление с ' http://172.16.1.157:8002/firstcolumn/2017-03-01/2017- 10-26 'to' http://172.16.1.157:8002/firstcolumn/2017-03-01/2017-10-26/ 'заблокирован политикой CORS: заголовок "Access-Control-Allow-Origin" отсутствует присутствовать на запрошенном ресурсе. Происхождение ' http://localhost: 8080 ', следовательно, не допускается.

ОТВЕТЫ

Ответ 1

В дополнение к тому, что в awd упоминалось о том, чтобы заставить человека, ответственного за сервер, перенастроить (непрактичное решение для локальной разработки), я использую плагин 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.

Ответ 3

Попросите человека, обслуживающего сервер по адресу http://172.16.1.157:8002/, добавить ваше имя хоста в узлы Access-Control-Allow-Origin, сервер должен вернуть заголовок, подобный следующему с response-

Access-Control-Allow-Origin: yourhostname:port

Ответ 4

Привет. Если я правильно понял, вы делаете XMLHttpRequest в другой домен, чем ваша страница. Таким образом, браузер блокирует его, поскольку он обычно разрешает запрос в том же самом источнике по соображениям безопасности. Вам нужно сделать что-то другое, если вы хотите выполнить кросс-доменный запрос. Учебник о том, как достичь этого, Использование CORS.

Когда вы используете почтальон, они не ограничены этой политикой. Цитируется из Cross-Origin XMLHttpRequest:

Обычные веб-страницы могут использовать объект XMLHttpRequest для отправки и получения данных с удаленных серверов, но они ограничены одной и той же политикой происхождения. Расширения не так ограничены. Расширение может разговаривать с удаленными серверами за пределами его происхождения, если оно сначала запрашивает разрешения перекрестного происхождения.

Ответ 5

Вы делаете запрос к внешнему домену 172.16.1.157:8002/ со своего локального сервера разработки, поэтому он дает исключение перекрестного происхождения. Либо вы должны разрешить заголовки Access-Control-Allow-Origin:* как во внешнем интерфейсе, так и во внутреннем интерфейсе, либо в качестве альтернативы используйте это расширение заголовка cors - расширение chrome, если вы не размещаете внутренний и внешний интерфейсы в одном и том же домене.

Ответ 6

Чтобы добавить авторизацию CORS в заголовок с помощью Apache, просто добавьте следующую строку в разделы <Directory>, <Location>, <Files> или <VirtualHost> конфигурации вашего сервера (обычно расположены в файле *.conf, например, как httpd.conf или apache.conf) или в файле .htaccess:

Набор заголовков Access-Control-Allow-Origin "*"

А затем перезапустите Apache.

Изменение заголовков требует использования mod_headers. Mod_headers по умолчанию включен в Apache, однако вы можете убедиться, что он включен.

Ответ 7

Если у вас есть контроль над вашим сервером, вы можете использовать PHP:

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

Ответ 8

У меня была такая же проблема в моих проектах Vue.js и SpringBoot. Если кто-то работает с пружиной, вы можете добавить этот код:

@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;  
}

Я нашел решение в этой статье Создайте простое приложение CRUD с помощью Spring Boot и Vue.js

Ответ 9

Вы можете решить эту проблему с помощью дополнения Firefox, CORS Everywhere. Просто откройте Firefox, нажмите Ctrl + Shift + A, найдите надстройку и добавьте ее!

Ответ 10

если вы используете узел js (создание apis), единственное лучшее решение -

step1: - npm я cors step2: - app.use(cors()) {в файле app.js}, затем снова запустите свой сервер, вы найдете решение... для видео перейдите на мой канал на YouTube и подпишитесь на https://www.youtube.com/channel/UCD8bHKf3eRE0bAWShADWAYw

Ответ 11

Вы должны настроить безопасность для своего браузера или разрешить настройку безопасности. (это непрактично для вашего локального тестирования) Чтобы узнать больше, перейдите по ссылке.
https://developer.mozilla.org/en-US/docs/Web/HTTP/CORS

Ответ 12

Простое добавление приведенного ниже текста в файл httpd.conf решит эту проблему.

Набор заголовков Access-Control-Allow-Origin "*"

Ответ 13

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

Просто поставьте "https".