Нет заголовка "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