Реагировать / Neovis.js : Не удалось создать «WebSocket»: небезопасное соединение с WebSocket не может быть инициировано со страницы, загруженной по протоколу HTTPS

#reactjs #websocket #neo4j

#reactjs #websocket #neo4j

Вопрос:

Итак, у меня есть это приложение react, которое использует Neovis.js это плагин визуализации графиков для базы данных Neo4j, и он отлично работает в разработке, но когда я развертываю его в Heroku, плагин не работает, и он показывает эти сообщения в консоли:

DOMException: Failed to construct 'WebSocket': An insecure WebSocket connection may not be initiated from a page loaded over HTTPS.

И это: Mixed Content: The page at 'https://xxxxxxxx.com/person/20' was loaded over HTTPS, but attempted to connect to the insecure WebSocket endpoint 'ws://xxxxxx:7687/'. This request has been blocked; this endpoint must be available over WSS.

Я видел сообщения об этой ошибке, поэтому я понизил рейтинг своих реактивных скриптов в package.json с 4.0.1 до 3.2.0, как они сказали, но после этого было слишком много устаревших материалов, и все приложение не работало в Heroku.

Я также попытался отредактировать webPackHotDevClient.js строка 62 до: protocol: window.location.protocol === 'https:' ? 'wss' : 'ws' но все еще не работает.

Кстати, конечная точка neo4j находится на Http, а не на https, должна ли моя конечная точка neo4j быть доступной с помощью https?

Ответ №1:

Редактировать :

Одно из решений, которое я нашел, — это получить доступ к приложению heroku с http:// помощью and not https:// , чтобы мой плагин в моем приложении react мог взаимодействовать с запущенным экземпляром neo4j http , не лучший ответ, но он работает!

Ответ №2:

Я исправил это, используя тернарный оператор для проверки текущего протокола среды:

Моя конфигурация Neovis:

 const vis = new Neovis({
  server_url: 'neo4j://myHost:myPort',
  ... // Additional config
  encrypted: window.location.protocol === 'https:' ? 'ENCRYPTION_ON': 'ENCRYPTION_OFF',
});