【Chrome web.dev Live 2020总结】第二天第5集：将PWA作为Android应用发布

什么是PWA

• PWA：Progressive web apps，渐进式 Web 应用

• 目标：Reliable + Fast + Engaging

• 优势：

• 减少开发成本，使用js语言完成跨端应用开发

• 无需安装，开发上线即可，无需等待应用商城审核

• 核心特性：

• Web App Manifest

• Service Worker

• Cache API 缓存

• Push&Notification 推送与通知

• Background Sync 后台同步

• 响应式设计

• 上手入门：

• PWA介绍及快速上手搭建一个PWA应用

• Your First Progressive Web App

集成PWA的思路

传统的方法

• Webview：不支持Web Notifications, Web Bluetooth, Web USB等现代Web API

• 使用自定义内嵌浏览器：包体积太大，并且有大量的工程方面的工作

使用Trusted Web Activity

• 提供全量的Web Platform API

• 可减少包的体积

• 但是开发者还是需要了解Android Developer Tooling (Android studio, Java/Kotlin, Gradle)

• 可以通过使用Bubblewrap来解决跨端的障碍

Bubblewrap

What is Bubblewrap

• Bubblewrap是一个Node.js项目，包含库和命令行界面，可以通过使用它来构建Android项目

 How to use Bubblewrap

• 需要Node.js或者以上的node开发环境 + 一台android手机方便用于真机调试

• 下载Bubblewrap的外部依赖：JDK + Android Command-line tools

• npm install: npm i -g @bubblewrap/cli

• init初始化项目，传入PWA项目的manifest.json文件路径，且需要JDK和Android命令行工具的目录地址： bubblewrap init --manifest=xxxx

• build构建项目：bubblewrap build 输出三个文件

• 质量报告

• assetlink.json 用于验证Trusted Web Activity中打开的域名

• app-release-signed.apk

install运行项目：bubblewrap install 运行这个由PWA生成的Android原生应用程序

Bubblewrap入门上手

• Github