Почему при переходе к /projects nginx выдает ошибку 403 вместо загрузки файла index.html? 

Я разрабатывал сайт-портфолио на Vue и столкнулся с проблемой: когда я пытаюсь открыть страницу /projects на хостинге Nginx, меня выводит ошибка 403. В логах ошибка выглядит следующим образом: 

```
2024/11/10 09:14:27 [error] 28#28: *98 directory index of "/usr/share/nginx/html/projects/" is forbidden, client: 172.21.0.1, server: localhost, request: "GET /projects/ HTTP/1.0", host: "zaralx.ru"
```

Вот конфигурация Nginx:

```
server {
    listen 80;
    server_name zaralx.ru;

    location / {
        proxy_pass http://localhost:13111;
        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;
    }

    # Пытался решить проблему указав путь для /projects
    location /projects {
        proxy_pass http://localhost:13111/projects;
        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;
    }
}
```

Кроме того, проект собирается в Docker-контейнер с конфигурацией Nginx:

```
server {
    listen 80;
    server_name localhost;

    root /usr/share/nginx/html;
    index index.html;

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

    error_page 404 /index.html;

    location = /50x.html {
        root /usr/share/nginx/html;
    }

    error_page 500 502 503 504 /50x.html;
}
```

И вот Dockerfile:

```
FROM node:lts-alpine AS build-stage
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
RUN npm run build

FROM nginx:stable-
```

Можете подсказать, что может вызывать эту ошибку и как её исправить?
  • 10 ноября 2024 г. 9:43
Ответы на вопрос 2 
Ошибка 403 "Forbidden" в вашем случае возникает из-за настроек Nginx по умолчанию, которые не позволяют доступ к директориям, если не настроены права доступа. 

В вашем конфигурационном файле Nginx в обработчике для `/projects` не выполнено указание на файл по умолчанию `index.html`, который должен загружаться, если запрос идет на директорию. Чтобы исправить эту ошибку, вам нужно убедиться, что Nginx правильно обрабатывает запросы к этому пути.

Давайте рассмотрим ваше текущее состояние и предложим изменения.

1. **Обновите конфигурацию для /projects:**

Измените секцию Nginx для `/projects` следующим образом:

```nginx
location /projects {
    alias /usr/share/nginx/html/projects; # путь к директории с файлами
    index index.html; # задаем index файл
    try_files $uri $uri/ /projects/index.html; # пробуем отдать запрашиваемый файл, или index.html
}
```

Обратите внимание на использование `alias`, который позволяет выставить доступ к директории. Это поможет Nginx понять, что нужно искать файлы в указанной директории.

2. **Права доступа:**

Проверьте права доступа к директории `/usr/share/nginx/html/projects`. Убедитесь, что пользователь, под которым работает Nginx, имеет доступ на чтение этой директории. Это можно проверить и исправить, выполнив команды:

```bash
sudo chown -R www-data:www-data /usr/share/nginx/html/projects
sudo chmod -R 755 /usr/share/nginx/html/projects
```

Здесь `www-data` - стандартный пользователь для Nginx, используемый на многих системах, но может отличаться в зависимости от конфигурации вашего сервера.

3. **Проверка конфигурации и перезагрузка Nginx:**

После внесения изменений в конфигурацию не забудьте проверить конфигурацию на ошибки:

```bash
sudo nginx -t
```

Если ошибок нет, перезагрузите Nginx:

```bash
sudo systemctl restart nginx
```

Или, если используете Docker, вам нужно будет пересобрать и перезапустить контейнер.

4. **Проверка Docker-контейнера:**

Если вы работаете с Docker и у вас несколько контейнеров, убедитесь, что запросы проходят сначала через ваш контейнер с приложением Vue, и оттуда передаются к контейнеру Nginx. Ваша конфигурация должна быть синхронизирована с тем, как устроены ваши Docker-сервисы.

### Окончательная конфигурация

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

```nginx
server {
    listen 80;
    server_name zaralx.ru;

    location / {
        proxy_pass http://localhost:13111;
        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;
    }

    location /projects {
        alias /usr/share/nginx/html/projects;  # Убедитесь, что это правильный путь
        index index.html;
        try_files $uri $uri/ /projects/index.html;
    }
    
    error_page 403 /403.html;  # Создайте 403.html для для более удобных сообщений об ошибках
}
```

После выполнения всех этих шагов у вас должно быть исправлено отображение проекта по адресу `/projects`.
Отдельный локейшен /projects не нужен. 
 
 Проблема в разрешениях на каталог /usr/share/nginx/html/projects - они должны быть достаточны, чтобы веб-сервер мог получить список содержимого (обычно делают read + execute, например 0755).
Похожие вопросы
    Показать ещё