ионный / угловой pwa не запускается при запуске с домашнего экрана - PullRequest
Новая
       7

ионный / угловой pwa не запускается при запуске с домашнего экрана

0 голосов
/ 11 ноября 2018

Я следовал этим инструкциям, чтобы добавить поддержку pwa и разместить мое приложение ionic v4:

Приложение прекрасно загружается в Safari, и я также могу добавить приложение на домашний экран (ios). Однако с начального экрана приложение не запускается при запуске.

Если я захожу в Safari DevTools и перезагружаю страницу после запуска, приложение просто отлично.

Мне тоже не совсем понятны минимальные требования для pwa. Мое приложение загружает google maps javascript api при запуске, поэтому оно не работает без подключения к сети. Я не уверен, является ли это частью проблемы или нет.

Ионная информация 

Ionic:

   ionic (Ionic CLI)             : 4.3.1 (/Users/m/.nvm/versions/node/v8.9.4/lib/node_modules/ionic)
   Ionic Framework               : @ionic/angular 4.0.0-beta.15
   @angular-devkit/build-angular : 0.8.7
   @angular-devkit/schematics    : 0.8.7
   @angular/cli                  : 7.0.5
   @ionic/angular-toolkit        : 1.1.0

Capacitor:

   capacitor (Capacitor CLI) : 1.0.0-beta.7
   @capacitor/core           : 1.0.0-beta.7

Cordova:

   cordova (Cordova CLI) : 8.0.0
   Cordova Platforms     : ios 4.5.5
   Cordova Plugins       : cordova-plugin-ionic-keyboard 2.1.3, cordova-plugin-ionic-webview 2.1.4, (and 10 other plugins)

System:

   ios-deploy : 2.0.0
   NodeJS     : v8.9.4 (/Users/m/.nvm/versions/node/v8.9.4/bin/node)
   npm        : 6.4.1
   OS         : macOS High Sierra
   Xcode      : Xcode 10.0 Build version 10A255

при перезагрузке приложения pwa из DevTools я вижу эту ошибку: 

[Error] ERROR
Error: Uncaught (in promise): SecurityError: MIME Type is not a JavaScript MIME type
    vt (main.0c301dd161ca4cc6d73d.js:1:123807)
    handleError (main.0c301dd161ca4cc6d73d.js:1:124014)
    next (main.0c301dd161ca4cc6d73d.js:1:139466)
    (anonymous function) (main.0c301dd161ca4cc6d73d.js:1:131304)
    __tryOrUnsub (main.0c301dd161ca4cc6d73d.js:1:247187)
    next (main.0c301dd161ca4cc6d73d.js:1:246340)
    _next (main.0c301dd161ca4cc6d73d.js:1:245384)
    next (main.0c301dd161ca4cc6d73d.js:1:245056)
    next (main.0c301dd161ca4cc6d73d.js:1:272048)
    emit (main.0c301dd161ca4cc6d73d.js:1:131085)
    run (polyfills.0548e3ebf74d8c45f01b.js:1:2461)
    onHandleError (main.0c301dd161ca4cc6d73d.js:1:133065)
    runGuarded (polyfills.0548e3ebf74d8c45f01b.js:1:2721)
    e (polyfills.0548e3ebf74d8c45f01b.js:1:11589)
    microtaskDrainDone (polyfills.0548e3ebf74d8c45f01b.js:1:11638)
    d (polyfills.0548e3ebf74d8c45f01b.js:1:10261)
    promiseReactionJob

Похоже, это должно быть связано с Angular ServiceWorkers + ошибка MIME-типа , но я использую ionic build --prod; firebase deploy и выходные данные сборки сводятся к минимуму.

Вот сетевой журнал, когда я запускаю приложение с главного экрана:

Network log when App is launched from home screen

А вот как это выглядит после того, как я нажимаю перезагрузить в DevTools

enter image description here

1 Ответ

0 голосов
/ 20 ноября 2018

Сейчас я использую это как обходной путь: 

  async patch_PWA_bootstrap(){
    const RELOAD_LIMIT = 5000
    const el = document.getElementsByTagName('HTML')[0];
    const now = Date.now();
    if (el.classList.contains('plt-pwa')){
      const resp = await Storage.get({key:'PWA_RELOAD'});
      if ( now - JSON.parse(resp.value) < RELOAD_LIMIT) 
        return;  // wait at  before next reload

      const cancel = setTimeout( async ()=>{
        // something not bootstrapping correctly with pwa.  reload() fixes
        await Storage.set({key:'PWA_RELOAD', value:JSON.stringify(now)});
        window.location.reload();
      },100)
    }
  }

Я звоню, когда приложение PWA загружается и когда оно возвращается на передний план

...