Проблема с подключением: SSL + WebSocket (socketo.me) + Nginx

Перешел по этой ссылке, чтобы настроить Nginx кликните сюда Пытался подключить WebSocket (socketo.me) через HTTPS, не удалось, выдал ошибку как

WebSocket opening handshake timed out

Поскольку мой хостинг-сервер ngnix (версия: 1.13.8) настроен для работы в режиме обратного прокси-сервера во внешнем интерфейсе. Вот конфигурация Nginx

http {
    map $http_upgrade $connection_upgrade {
        default upgrade;
        '' close;
    }
    upstream websocket {
        server xx.xxx.xxx.x:8282; #External IP address
    }
    server {

        location / {
            proxy_pass http://xx.xxx.xxx.x:8080; #External IP address
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection $connection_upgrade;
            proxy_read_timeout 120s;
        }
    }
}

chatroom.php

<script type = "text/javascript">
    $(document).ready(function(){
        var conn = new WebSocket('ws://xx.xxx.xxx.x:8282');
        conn.onopen = function(e) {
            console.info("Connection established!");
        };

        conn.onmessage = function(e) {
            console.info(e.data);
            ...
        };

        conn.onclose = function(e) {
            console.info("Connection Closed!");
        }
    })
</script>

server.php

<?php
use Ratchet\Server\IoServer;
use Ratchet\Http\HttpServer;
use Ratchet\WebSocket\WsServer;
use MyApp\Chat;

    require dirname(__DIR__) . '/vendor/autoload.php';

    $server = IoServer::factory(
        new HttpServer(
            new WsServer(
                new Chat()
            )
        ),
        8282
    );

    $server->run();

Перед применением SSL,

Проблема с подключением: SSL + WebSocket (socketo.me) + Nginx


Затем после применения SSL

Проблема с подключением: SSL + WebSocket (socketo.me) + Nginx

Установлено соединение WebSocket через порт # 8282 с терминала, как показано ниже.

root@user:/var/www/vhosts/somedomain.xy/httpdocs/chatroom-php-mysql/bin# php server.php
Server Started.
New connection! (84)
Connection 84 has disconnected

Когда URL-адрес веб-сайта открывается в браузере, в основном это происходит следующим образом:

  1. Клиентский запрос приходит к интерфейсу Nginx с просьбой предоставить какой-либо ресурс (страница .html, страница .php, изображение, javascript и т. д.). Nginx на нашем хостинг-сервере работает на TCP-портах: 80 - http, 443 - https.

  2. Nginx проверяет, есть ли ресурс в его кеше.

  3. Если ресурс кэширован, Nginx возвращает кешированное содержимое.

  4. Если ресурс не кэширован или запрашивается динамическая страница (например, index.php), Nginx проксирует (перенаправляет) запрос на внутренний сервер - Apache. Apache на нашем хостинг-сервере работает на TCP-портах: 7080 - http, 7081 - https. Затем Nginx кеширует статический контент - HTML, изображения, js, css.


Обновлено:

Символическая ссылка была создана в /etc/nginx/plesk.conf.d/vhosts в somedomain.xy.conf

#ATTENTION!
#
#DO NOT MODIFY THIS FILE BECAUSE IT WAS GENERATED AUTOMATICALLY,
#SO ALL YOUR CHANGES WILL BE LOST THE NEXT TIME THE FILE IS GENERATED.

