Блог

Главная - Вопросы по программированию - развертывание подкаталога vuejs nginx при обновлении 404

развертывание подкаталога vuejs nginx при обновлении 404

#vue.js #nginx

#vue.js #nginx

Вопрос:

я настроил свой nginx с помощью этих конфигураций

   location / {
      try_files $uri $uri/ /index.php?$query_string;
  }

  location /apps/ {
    try_files $uri $uri/ index.php;
  }

моим результатом npm run build i было переименование mv dist apps

первый путь маршрутизатора '/' будет перенаправлен на path /login 

 const router = new VueRouter({
  mode: 'history',
  base: process.env.BASE_URL,
  scrollBehavior() {
    return { x: 0, y: 0 }
  },
  routes: [
    {
      path: '/',
      name: 'auth-login',
      component: () => import('@/views/pages/authentication/Login.vue'),
      meta: {
        layout: 'full',
        resource: 'Auth',
        redirectIfLoggedIn: true,
      },
    },
  ]

поэтому, когда я собираюсь www.subdomain.maindomain.id/apps сделать перенаправление на www.subdomain.maindomain.id/apps/login

но когда я попробовал обновить, появилось сообщение 404. (Файл не найден. )

у меня были попытки с другими

 location = /apps/ {
#   try_files $uri $uri/ /apps/dist/index.html;
#   alias /apps/dist/index.html;
  return 301 /apps/dist/index.php;
}

location /apps/dist/ {
    try_files $uri $uri/ index.php;
}
location @rewrites {
        rewrite ^.*$ /index.html last;
}

тем не менее я получил 404 при обновлении

и это моя полная конфигурация nginx https://gist.github.com/yogithesymbian/b137be9aa2adb87ac7652b9bfbf9394c

если я изменю свой режим на хэш

 mode: 'hash',

моя страница может быть обновлена, но должна #

Ответ №1:

Я думаю, что вам нужно перенаправить ‘/ apps / login’ на ‘/ apps’ в nginx.

Для Vue существует только одна страница, которая является корневой страницей (остальные страницы генерируются js). Хотя вы видите /apps/login, /apps/login.html или /apps/login.php на самом деле они не существуют. Другими словами, файл /apps/dist/login.php (в вашем случае nginx запускает:try_files $uri $uri/ index.php ; ) не найден. Следовательно, он возвращает 404.

Лично я не рекомендую использовать историю. Это слишком неуклюже для создания пути перенаправления для этих подобных случаев. Если вы не хотите с этим справляться, используйте режим хэширования и используйте функцию routes в Vue.

Метки: