Getting 404 Not found when refresh page in Vue JS

Viewed 1184

I'am getting error "404 Not found" when i refresh any page in my Vue JS application hosted in Azure Web APP (IIS Server) except the default web page index.html

I'am already adding this rewrite configuration in my web.config according to VueJs offical docs :

    <rule name="Handle History Mode and custom 404/500" stopProcessing="true">
        <match url="(.*)" />
        <conditions logicalGrouping="MatchAll">
            <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
            <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
        </conditions>
        <action type="Rewrite" url="/" />
    </rule>                   

This is my web.conf file:

    <configuration>
        <system.webServer>
            <rewrite>
                <rules>
                     <rule name="Handle History Mode and custom 404/500" stopProcessing="true">
                       <match url="(.*)" />
                      <conditions logicalGrouping="MatchAll">
                         <add input="{​​​​​​​REQUEST_FILENAME}​​​​​​​" matchType="IsFile" negate="true" />
                         <add input="{​​​​​​​REQUEST_FILENAME}​​​​​​​" matchType="IsDirectory" negate="true" />
                      </conditions>
                      <action type="Rewrite" url="/" />
                    </rule>
    
    
                    <rule name="redirect all requests" stopProcessing="true">
                        <match url="^(.*)$" ignoreCase="false" />
                        <conditions logicalGrouping="MatchAll">
                            <add input="{​​​​​​​REQUEST_FILENAME}​​​​​​​" matchType="IsFile" negate="true" pattern="" ignoreCase="false" />
                         </conditions>
                        <action type="Rewrite" url="index.html" appendQueryString="true" />
                    </rule>
                </rules>
            </rewrite>
        </system.webServer>
    </configuration>

the `router.js` file have this conf : 

    const router = new VueRouter({
      mode: 'history',
      routes: [...]
    })

Any idea to resolve that ?

Regards

EDIT :

Just ADD pm2 serve /home/site/wwwroot --no-daemon --spa , in

Azure Portal > App Service > Configuration > Application Setting

Azure APP Service based on Linux , don't need to use web.config

BR.

0 Answers
Related