#vue.js #progressive-web-apps #capacitor #vue-pwa
#vue.js #progressive-веб-приложения #конденсатор #vue-pwa
Вопрос:
Я пытаюсь преобразовать свой проект vue pwa в проект Android с помощью конденсатора.
Вот шаги, которые я выполнил.
Сначала добавил pwa в мой проект vue и построил его
vue add @vue/pwa
npm run build
На данный момент приложение работает как pwa, имея serviceworker и автономную поддержку.
Затем я добавил конденсатор и преобразовал его в проект Android
npm install --save @capacitor/core @capacitor/cli
npx cap init
npx cap add android
npm run build
npx cap copy
npx cap open android
Но когда я запускаю проект Android, я получаю следующие ошибки
E/Capacitor/Console: File: http://localhost/js/chunk-vendors.3815e007.js - Line 7 - Msg: TypeError: Cannot read property '-1' of undefined
I/chromium: [INFO:CONSOLE(0)] "An unknown error occurred when fetching the script.", source: (0)
E/Capacitor/Console: File: http://localhost/js/app.15b911b2.js - Line 1 - Msg: Error during service worker registration: TypeError: Failed to register a ServiceWorker for scope ('http://localhost/') with script ('http://localhost/service-worker.js'): An unknown error occurred when fetching the script.
D/Capacitor: App paused
Вот журнал консоли
Мне нужно, чтобы правильно работал serviceworker
РЕДАКТИРОВАТЬ: когда я щелкнул http://localhost/js/app.15b911b2.js
, я обнаружил, что НЕ НАЙДЕН. Но если я добавлю порт к ссылке — http://localhost:8081/js/app.15b911b2.js
я смогу получить файл. Итак, я предполагаю, что если бы мой проект мог использовать ссылку с портом, проблема была бы решена.
Ответ №1:
Сервисные работники не будут выполнять запросы на конденсатор, поэтому они не загружаются. Вы можете добавить этот код следующим MainActivity.java
образом:
if(Build.VERSION.SDK_INT >= 24 ){
ServiceWorkerController swController = ServiceWorkerController.getInstance();
swController.setServiceWorkerClient(new ServiceWorkerClient() {
@Override
public WebResourceResponse shouldInterceptRequest(WebResourceRequest request) {
return bridge.getLocalServer().shouldInterceptRequest(request);
}
});
}
Но обратите внимание, что для этого требуется SDK 24, а конденсатор поддерживает SDK 21, поэтому он не будет работать на 21-23