Search code examples
azureazure-static-web-appazure-static-website-hostingazure-static-web-app-routingswa-cli

Route protected with staticwebapp.config.json in Azure Static Web App return 404


I'm using SWA CLI to emulate an Azure Static Web App with an Angular application on my local machine. The staticwebapp.config.json file is used to protect specific routes. The current configuration works fine in the local emulator, but when publishing the application to Azure Static Web App, the "/test" route returns a 404 error.

enter image description here

This is my configuration on staticwebapp.config.json:

{
  "navigationFallback": {
    "rewrite": "/index.html"
  },
  "routes": [
    {
      "route": "/test",
      "allowedRoles": ["authenticated"]
    },
    {
      "route": "/.auth/login/github",
      "statusCode": 404
    },
    {
      "route": "/logout",
      "redirect": "/.auth/logout"
    }
  ],
  "responseOverrides": {
    "401": {
      "statusCode": 302,
      "redirect": "/.auth/login/aad"
    }
  }
}

}

Where the route "/test" matches with my angular route (app-routing.module.ts):


const routes: Routes = [
  {
    path: "home",
    component: AnalisysResultsComponent,
  },
  {
    path: "test",
    component: TestProtectedComponent
  },
  {
    path: "**",
    redirectTo: "home"
  }

];

In the emulator with SWA CLI it works fine on my local PC, but when publishing to Azure Static Web App the /test path returns 404 (The /home route work fine)

Note: this is with a business account from my work; However, I performed this same exercise with my personal account in Portal Azure and it works fine.

Aditional informations:

This screen is from my personal account with the same configuration, (Before that screen it asks me to log in with a Microsoft account):

enter image description here

and I have a /home route that work fine

I'm trying to access a protected route with staticwebapp.config.json file, and I'm expecting that it show the Microsoft Auth Page

[UPDATE]

When I write the route directly on the url path return 404 but when I navigate to the route with clicking on button <a routerLink="/test">test</a> I can access to the route, but the auth function doesn't trigger


Solution

  • [SOLUTION]

    When the deployment is done the staticwebapp.config.json file was not being deployed, I am using Angular, I moved the staticwebapp.config.json file to 'src' folder and then added the following configuration in the angular.json file:

    "assets":[
              "src/favicon.ico",
              "src/assets",
              "src/assets/pdf.worker.min.js",
              "src/staticwebapp.config.json"
             ],