Как правильно настроить конфиг Nginx?

Question

[psopi]

У меня проект на React я создал build и теперь надо запустить проект на домене Мой конфиг выглядит так я его не сам писал

server {
    listen 80;  # Порт, на котором будет слушать Nginx
    server_name http://react-cod.ru/;  # Замените на ваш домен или IP-адрес

    root /root/frontend/build;  # Укажите путь к директории с вашими статическими файлами
    index index.html;  # Укажите файл, который будет использоваться по умолчанию

    location / {                                                        
       try_files $uri $uri/ /index.html=404;  # Обработка маршрутов SPA
    }

    location ~ \.(js|css|png|jpg|jpeg|gif|ico|svg|woff|woff2|ttf|eot)$ {
        expires 1y;  # Кэширование статических файлов
        access_log off;  # Отключаем логирование доступа к статическим файлам
    }
location = /favicon.ico {
        log_not_found off;  # Отключаем ошибку 404 для favicon
    }

    location = /robots.txt {
        allow all;  # Разрешаем доступ к robots.txt
    }

    error_page 404 /404.html; 
location = /404.html {
        internal;  # Указываем, что эта страница должна быть внутренней
    }

    location ~* \.(html)$ {
        expires -1;  # Отключаем кэширование HTML
    }
}

И при выводе sudo tail -f /var/log/nginx/error.log Выдает такую ошибку

2024/11/12 19:04:53 [error] 21897#21897: *3 rewrite or internal redirection cycle while internally redirecting to "/index.html", client: 212.74.000.000, server: your_domain.com, request: "GET / HTTP/1.1", host: "react-cod.ru"

2024/11/12 19:04:53 [error] 21897#21897: *4 rewrite or internal redirection cycle while internally redirecting to "/index.html", client: 212.74.200.000, server: your_domain.com, request: "GET /favicon.ico HTTP/1.1", host: "react-cod.ru", referrer: "http://react-cod.ru/"

Comments

[Valentin Barbolin]

server_name react-cod.ru;  # Замените на ваш домен или IP-адрес

[psopi]

Valentin Barbolin, Я поменял но ошибка та же

[historydev]

выгрузить React проект на сервер через nginx

А где тогда nginx, если он должен выгружать реакт на сервер?

[psopi]

historydev, Ну я ошибся, nginx на сервере стоит, проблема с созданием конфига

[Refguser]

Во первых в server_name не должно быть протоколов.
Во вторых (тут я не совсем уверен) путь /index.html=404 неверный.

[psopi]

Refguser, Я попробовал поменять это все

server_name react-cod.ru;
 try_files $uri $uri/ /index.html

Ошибка так же

[Refguser]

И

/root/frontend/build

Смело..

[psopi]

Refguser, что не так

[Refguser]

psopi, размещать веб-проект в каталоге рута - безумство.

[psopi]

Refguser, тогда как лучше сделать? И имеет ли это отношение к моей проблеме?

[Refguser]

psopi, я не знаю как реакт нужно запускать, но по нжиксу начни отсюда.

Ида. вебпроекты нужно размещать в отдельном, специальном каталоге. (да и не веб тоже)

[Drno]

psopi, права на папку выдали веб серверу? возможно он её просто не может прочитать...
обычно на убунтах проекты веб размещаются в
/var/www/html/

[psopi]

Drno, какие права на папку?

[Drno]

psopi, обычные линуксовы права
nginx запускается от пользователя www-data(в убунту \ дебиане)
соответственно чтобы он прочитал какой то каталог, надо дать правильные права на эту папку и файлы..
загуглите для своей системы

[Виктор Таран]

server {
    listen 80;
    server_name react-cod.ru www.react-cod.ru;

    location / {
        root /root/frontend/build;
        index index.html index.htm;

        try_files $uri $uri/ /index.html;
    }

    location ~ \.(js|css|png|jpg|jpeg|gif|ico|svg)$ {
        expires 1y;
        access_log off;
        add_header Cache-Control "public";
    }

    location = /favicon.ico {
        log_not_found off;
        access_log off;
    }

    location = /robots.txt {
        allow all;
        log_not_found off;
        access_log off;
    }

    error_page 404 /index.html;
}

Answer 1

[Сергей Сахаров]

