Как решить "Перенаправление было заблокировано политикой 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
.
Ответ 2
Спасибо всем, я решил этим расширением на хром.
https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi
Ответ 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".