11

Because of some performance issues, I'm trying to upgrade an angularJS2/phonegap app to use WKWebView on iOS.

Unfortunately, any calls to route navigate do not work. This includes routerlink and this.route.navigate calls. There are no errors being thrown. Has anyone else seen this and/or perhaps have a workaround?

The code works fine using the normal UIWebView.

I'm a relative newbie to Angular so any suggestions are welcomed.

Here's what some of the relevant code looks like:

import { Component } from "@angular/core";
import { Routes, Router, ActivatedRoute } from "@angular/router";
import { LoggedInCallback } from "./service/cognito.service";

export class HomeComponent implements LoggedInCallback {

constructor(public router:Router){
}

isLoggedIn(message:string, isLoggedIn:boolean) {
    if (isLoggedIn){
      this.router.navigate(['/home/cl']);
    }
    else {
      console.log('HomeComponent: '+message);
    }
}

routing module:

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { FormsModule } from '@angular/forms';
import { Routes, RouterModule } from '@angular/router';
import { CategoryListComponent } from './categorylist/categorylist.component';


const approutes: Routes = [
    {
         path: 'home/cl',
         component: CategoryListComponent
    },
    ...
];
@NgModule({
  declarations: [

 ],
  imports: [RouterModule.forRoot(approutes), 
        BrowserModule, 
        FormsModule],
  exports: [RouterModule]

})
export class AppRoutingModule { }

In response to a comment below:

As mentioned, this a phonegap app, so most of the references are using (I assume) the file: protocol. However, the first page loads okay, and it references content within a single JavaScript file. The odd thing is that all of the other router-referenced content are also in that same JavaScript file.

I was hoping that someone would understand the nuts and bolts of the router behavior to explain why it doesn't work in this environment.

Mike M
  • 4,358
  • 1
  • 28
  • 48

1 Answers1

2

Are you accessing this through a web server or file:// protocol? It seems wkwebview has issues with that.

See this article

PersyJack
  • 1,736
  • 1
  • 21
  • 32
  • @Mike if you look at the article it mentions Cordova loads the index page then nothing happens "Loading the index page Apple in iOS 9 fixed a problem where you couldn't load a HTML document in WKWebView. This is the main reason Cordova has been able to add official support for WKWebView in iOS 9. So your index page appears in the WKWebView, then... nothing else works." "WKWebView: it appears to treat local files as if they came from a remote server, even though they're in the app itself, and such requests are blocked." Since PhoneGap is Cordova try installing a local server. – PersyJack Nov 18 '16 at 20:29
  • I did read the article and I'm familiar with the problem. However, it shouldn't apply since all the .js is in one file and that file is already loaded. I was hoping someone out there had some inside knowledge of the router behavior and could explain what is happening.. I do appreciate the help though... – Mike M Nov 21 '16 at 12:57
  • @MikeM take a look at this: http://stackoverflow.com/a/28676439/3481709 Seems like you need to use loadFileURL – PersyJack Nov 21 '16 at 14:49
  • If you can't access the article mentioned, use this link to access https://www.construct.net/en/blogs/ashleys-blog-2/hacking-something-useful-932 – Buddhika Sep 08 '21 at 03:30