Xubuntu + Nginx + Go(+ Pion/WebRTC) + Node.js


Введение

Я попробую создать среду разработки с Xubuntu, Nginx и Go.

Окружение

  • Xubuntu ver.22.04
  • Nginx ver.1.22.0
  • Go ver.go1.19 linux/amd64
  • Node.js ver.18.7.0

Xubuntu

Сначала я меняю имена каталогов на английские.

LANG=C xdg-user-dirs-gtk-update
Войдите в полноэкранный режим Выход из полноэкранного режима
  • Ubuntu でホームディレクトリ内のディレクトリ名を英語表記に — 雑廉堂の雑記帳

После этого я устанавливаю некоторые приложения.

Установленные с помощью apt

  • vim
  • git
  • gimp
  • curl

Установить пакеты

  • Google Chrome
  • Visual Studio Code

Установка Go и Node.js

Go

Я могу загрузить и установить Go, следуя руководству по установке.

  • Загрузка и установка — Язык программирования Go

Чтобы добавить «/usr/local/go/bin» в переменную окружения PATH, я выполняю эту команду.

echo 'export PATH=$PATH:/usr/local/go/bin' >> ~/.bashrc
source ~/.bashrc
Войти в полноэкранный режим Выйти из полноэкранного режима

После установки я клонирую свой проект Go.

Node.js

Чтобы использовать TypeScript, Webpack и т.д., я устанавливаю Node.js с помощью NodeSource в соответствии с документацией Node.js.

  • Установка Node.js через менеджер пакетов — Node.js
  • Бинарные дистрибутивы Node.js NodeSource — GitHub

Nginx

Установка

Я устанавливаю Nginx в соответствии с документацией.

  • nginx: Пакеты Linux

Обслуживание проектов Go

Из того, что я нашел в некоторых сообщениях блога и документах в интернете, кажется, что Nginx использует обратный прокси для обслуживания проектов Go.
А поскольку я хочу получить доступ к странице с примером WebRTC с некоторых ПК и смартфонов, подключенных по локальной сети, я должен обслуживать ее по htttps.

Обратный прокси

Чтобы использовать обратный прокси, я могу отредактировать конфигурационные файлы Nginx.

Обычно я могу написать их в «/etc/nginx/nginx.conf», но для порта:80, я должен написать в «/etc/nginx/conf.d/default.conf».

default.conf

server {
    listen       80;
    server_name  localhost;

    location / {
        root   /usr/share/nginx/html;
        index  index.html index.htm;
    }

    # When clients access "http://localhost/webrtc", Nginx redirect to "http://localhost:8080"
    location /webrtc {
        proxy_pass http://localhost:8080;
    }

    error_page   500 502 503 504  /50x.html;
    location = /50x.html {
        root   /usr/share/nginx/html;
    }
}
Войти в полноэкранный режим Выйти из полноэкранного режима

https

Чтобы обслуживать страницы через htttps, мне нужно создать и настроить сертификат.
В этот раз он предназначен только для разработки, я создаю локально доверенные сертификаты разработки с помощью mkcert.

  • mkcert — FiloSottile — GitHub
  • mkcert.org

Я устанавливаю предварительно собранные двоичные файлы в соответствии с README.

После выполнения команды «mkcert -install» я могу создать файлы сертификатов и ключей.

mkcert -key-file local_key.pem -cert-file local_cert.pem 192.168.XX.YYY
Вход в полноэкранный режим Выход из полноэкранного режима

«192.168.XX.YYY» представляет собой IP-адрес моей машины.

На этот раз я сохранил их в своем домашнем каталоге (/home/example).

После этого я обновил файл «/etc/nginx/nginx.conf».

nginx.conf

user  nginx;
worker_processes  auto;

error_log  /var/log/nginx/error.log notice;
pid        /var/run/nginx.pid;


events {
    worker_connections  1024;
}


http {
    include       /etc/nginx/mime.types;
    default_type  application/octet-stream;

    log_format  main  '$remote_addr - $remote_user [$time_local] "$request" '
                      '$status $body_bytes_sent "$http_referer" '
                      '"$http_user_agent" "$http_x_forwarded_for"';

    access_log  /var/log/nginx/access.log  main;

   sendfile        on;
    #tcp_nopush     on;

    keepalive_timeout  65;

    #gzip  on;

    include /etc/nginx/conf.d/*.conf;

#when clients access "https://192.168.XX.YYY:443/webrtc",
#the server will serve "webappsample".
server {
    listen 443 ssl;
    server_name 192.168.XX.YYY;
    ssl_certificate /home/example/local_cert.pem;
    ssl_certificate_key /home/example/local_key.pem;
    location /webrtc {
        proxy_pass http://localhost:8080;
    }
  }
}
Войти в полноэкранный режим Выйти из полноэкранного режима

Обслуживаем мой проект WebRTC (webappsample)

Чтобы обслужить мой проект WebRTC, я должен обновить его.

Пути

Поскольку страница обслуживается с помощью обратного прокси, ее URL будет изменен.

index.html

<!DOCTYPE html>
<html>
    <head>
        <title>WebRTC Sample</title>
        <meta charset="utf-8">
        <link href="{{.}}/css/site.css" rel="stylesheet" />
    </head>
    <body>
...
        <script src="{{.}}/js/main.page.js"></script>
        <script>Page.init('{{.}}');</script>
    </body>
</html>
Вход в полноэкранный режим Выход из полноэкранного режима

main.go

...
func main() {
    hub := *newSSEHub()
    go hub.run()

    http.Handle("/webrtc/css/", http.StripPrefix("/webrtc", http.FileServer(http.Dir("templates"))))
    http.Handle("/webrtc/js/", http.StripPrefix("/webrtc", http.FileServer(http.Dir("templates"))))
    http.HandleFunc("/webrtc/sse/message", func(w http.ResponseWriter, r *http.Request) {
        sendSSEMessage(w, r, &hub)
    })
    http.HandleFunc("/webrtc/sse/", func(w http.ResponseWriter, r *http.Request) {
        registerSSEClient(w, r, &hub)
    })

    http.Handle("/", &templateHandler{filename: "index.html", serverUrl: "https://192.168.XX.YYY:443/webrtc"})
    log.Fatal(http.ListenAndServe("localhost:8080", nil))
}
Войти в полноэкранный режим Выход из полноэкранного режима

События, отправленные сервером (SSE)

Хотя я могу получить доступ к странице и медиапотокам, я все еще не могу подключиться с помощью WebRTC.
Потому что когда я пытался подключиться с помощью Server Sent Events, я получал 301(Moved Permanently).

Чтобы избежать этого, я должен добавить дополнительные свойства в nginx.conf.

nginx.conf

...
server {
    listen 443 ssl;
    server_name 192.168.XX.YYY;
    proxy_buffering off;
    proxy_cache off;
    proxy_set_header Connection '';
    proxy_http_version 1.1;
    chunked_transfer_encoding off;
    ssl_certificate /home/example/local_cert.pem;
    ssl_certificate_key /home/example/local_key.pem;
    location /webrtc {
        proxy_pass http://localhost:8080;
    }
  }
}

Войти в полноэкранный режим Выйти из полноэкранного режима

Ресурсы

  • документация nginx
  • Руководство для начинающих — nginx
  • Поваренная книга NGINX, 2-е издание
  • EventSource / Отправка событий на сервер через Nginx — StackOverflow
  • Почему мне нужно использовать http.StripPrefix для доступа к моим статическим файлам? — StackOverflow

Оцените статью
devanswers.ru
Добавить комментарий