URL Based Navigation for PWA

Ionic Framework ionic-v3
1

I’ve asked a number of carefully worded questions here and never received a response to any of them, but here goes one more message in a bottle, just in case.

I have read as much as possible on the DeepLinker for use in providing URLs for external use in a progressive web app. I was able to get a DeepLinker config to show paths in the URL bar, but not to work if they were typed in manually:

    links: [
        {segment: 'dashboard', component: DashboardPage, name: 'Dash'},
        {segment: 'assignment', component: TeacherAssignmentPage, name: 'Assignment', defaultHistory: [DashboardPage]},
        {segment: 'guide', component: GuideContentPage, name: 'Guide', defaultHistory: [DashboardPage]},
    ]
}

I duplicated the paths in app.component.ts:

        this.platform.ready().then(() => {
            Deeplinks.routeWithNavController(this.nav, {
                '/admin/dashboard': DashboardPage,
                '/admin/assignment': TeacherAssignmentPage
            });
        });
    }

This worked only with respect to displaying the URL (/admin was the tab base URL). If I entered the identical URL manually, I would get a 404. There were no console errors. I’m not sure if it didn’t work because I did not install the plugin. It wasn’t clear from the blog article about it if this is necessary in Ionic 2. The article also didn’t explain how to install it if you use a different host for development versus production; the domain is hard-coded in the command line.

I read that the DeepLinker is only a “breadcrumb” and not a true URL navigator. I don’t understand its usefulness, if one can’t enter the URL by hand and get to the page. If DeepLinker is not what is needed to handle true URL navigation, what is? Must one abandon Ionic 2 altogether and go back to using just Angular? Progressive web apps require support for URL based navigation.

Any conceptual or practical guidance would be appreciated. I have read the docs and blog entry on DeepLinker multiple times, and I’ve experimented a great deal with it.

1 Like
2

Have you got it done? I also want to use unique url for each page in my pwa.

3

It kinda works but a lot of bugs yet.

You can check a prototype of my app to get some idea: https://DebtsTracker.io/app/

1 Like