CODEWITHSUNDEEP
angularhttp-redirectprogressive-web-appsservice-worker
roca323
roca323

Reputation: 465

how to handle authentication redirect with angular pwa service worker

I have an Angular 9 app that I just turned into a PWA using the @angular/pwa package in order to improve performance. When opening the application, it's supposed to redirect to our company's authentication page. However, after enabling service workers i am getting an error from my API because the user is not authenticated. From the docs, I thought adding the auth url to the navigationUrls property of ngsw-config.json it would solve this, but it's not redirecting to login page.

This is what my ngsw-config.json looks like:

{
  "$schema": "./node_modules/@angular/service-worker/config/schema.json",
  "index": "/index.html",
  "assetGroups": [
    {
      "name": "app",
      "installMode": "prefetch",
      "resources": {
        "files": [
          "/favicon.ico",
          "/index.html",
          "/manifest.webmanifest",
          "/*.css",
          "/*.js"
        ]
      }
    },
    {
      "name": "assets",
      "installMode": "lazy",
      "updateMode": "prefetch",
      "resources": {
        "files": [
          "/assets/**",
          "/*.(eot|svg|cur|jpg|png|webp|gif|otf|ttf|woff|woff2|ani)"
        ]
      }
    }
  ],
  "navigationUrls": [
    "https://webaddress.net/CoreSTS/corelogin/login*"
  ],
  "navigationRequestStrategy": "freshness"
}

Any ideas as to what i'm missing?

Upvotes: 0

Views: 1719

Answers (1)

norekhov
norekhov

Reputation: 4233

navigationUrls simply define what urls should return your index.html page. Ideally if you have SPA with a single entry point you need to set it to ["/"] to avoid occasional registering of new service workers.

If the request is not handled by one of service worker aspects including assetGroups, dataGroups and navigationUrls it will be handled with a simple fetch and this is what you want.

Though I noticeced that in this case Chrome shows a cancelled request in service worker and repeats this request in standard context.

It's not clear what it means and avoid this mess I suggest to add ?ngsw-bypass parameter to completely eliminate service worker logic. This also helps with OAuth redirects e.t.c.

Upvotes: 2

Related Questions