Нет заголовка "Access-Control-Allow-Origin" присутствует в запрошенной ошибке ресурса
Я пытаюсь получить ленту новостного сайта. Думаю, я бы использовал API фидов Google, чтобы конвертировать фид FeedBurner в JSON. Следующий URL вернет 10 сообщений из ленты в формате json. http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=10&q=http://feeds.feedburner.com/mathrubhumi
Я использовал следующий код, чтобы получить содержимое выше URL
$.ajax({
type: "GET",
dataType: "jsonp",
url: "http://ajax.googleapis.com/ajax/services/feed/load",
data: {
"v": "1.0",
"num": "10",
"q": "http://feeds.feedburner.com/mathrubhumi"
},
success: function(result) {
//.....
}
});
но это не работает, и я получаю следующую ошибку
XMLHttpRequest не может загрузить http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=10&q=http%3A%2F%2Ffeeds.feedburner.com%2Fmathrubhumi. В запрошенном ресурсе отсутствует заголовок "Access-Control-Allow-Origin". Поэтому происхождение ' http://localhost ' не разрешено.
Как это исправить?
Ответы
Ответ 1
Я полагаю, что это может случиться так, что Chrome не поддерживает localhost
, чтобы пройти через Access-Control-Allow-Origin
- см. проблему Chrome
Чтобы отправить сообщение Chrome Access-Control-Allow-Origin
в заголовке, просто укажите свой локальный хост в файле /etc/hosts в какой-либо другой домен, например:
127.0.0.1 localhost yourdomain.com
Затем, если вы получите доступ к script с помощью yourdomain.com
вместо localhost
, вызов должен завершиться успешно.
Ответ 2
Если вы используете браузер Google Chrome, вы можете взломать с расширением.
Вы можете найти расширение Chrome, которое будет изменять заголовки CORS на лету в вашем приложении. Очевидно, что это только Chrome, но мне нравится, что он работает с нулевыми изменениями где угодно.
Вы можете использовать его для отладки вашего приложения на локальном компьютере (если все работает на производстве).
Примечание. Если URL-адрес становится неработающим, его расширение называется Access-Control-Allow-Origin: *. Я рекомендую вам отключить это расширение, когда вы не работаете над своими вещами, потому что, например, YouTube не работает с этим расширением.
Ответ 3
Попробуйте это - установите Ajax-вызов, настроив заголовок следующим образом:
var uri = "http://localhost:50869/odata/mydatafeeds"
$.ajax({
url: uri,
beforeSend: function (request) {
request.setRequestHeader("Authorization", "Negotiate");
},
async: true,
success: function (data) {
alert(JSON.stringify(data));
},
error: function (xhr, textStatus, errorMessage) {
alert(errorMessage);
}
});
Затем запустите свой код, открыв Chrome с помощью следующей командной строки:
chrome.exe --user-data-dir="C:/Chrome dev session" --disable-web-security
Ответ 4
Просто к вашему сведению, я заметил эту информацию из документации jQuery, которая, по моему мнению, относится к этой проблеме:
Из-за ограничений безопасности браузера большинство запросов "Ajax" подчиняются той же политике происхождения; запрос не может успешно получить данные из другого домена, субдомена, порта или протокола.
Изменение файла hosts, например @thanix, не сработало для меня, но расширение, упомянутое @dkruchok, решило проблему.
Ответ 5
Вы также можете установить это расширение, если находитесь в Chrome.
Access-Control-Allow-Origin: *
Ответ 6
Если это вызывает весенний сервис загрузки. Вы можете справиться с этим, используя код ниже.
@Bean
public WebMvcConfigurer corsConfigurer() {
return new WebMvcConfigurerAdapter() {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/**")
.allowedOrigins("*")
.allowedMethods("GET", "POST", "PUT", "DELETE", "HEAD", "OPTIONS")
.allowedHeaders("*", "Access-Control-Allow-Headers", "origin", "Content-type", "accept", "x-requested-with", "x-requested-by") //What is this for?
.allowCredentials(true);
}
};
}
Ответ 7
Пытаться
async function read() {
let r= await (await fetch('https://cors-anywhere.herokuapp.com/http://ajax.googleapis.com/ajax/services/feed/load?v=1.0&num=10&q=http://feeds.feedburner.com/mathrubhumi')).json();
console.log(r);
}
read();
Ответ 8
Chrome не позволяет интегрировать два разных локальных хоста, поэтому мы получаем эту ошибку. Вам просто нужно включить пакет Microsoft Visual Studio Web Api Core из nuget WebApiConfig.cs
. И добавить две строки кода в проект WebApi в ваш файл WebApiConfig.cs
.
var cors = new EnableCorsAttribute("*", "*", "*");
config.EnableCors(cors);
Тогда все сделано.
Ответ 9
Пожалуйста, используйте @CrossOrigin
в контроллере загрузки backendside
в Spring (уровне класса или уровне метода), поскольку решение для заголовка ошибки Chrome 'No 'Access-Control-Allow-Origin'
присутствует на запрошенном ресурсе. '
Это решение работает для меня на 100%...
Пример: Уровень класса
@CrossOrigin
@Controller
public class UploadController {
----- ИЛИ -------
Пример: Уровень метода
@CrossOrigin(origins = "http://localhost:3000", maxAge = 3600)
@RequestMapping(value = "/loadAllCars")
@ResponseBody
public List<Car> loadAllCars() {
Ref: https://spring.io/blog/2015/06/08/cors-support-in-spring-framework