个人中心
gpt4 book ai didi

javascript - 全新安装的 PWA 不显示内容

转载 作者：行者123 更新时间：2023-12-01 00:43:56 29 4
gpt4 key购买 nike

我用了A Simple Progressiv Web App Tutorial联系 PWA。

现在我面临的问题是，我已经更改了 h1 内容Hello World! 到 Hello World，Minamo!。如果我在 iPhone 上的 safari 浏览器中打开该页面，则会完美显示该页面。

当我将 PWA 存储在 iPhone 上时，通过共享 > 添加到主屏幕并在主屏幕上打开 PWA，它会向我显示旧内容: Hello World !。

如何获取具有正确内容的最新版本(在 Safari 浏览器中显示)作为 PWA 存储在 iPhone 上？

注意:在将新的 PWA 添加到主屏幕之前，我删除了旧版本的 PWA。

这是我的文件:

index.html

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>Hello World</title>
  <link rel="manifest" href="/manifest.json">
  <link rel="stylesheet" href="css/style.css">
  <link rel="icon" href="favicon.ico" type="image/x-icon" />
  <link rel="apple-touch-icon" href="images/hello-icon-152.png">
  <meta name="viewport" content="width=device-width, initial-scale=1.0">
  <meta name="theme-color" content="white"/>
  <meta name="apple-mobile-web-app-capable" content="yes">
  <meta name="apple-mobile-web-app-status-bar-style" content="black">
  <meta name="apple-mobile-web-app-title" content="Hello World">
  <meta name="msapplication-TileImage" content="images/hello-icon-144.png">
  <meta name="msapplication-TileColor" content="#FFFFFF">
</head>
<body class="fullscreen">
  <div class="container">
    <h1 class="title">Hello World, Minamo!</h1>
  </div>
  <script src="js/main.js"></script>
</body>
</html>

js/main.js

window.onload = () => {
  'use strict';

  if ('serviceWorker' in navigator) {
    navigator.serviceWorker
             .register('./sw.js');
  }
}

sw.js

var cacheName = 'hello-pwa';
var filesToCache = [
  '/',
  '/index.html',
  '/css/style.css',
  '/js/main.js'
];

/* Start the service worker and cache all of the app's content */
self.addEventListener('install', function(e) {
  e.waitUntil(
    caches.open(cacheName).then(function(cache) {
      return cache.addAll(filesToCache);
    })
  );
});

/* Serve cached content when offline */
self.addEventListener('fetch', function(e) {
  e.respondWith(
    caches.match(e.request).then(function(response) {
      return response || fetch(e.request);
    })
  );
});

最佳答案

现在在您的应用程序上呈现的“index.html”可能是您首次启动应用程序时缓存的，因此您将清除该应用程序的缓存内存。

在我的 iPhone6s 上我会去

  1. 设置
  2. Safari
  3. 高级
  4. 网站数据
  5. 编辑(右上角)
  6. 然后点击红色图标清除我的应用的数据。

启动您的应用程序，您应该会看到新数据

当然，当您更新网络应用程序的内容时，您并不希望用户总是这样做，为了避免这种情况，可以使用Update Service worker method。您可以使用它来更新您的 Service Worker。

关于javascript - 全新安装的 PWA 不显示内容，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/57531186/

29 4 0
文章推荐： python - 如何根据某些条件更改 pandas 中的列值
文章推荐： jquery - 将变量发送到 JQuery 函数
文章推荐： python - 尝试在 pythonanywhere 上使用 praw 提交图像时出现 WebSocketProxyException 403
文章推荐： mysql - 按日期排序 DESC 在 mysql 中不起作用
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com