server {
    listen xx.xxx.xxx.x:443 ssl http2;

    server_name somedomain.xy;
    server_name www.somedomain.xy;
    server_name ipv4.somedomain.xy;

    ssl_certificate             /opt/psa/var/certificates/scfPsMGvJ;
    ssl_certificate_key         /opt/psa/var/certificates/scfPsMGvJ;
    ssl_client_certificate      /opt/psa/var/certificates/scfSdpTzN;

    client_max_body_size 128m;

    root "/var/www/vhosts/somedomain.xy/httpdocs";
    access_log "/var/www/vhosts/system/somedomain.xy/logs/proxy_access_ssl_log";
    error_log "/var/www/vhosts/system/somedomain.xy/logs/proxy_error_log";

    #extension letsencrypt begin
    location /.well-known/acme-challenge/ {
        root /var/www/vhosts/default/htdocs;

        types { }
        default_type text/plain;

        satisfy any;
        auth_basic off;
        allow all;

        location ~ ^/\.well-known/acme-challenge.*/\. {
            deny all;
        }
    }
    #extension letsencrypt end

    location / {
        proxy_pass https://xx.xxx.xxx.x:7081;
        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-Accel-Internal /internal-nginx-static-location;
        access_log off;

    }

    location /internal-nginx-static-location/ {
        alias /var/www/vhosts/somedomain.xy/httpdocs/;
        internal;
    }

    location ~ ^/(plesk-stat|awstats-icon|webstat|webstat-ssl|ftpstat|anon_ftpstat) {
        proxy_pass https://xx.xxx.xxx.x:7081;
        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-Accel-Internal /internal-nginx-static-location;
        access_log off;

    }

    location ~ ^/proj_ci/ {
        proxy_pass https://xx.xxx.xxx.x:7081;
        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-Accel-Internal /internal-nginx-static-location;
        access_log off;

    }

    location ~ "^/files/" {
        proxy_pass https://xx.xxx.xxx.x:7081;
        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-Accel-Internal /internal-nginx-static-location;
        access_log off;

    }

    add_header X-Powered-By PleskLin;

}

server {
    listen xx.xxx.xxx.x:80;

    server_name somedomain.xy;
    server_name www.somedomain.xy;
    server_name ipv4.somedomain.xy;

    client_max_body_size 128m;

    root "/var/www/vhosts/somedomain.xy/httpdocs";
    access_log "/var/www/vhosts/system/somedomain.xy/logs/proxy_access_log";
    error_log "/var/www/vhosts/system/somedomain.xy/logs/proxy_error_log";

    #extension letsencrypt begin
    location /.well-known/acme-challenge/ {
        root /var/www/vhosts/default/htdocs;

        types { }
        default_type text/plain;

        satisfy any;
        auth_basic off;
        allow all;

        location ~ ^/\.well-known/acme-challenge.*/\. {
            deny all;
        }
    }
    #extension letsencrypt end

    location / {
        proxy_pass http://xx.xxx.xxx.x:7080;
        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-Accel-Internal /internal-nginx-static-location;
        access_log off;

    }

    location /internal-nginx-static-location/ {
        alias /var/www/vhosts/somedomain.xy/httpdocs/;
        internal;
    }

    location ~ ^/(plesk-stat|awstats-icon|webstat|webstat-ssl|ftpstat|anon_ftpstat) {
        proxy_pass http://xx.xxx.xxx.x:7080;
        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-Accel-Internal /internal-nginx-static-location;
        access_log off;

    }

    location ~ ^/proj_ci/ {
        proxy_pass http://xx.xxx.xxx.x:7080;
        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-Accel-Internal /internal-nginx-static-location;
        access_log off;

    }

    location ~ "^/files/" {
        proxy_pass http://xx.xxx.xxx.x:7080;
        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-Accel-Internal /internal-nginx-static-location;
        access_log off;

    }

    add_header X-Powered-By PleskLin;

}

Я пытался создать в /etc/nginx/conf.d с именем файла app_name.conf

map $http_upgrade $connection_upgrade {
    default upgrade;
    '' close;
}

upstream websocket {
    server xx.xxx.xxx.x:8282;
}

