Блог

Я потратил немного времени на создание этого, и оно хорошо работает локально, но на сервере оно ломается из-за приведенной ниже ошибки. API, который я использую, похоже, находится на небезопасном адресе http:, поэтому браузер не разрешает его подключение, поскольку мой веб-сайт находится на адресе https. Есть ли какой-нибудь способ обойти это с помощью какого-нибудь прокси / heroku?

Github

Сломанный веб-сайт приложения

Смешанный контент: страница в ‘https://agwebdesign.net/react/petadoption /‘был загружен по протоколу HTTPS, но запросил небезопасный скрипт’ http://api.petfinder.com/pet.find?key=920cf4ddd938497ba32bef47b7f35080amp;format=jsonamp;output=fullamp;location=Seattle, WAamp;animal=amp;breed=amp;callback=jsonp_jfg1sgfprug5jl1‘. Этот запрос был заблокирован; содержимое должно передаваться по протоколу HTTPS.

Это то, что сработало для меня в react 16.12, размещенном на vercel, с серверной частью, использующей небезопасный адрес HTTP:

Шаг 1. Перейдите в раздел информации веб-сайта (кнопка «i» в левом правом углу, рядом с вашим URL)

Шаг 2. Прокрутите вниз до «небезопасного содержимого» и выберите «разрешить» из выпадающего списка

шаг 3. Обновите свою страницу, и все готово

Почему вы хотите это сделать? Вы должны использовать HTTPS везде. С такими инструментами, как Let’s Encrypt, больше нет оправданий для отказа.

В любом случае, этот конкретный URL, похоже, также передается по протоколу HTTPS. Просто измените протокол с http:// на https:// , и он перестанет блокироваться.