Как настроить веб-приложения Azure для отображения пользовательских страниц ошибок?

Question

У меня есть небольшой тестовый проект Vue, созданный с помощью Vue Cli. Сделал производственную сборку с npm build.

Сайт запущен и работает, но коды состояния 204 и 404 не доходят до моего приложения (Показать страницу с моей ошибкой).

После некоторых исследований я понимаю, что мне нужно настроить Файл web.config, как в ASP.NET, что-то вроде:

<configuration>
    <system.webServer>
         <validation validateIntegratedModeConfiguration="false" />
            <modules runAllManagedModulesForAllRequests="true" />
             <httpErrors 
errorMode="Custom"existingResponse="PassThrough">
    <clear />
    <error statusCode="400" path="index.html"
responseMode="ExecuteURL" />
        </httpErrors>
    </system.webServer>
</configuration>

1. Я не уверен, к какому файлу обращаться в «пути». Моя страница с ошибкой является компонентом, но vue отображает все это в index.html, так что это мое предположение.
2. Где поместить файл web.config при развертывании. Я пытался поместить его в папку dist.
3. Можно ли просто настроить в Azure вместо создания web.config?

Мои попытки не увенчались успехом ..

Я выполняю развертывание с помощью Visual Code (через расширение Azure).

Кто-нибудь, кто знает, как это сделать?

Answer 1

Пользовательская страница ошибки может быть другой .html-страницей. Однако, поскольку об этом заботится компонент Vue, вам не нужно настраивать его в Azure / web.config, если в вашем компоненте Vue нет URL-адреса на основе маршрута для страницы ошибки.

Если у вас есть страница с ошибкой на основе маршрута в вашем приложении Vue, поместите URL-адрес страницы с ошибкой в ​​раздел ошибок web.config (если он доступен напрямую). Однако это может не сработать, если страница ошибки не доступна напрямую и в случае необработанного исключения.

Я предлагаю создать отдельный файл error.html, а также перенаправить на него ваши ошибки из ваших компонентов Vue.