Запрос API со страниц GitHub не работает («смешанный блок»)

Question

Итак, я развернул все свои приложения React, которые используют API. У меня проблемы с отправкой этого API, и что-то блокирует их, поэтому мои приложения не работают.

Примечание: все мои запросы - cors, поэтому с ними проблем нет.

github блокирует мой запрос

и это ссылка на проект на картинке news-blog

Answer 1

Проблема в том, что вы пытаетесь получить незащищенный (http) контент с защищенного (https) сайта, что нарушает Content-Security-Policy (CSP) сайта . Это небезопасное поведение для современных браузеров.

От MDN:

Заголовок ответа HTTP Content-Security-Policy позволяет администраторам сайта контролировать ресурсы агента пользователя разрешено загружать для данной страницы. За некоторыми исключениями, политики в основном включают указание происхождения сервера и конечных точек сценария. Это помогает защититься от межсайтовых скриптовых атак (XSS).

Правильный способ решения этой проблемы - загрузка данных из безопасного источника. Например, вместо выборки из http://newsapi.org/v2/everything, попробуйте https://newsapi.org/v2/everything (обратите внимание на разницу между http и https).