server {
    # listen xx.xxx.xxx.x:80;
    # listen      443 default_server ssl;
    listen 443 ssl http2;
    server_name somedomain.xy;


    location / {
        proxy_pass http://xx.xxx.xxx.x:8282;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection $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_read_timeout 120s;
        proxy_read_timeout 86400;
        # proxy_redirect default;
        # proxy_redirect http://xx.xxx.xxx.x:8282/  /;
        # proxy_redirect http://www.somedomain.xy/ /;
    }

    location /chat/ {
        proxy_pass http://xx.xxx.xxx.x:8282;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection $connection_upgrade;
        proxy_read_timeout 120s;
    }

    location /test {
        rewrite ^/test(.*) $1 break;
        proxy_pass http://127.0.0.1:8282;
    }

    location /wss {
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "Upgrade";
        proxy_set_header Proxy "";
        proxy_set_header Host $http_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;
        proxy_pass http://xx.xxx.xxx.x:8282;
        proxy_read_timeout 120s;
    }

    location /websocket {  
        proxy_pass http://xx.xxx.xxx.x:8282; ## WSPHP listening port
        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_read_timeout 86400;
    }

}

Кроме того, в Nginx мы не можем видеть такие каталоги, это /etc/nginx/sites-available/* и /etc/nginx/sites-enabled/*, мы будем видеть под /etc/apache2

Нет, я использую Рэтчет PHP @AnimeshSahu

Nɪsʜᴀɴᴛʜ ॐ 21.11.2018 12:29

Не уверен, что правильно понимаю вашу проблему. Но, судя по тому, что вы показываете, вы встраиваете простое соединение с веб-сокетом (ws://) вместо безопасного подключения к веб-сокету (wss://) на своей странице, и браузер справедливо жалуется, что вы встраиваете небезопасные ресурсы (ws:// вместо wss://) в безопасную веб-страницу ( https://). Таким образом, вы должны изменить свой код, чтобы использовать wss:// вместо ws://, и добавить пересылку на внутренний сервер websocket также в ssl-часть вашей конфигурации nginx.

Steffen Ullrich 21.11.2018 13:09

Какой должен быть мой upstream server и порт прослушивания #. Также внутренний IP-адрес начинается с 127.0.0.1/30 @SteffenUllrich

Nɪsʜᴀɴᴛʜ ॐ 21.11.2018 13:16

Конфигурация, в которую вы переадресовываете (восходящий поток ...), должна быть точно такой же. На внутреннем сервере websocket никаких изменений не требуется. Вам нужно только изменить то, что вы: а) используете wss:// для доступа к веб-сокету и б) заставляете nginx перенаправлять на внутренний сервер веб-сокета также в части ssl вашей конфигурации. nginx завершит SSL-соединение (например, wss://) и перешлет данные в обычном формате (ws://), поэтому никаких изменений на внутреннем сервере веб-сокетов не требуется.

Steffen Ullrich 21.11.2018 13:21

Но все же я не мог понять, где мне нужно редактировать. Поскольку я получаю ту же ошибку. Так что любезно помогите мне с отредактированным сообщением выше @SteffenUllrich

Nɪsʜᴀɴᴛʜ ॐ 22.11.2018 08:14
Стоит ли изучать PHP в 2026-2027 годах?
Стоит ли изучать PHP в 2026-2027 годах?
Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...
Symfony Station Communiqué - 7 июля 2023 г
Symfony Station Communiqué - 7 июля 2023 г
Это коммюнике первоначально появилось на Symfony Station .
Оживление вашего приложения Laravel: Понимание режима обслуживания
Оживление вашего приложения Laravel: Понимание режима обслуживания
Здравствуйте, разработчики! В сегодняшней статье мы рассмотрим важный аспект управления приложениями, который часто упускается из виду в суете...
Установка и настройка Nginx и PHP на Ubuntu-сервере
Установка и настройка Nginx и PHP на Ubuntu-сервере
В этот раз я сделаю руководство по установке и настройке nginx и php на Ubuntu OS.
Коллекции в Laravel более простым способом
Коллекции в Laravel более простым способом
Привет, читатели, сегодня мы узнаем о коллекциях. В Laravel коллекции - это способ манипулировать массивами и играть с массивами данных. Благодаря...
Как установить PHP на Mac
Как установить PHP на Mac
PHP - это популярный язык программирования, который используется для разработки веб-приложений. Если вы используете Mac и хотите разрабатывать...
1
5
1 316
0

Другие вопросы по теме