1. Можно не засорять вывод комментариями.
2. Сервер, на котором крутится твой сайт, должен иметь внешний IP-адрес; если внешний адрес на роутере, нужно настроить проброс портов 80 и 443 на внутренний.
3. Имя домена должно быть ассоциировано с IP-адресом (даже если внутренний) в файле hosts
4. Проверить конфигурацию можно командой nginx -t

Comments

[psopi]

А можно как то конкретнее? Что надо сделать?
при nginx -t пишет что все нормально

[Сергей Сахаров]

5. На одном внешнем адресе может висеть несколько сайтов.
При этом в папке /etc/nginx создаётся папка conf.d и туда пишутся прочие части файла - отдельно для каждого сайта.
6. Имя сайта должно разрешаться в DNS типа
nslookup react-cod.ru
Моя конфа с боевого сервера:
web# cat /etc/nginx/nginx.conf

user  www;
worker_processes  1;
error_log  logs/error.log  info;
pid        run/nginx.pid;

worker_rlimit_nofile 1024;
events {
    worker_connections  800;
}
http {
    include       mime.types;
    default_type  application/octet-stream;
    index         index.php index.html;
    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  logs/access.log  main;
    tcp_nopush     on;
    keepalive_timeout  65;
    gzip  on;
    server_tokens off;
    server {
        listen       web.myhome.local:80;
        server_name  web.myhome.local;
        charset utf-8;
        access_log  logs/web.access.log  main;
        location / {
            root /var/www/html;
            index index.html index.htm;
        }
        error_page  404              /404.html;
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root /var/www/html;
        }
        location ~ \.php$ {
            root           /var/www/html;
            try_files      $uri $uri/ =404;
            fastcgi_pass   unix:run/php-fpm.sock;
            fastcgi_index  index.php;
            fastcgi_param  SCRIPT_FILENAME $document_root$fastcgi_script_name;
            include        fastcgi_params;
        }
        location ~ /\.ht {
            deny  all;
        }
    }
    include "/etc/nginx/conf.d/*.conf";
}

7. Для https надо получать сертификаты - платно или LetsEncrypt

[psopi]

Сергей Сахаров, Что мне то делать?

[Сергей Сахаров]

Для одного из сайтов файл /etc/nginx/conf.d/react.conf будет примерно таким:
(твои настройки проигнорированы, добавишь сам)

server {
        listen      react-cod.ru:80;
        server_name react-cod.ru;
        rewrite ^(.*)$ https://$server_name$1 permanent;
    }
    server {
         listen      react-cod.ru:443 ssl;
         server_name react-cod.ru;
    ssl_certificate /etc/letsencrypt/live/react-cod.ru/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/react-cod.ru/privkey.pem;
    ssl_trusted_certificate /etc/letsencrypt/live/react-cod.ru/chain.pem;
        ssl_stapling on;
        ssl_stapling_verify on;
        resolver 77.88.8.8 77.88.8.1;
        add_header Strict-Transport-Security "max-age=31536000";
        add_header Content-Security-Policy "block-all-mixed-content";
        charset utf-8;
        access_log  logs/react.access.log  main;
        location / {
            root   /var/www/react;
            index  index.html index.htm;
            rewrite_log on;
        }
        error_page   500 502 503 504  /50x.html;
        location = /50x.html {
            root   /var/www/react;
        }
        location ~ \.php$ {
            root           /var/www/react;
            fastcgi_pass   unix:run/php-fpm.sock;
            fastcgi_index  index.php;
            fastcgi_param  SCRIPT_FILENAME  $document_root$fastcgi_script_name;
            include        fastcgi_params;
        }
        location ~ /\.ht {
            deny  all;
        }
    }

[Refguser]

psopi, судя по твоим вопросам - обратиться к специалистам. Ты же не понимаешь ответов..

[psopi]

Refguser, вот и обращаюсь

[Сергей Сахаров]

psopi, я тебе всё расписал по пунктам.
1. Зарегистрировать домен и узнать адреса DNS-серверов регистраторв.
2. Определить, где будет крутиться твой сайт - на арендованном VDS или у тебя дома.
В любом случае ты должен знать, что такое внешний IP и проброс портов.
3. Поднять на нём (на VDS или на домашнем компе) nginx по моим подсказкам.
4. Настроить его для react

[Refguser]

psopi, тебе на фриланс нужно обращаться.