Uniapp uses PWA

PWA

about PWA There are many definitions of , But in fact, the most popular understanding is that you can send notifications offline , image app The same will h5 Web pages are displayed in the form of icons on the desktop , And you can do something offline , adopt HTTPS Provide , To prevent snooping and ensure that the content is not tampered with web App.

Service Worker

mention pwa I have to mention service worker , Because in use pwa The premise is to register One thread .
service worker yes Service Worker It's a be based on HTML5 API , An independent execution thread , A separate scope , A separate operating environment , Must be in HTTPS Environment to work . Of course, when debugging locally , Use localhost Is not affected by HTTPS Limit .

Use

The author in uniapp Chinese vs pwa In fact, the use of is mainly to h5 Page shortcut to the desktop .
But there is a big problem in the registration process , So record it to avoid further stepping on the pit .
In use , Found a package of others PWA builder, Easy to use , link ：pwa builder, It is necessary to introduce , This is for the convenience of passing script introduce , It's simple here. No problem .
Then build manifest.json, introduce , There is an error ：

Manifest: Line: 1, column: 1, Syntax error.

Register at service worker when

if ('serviceWorker' in navigator) {