使用 Cordova 为本地静态网站提供服务？

Posted 2023-02-19

【中文标题】使用 Cordova 为本地静态网站提供服务？

【英文标题】：Serving a local static website using Cordova?

【发布时间】：2019-06-24 23:55:42

【问题描述】：

我们目前正在开展一个项目，该项目包括一个网站，以及适用于 android、ios 和（是）Windows 手机的应用程序。

这些应用在所有三个平台上都是相同的，并且相对简单，至少在理论上是这样。

他们需要提供对网站内容的离线访问。这是静态内容，一组 .html 页面和资产（图像、css、javascript 等）也是如此。 当互联网连接可用时，他们需要能够定期自动更新内容。 任何外部链接都应在用户的 Internet 浏览器中打开，而不是在应用程序中打开。 应用不应显示任何浏览器“chrome”（例如地址栏等）。

Cordova 似乎是解决这个问题的好方法（尽管我愿意接受其他建议）。但是，我很难找到有关如何继续的任何信息。

对于第 1 点，我认为它的工作方式是应用加载某种形式的 Web 视图，指向 file://path/to/site/index.html。假设站点对所有内部链接和资产使用相对 URL，这足以提供站点的完全可浏览的离线版本。该应用程序将附带当前站点的静态导出。

对于第 2 点，我设想 Cordova 应用程序偶尔会运行同步过程，这实际上是向网站 API 发出的一些网络请求，以查明是否有新内容。然后它将下载任何新文件，将它们放在第 1 点中提到的文件结构中，覆盖现有文件。 （出于这个问题的目的，我不在乎这是否会使网站暂时处于不一致的状态。）

第 3 点 听起来 微不足道，但我不确定是否如此。 target="_blank" 就够了吗？或者在点击链接时使用一点 JavaScript 来触发一些 Cordova 动作？我们控制 HTML 的生成方式，因此我们可以在必要时插入额外的标记以供离线使用。

任何人都可以就如何以这种方式处理自动更新的本地静态站点提供任何建议吗？有可能吗？

【参考方案1】：

Cordova 主要将您的 html 文件存储在应用程序中，并在 WebView 中显示 index.html（或其他页面，如果您定义它）​​。 这里很酷的是，Cordova 还将提供一个 API 来从 JS 调用设备 API。

Cordova 不会自动将您的 html 文件和资产重新加载到应用程序中。为此，您需要发布一个新的应用程序，或者您只需重新加载应用程序中的数据，然后您可以在 JavaScript 中控制所有这些。

如果您不需要任何设备 API，我建议您查看 ServiceWorkers 以缓存和重新加载文件。 使用一些 HTML 标签，您还可以在按下“添加到主屏幕”后创建一个真正类似于应用程序的行为。

最好的问候 马克

【讨论】：

我的理解是 Cordova 以这样一种方式“编译”页面，以至于我们不能简单地将 HTML 和资产替换为较新的版本。我认为我们看到了一种加载新 HTML 的方法，但这看起来不适用于 CSS 等。你是说这可能吗？发布应用程序的新版本是我们需要避免的步骤。下载完整的网站内容集可能是一种选择，但在实践中可能会占用大量带宽。

Cordova 只会将您的文件存储在 app 文件夹中，并在 WebView 中打开您的起始页。要更新应用程序中的 HTML 和其他文件，您需要编写特定于平台的插件。这不是 Cordova 的用途。

但是您可以使用 ServiceWorkers 在浏览器中（甚至在使用 Cordova 的 WebView 中）存储和更新您的网站文件，并使其离线可用。

“在浏览器中”是什么意思？

看看：developer.mozilla.org/en-US/docs/Web/API/Service_Worker_API 您的网站控制着缓存行为（以及更多），但浏览器如何以及在何处准确存储您的数据取决于实现。我假设大多数浏览器会将数据存储在您的 appdata(Win) 文件夹中的 sqlite 数据库中。