Vue Router Navigation in IIS

Andrés O ́Farrill 0
Viewed 27

Trying to understand why my routes are failing when I refresh my page on a VueJS application hosted on IIS.

Everything normal while I browse but when I press F5 or update view information through a button, it throws me a 403 error.

I share some images of the project hosted in IIS:

Web_1 Web_2

Error 403 Refresh F5

Console Error

The website is structured as follows in IIS:

Structured Web IIS

Structured Web Directory 1

Structured Web Directory 2

Web.config

When running the project locally I have no problem, only when I mount the website in IIS.

I'm wondering if others have experienced that issue, or if it's possible, please kindly guide me on what area I should look at to get this working in an IIS hosting environment.

Thanks.

iis vue.js javascript html
1 Answers

This error can have several reasons:

  1. Directory browsing not enabled: Directory browsing is the ability of a web server to list the contents of a website's root directory in a web browser, enabling visitors to view files and browse directories.

  2. Default document not configured: The default document is the file served by the web server when the client does not specify a specific file in the Uniform Resource Locator (URL). By default, the web server software recognizes file names such as default.html, index.html, and so on.

  3. ASP.NET features are not installed on the server: The default documentation (like aspx and index.html) is only available for websites using traditional frameworks. Using modern frameworks and programming techniques such as MVC, default pages are defined and handled by the developer in the application code. Therefore, if your website uses MVC or similar technology, you need to install ASP.NET features on the server.

To install ASP.NET, use the following PowerShell command (This command installs ASP.NET 4.5 or higher on the web server):

Install-WindowsFeature Web-Asp-Net45 -IncludeAllSubFeature

If your website should use an older version of ASP.NET (eg 3.5 or lower), use the following command instead:

Install-WindowsFeature Web-Asp-Net -IncludeAllSubFeature
  1. Another possibility is that the wrong .NET version (v2.0 instead of v4.0) is configured on the website application pool. Open IIS Manager. Find the application pool for the corresponding site, right-click it and select Advanced settings... Make sure the option for .NET CLR Version is v4.0.

Hope this helps you!

YurongDai0
Related