Как можно решить проблему с ошибкой 404, возникающей при обновлении страницы на мобильном устройстве, когда находишься не в корне подпроекта, а на другой странице, используя конфигурацию nginx?
Для решения проблемы с ошибкой 404 при перезагрузке страницы на мобильном устройстве, необходимо настроить сервер Nginx для обработки маршрутов SPA (Single Page Application) фреймворка Vue.
В файле конфигурации Nginx добавьте следующий блок location для обработки всех запросов, направленных на сервер:
```
location / {
try_files $uri $uri/ /index.html;
}
```
Этот блок location позволит Nginx правильно обрабатывать запросы и перенаправлять их на index.html, где будет работать маршрутизация Vue Router.
Дополнительно, убедитесь, что в конфигурации Vue Router правильно настроены маршруты для всех страниц вашего приложения.
После внесения изменений в конфигурацию Nginx и Vue Router, перезагрузите сервер Nginx, чтобы изменения вступили в силу.
Теперь при обновлении страницы на мобильном устройстве, вы не должны больше сталкиваться с ошибкой 404. Все маршруты должны корректно отображаться и работать на любой странице вашего приложения.
Проблема тут: <br/> <pre><code class="nginx">location ^~ /constructor {
if (...) {
}
try_files ...;
}</code></pre> <br/> if и try_files плохо сочетаются друг с другом " <a href="https://www.nginx.com/resources/wiki/start/topics/depth/ifisevil/" rel="nofollow">If is Evil… when used in location context</a> ". <br/> <br/> Вместо if нужно использовать <a href="https://nginx.org/ru/docs/http/ngx_http_map_module.html" rel="nofollow">map</a> . <br/> <pre><code class="nginx">map $platform $front_path {
default /home/www/redesigned_spa_desktop/dist;
mobile /home/www/redesigned_spa/dist;
}
server {
location ^~ /constructor {
alias $front_path;
try_files $uri /constructor/index.html;
}</code></pre>