API 浏览器
Quasar CLI with Vite - @quasar/app-vite
什么是 PWA

渐进式 Web 应用 (PWA) 是一种使用现代 Web 功能为用户提供类似应用体验的 Web 应用。这些应用满足特定要求(见下文),部署到 Web 服务器,并可通过 URL(基于 HTTPS 协议)访问。

¥A Progressive Web App (PWA) is a web app that uses modern web capabilities to deliver an app-like experience to users. These apps meet certain requirements (see below), are deployed to web servers and accessible through URLs (on HTTPS protocol).

这可以与 Cordova 配合使用,为所有用户提供多个部署目标。Quasar CLI 允许你将应用部署为 PWA 和移动应用,并充分利用这两种渠道。

¥This can work in conjunction with Cordova to provide a multiple deploy targets for all your users. Quasar CLI allows you to deploy your app as a PWA as well as a Mobile app and take advantage of both channels.

必需项(What is Required)

¥What is Required

要被视为渐进式 Web 应用,你的应用必须:

¥To be considered a Progressive Web App, your app must be:

  • 渐进式 - 适用于所有用户,无论使用哪种浏览器,因为它们是以渐进增强为核心原则构建的。

    ¥Progressive - Work for every user, regardless of browser choice, because they are built with progressive enhancement as a core tenet.

  • 响应式 - 适用于任何设备,包括台式机、手机、平板电脑,或任何未来可能的设备。

    ¥Responsive - Fit any form factor, desktop, mobile, tablet, or whatever is next.

  • 独立连接 - 增强 Service Worker 功能,使其能够在离线或低质量网络上工作。

    ¥Connectivity independent - Enhanced with service workers to work offline or on low quality networks.

  • 类似应用 - 使用应用外壳模型提供应用风格的导航和交互。

    ¥App-like - Use the app-shell model to provide app-style navigation and interactions.

  • 新鲜 - 得益于 Service Worker 的更新过程,始终保持最新状态。

    ¥Fresh - Always up-to-date thanks to the service worker update process.

  • 安全 - 通过 HTTPS 服务,以防止监听并确保内容未被篡改。

    ¥Safe - Served via HTTPS to prevent snooping and ensure content has not been tampered with.

  • 可发现 - 由于 W3C 清单和服务工作线程注册范围允许搜索引擎找到它们,因此可识别为“应用”。

    ¥Discoverable - Are identifiable as “applications” thanks to W3C manifests and service worker registration scope allowing search engines to find them.

  • 可重新启用 - 通过推送通知等功能轻松实现再次互动。

    ¥Re-engageable - Make re-engagement easy through features like push notifications.

  • 可安装 - 允许用户将他们认为最有用的应用“保留”在主屏幕上,而无需麻烦地使用应用商店。

    ¥Installable - Allow users to “keep” apps they find most useful on their home screen without the hassle of an app store.

  • 可链接 - 可通过 URL 轻松共享,无需复杂的安装。

    ¥Linkable - Easily share via URL and not require complex installation.

更多信息请参阅 Addy Osmani 的 关于 PWA 的文章

¥More information available on Addy Osmani’s article about PWA.

清单文件(Manifest File)

¥Manifest File

应用清单文件描述了你的应用所需的资源。这包括应用的显示名称、图标以及启动画面。你将看到它为 /src-pwa/manifest.json。更多信息:Manifest 文件

¥An app manifest file describes the resources your app will need. This includes your app’s displayed name, icons, as well as splash screen. You will see this as /src-pwa/manifest.json. More information: Manifest file.

服务工作线程(Service Worker)

¥Service Worker

Service Worker 提供了一种以编程方式缓存应用资源(文件)的方法。编程式 API 允许开发者决定如何处理缓存,并提供比其他选项更灵活的体验。

¥The Service worker provides a programmatic way to cache app resources (files). The programmatic API allows developers to decide how to handle caching and provides a much more flexible experience than other options.

更多信息:Service Worker API

¥More information: Service Worker API.