локальный хост ws + https

Содержание

Вопрос или проблема
Ответ или решение
1. Обзор проблемы
2. Выбор сертификата SSL
2.1. Публичный сертификат
2.2. Самоподписанный сертификат
3. Настройка обратного прокси-сервера
Шаги по настройке Nginx:
4. Проверка соединения
Заключение

Вопрос или проблема

Я создал ws-сервер для устройства пользователя, который соединяется с localhost.
Мой сайт подключается к локальному ws-серверу для выполнения определенных операций на устройстве пользователя.
Это работало идеально, пока я не перешел с http на https.
Сайты https не могут подключаться к ws, только к wss.
Поэтому я хочу сделать обратный прокси, который преобразует ws в wss, проблема в том, что мне нужен SSL сертификат.
Это очень важно для моей страницы, так как интересная часть заключается в ws на устройстве.

Я видел эту проблему во многих местах, и кажется, что не так много людей, которые её решили и рассказали, как именно, или информации недостаточно, или она недостаточно подробно изложена, поэтому я надеюсь, что этот пост поможет другим людям с этой проблемой в будущем, предоставив подробную информацию и возможные решения.

– Мой список размышлений:

1-й:
идея: использовать публичный сертификат
проблема: хакер может получить закрытый ключ из бинарного файла сервера и отозвать публичный сертификат.

2-й:
идея: использовать самоподписанный сертификат
проблема: Chrome и Firefox, похоже, не принимают самоподписанные сертификаты.

У меня нет больше идей, но один из способов получить решение может заключаться в изучении того, как это делает Dropbox.

Ответ или решение

Для решения вашей проблемы с использованием WebSocket (ws) в среде HTTPS (wss), предлагаю следующее поэтапное руководство, которое поможет настроить обратный прокси-сервер и использовать SSL-сертификат.

1. Обзор проблемы

Вы правильно заметили, что браузеры требуют использования защищённых соединений (wss) при работе с веб-сайтами, которые используют HTTPS. Это связано с политикой безопасности браузеров, направленной на защиту данных пользователей.

2. Выбор сертификата SSL

2.1. Публичный сертификат

Вы могли бы использовать публичный сертификат, например, от Let’s Encrypt. Это бесплатный, но доверенный сертификат. Вам нужно будет установить и настроить клиентский инструмент, который автоматизирует получение и обновление сертификатов.

Шаги:

Установите Certbot, программное обеспечение Let’s Encrypt для получения сертификатов.
Следуйте инструкциям на официальном сайте Let’s Encrypt для получения сертификата.
Сертификат будет действителен в течение 90 дней, после чего его нужно будет обновить.

2.2. Самоподписанный сертификат

Как вы указали, использованию самоподписанного сертификата нельзя полностью доверять, так как браузеры будут выдавать предупреждения о небезопасном соединении. Однако, если это необходимо для разработки, вы можете создать самоподписанный сертификат для локального тестирования. Чтобы избежать предупреждений, вам надо будет вручную установить этот сертификат в браузере.

3. Настройка обратного прокси-сервера

Теперь давайте настроим Nginx как обратный прокси для перенаправления ws на wss.

Шаги по настройке Nginx:

Установите Nginx, если он еще не установлен.
Создайте конфигурационный файл для вашего сайта:
```
sudo nano /etc/nginx/sites-available/your_site.conf
```

Вставьте следующую конфигурацию:

server {
   listen 443 ssl;
   server_name your_domain.com;  # Ваш домен

   ssl_certificate /path/to/fullchain.pem;  # Путь к вашему SSL сертификату
   ssl_certificate_key /path/to/privkey.pem;  # Путь к вашему приватному ключу

   location / {
       proxy_pass http://localhost:YOUR_WS_PORT;  # Порт вашего локального WS сервера
       proxy_http_version 1.1;
       proxy_set_header Upgrade $http_upgrade;
       proxy_set_header Connection "upgrade";
       proxy_set_header Host $host;
       proxy_set_header X-Real-IP $remote_addr;
       proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
       proxy_set_header X-Forwarded-Proto $scheme;
   }
}

Настройте символьную ссылку на конфигурацию, чтобы активировать её:
```
sudo ln -s /etc/nginx/sites-available/your_site.conf /etc/nginx/sites-enabled/
```
Проверьте конфигурацию на ошибки:
```
sudo nginx -t
```
Перезапустите Nginx:
```
sudo systemctl restart nginx
```

4. Проверка соединения

После настройки проверьте, что в вашем браузере теперь WebSocket подключается через wss:

const socket = new WebSocket('wss://your_domain.com/path_to_your_ws');

Заключение

Если выполнены все шаги, вы сможете установить безопасное соединение с WebSocket, используя wss. Это даст вам возможность продолжить использовать своего локального WS сервера из браузера с безопасным подключением. Со временем, по мере необходимости, обратите внимание на автоматизацию процесса получения сертификатов, чтобы избежать сбоев на стороне внедрения.