Обслуживание страницы 404 с приложением, созданным с помощью Vue-CLI

Question

Я использую Vue-CLI для создания приложений Vue.Мне не нравится одно поведение: любой несуществующий URL (например, localhost:8080/nonexistent/file.html) обслуживается с кодом 200, как если бы он был корнем: localhost:8080.

. Это делает отладку запросов XHRиногда очень грязно.

Как я могу вернуть код 404?

Answer 1

Функция, которую вы наблюдаете, на самом деле webpack-dev-server historyApiFallback, которая отвечает index.html для неразрешенных URL-адресов (предназначенных для SPA с маршрутизацией на стороне клиента).Это включено по умолчанию в проектах Vue CLI, но вы можете отключить его с помощью Vue CLI devServer config :

1. Создать vue.config.js (если это не такуже существует) со следующим содержимым:

   module.exports = {
     devServer: {
       historyApiFallback: false
     }
   }
   

2. Перезапустите сервер разработки (npm run serve).