dongqiyou0303 2018-04-16 11:13
浏览 67
已采纳

如何让Workbox PWA与.php文件一起使用

I am new to PWA and using Workbox; So I have this test folder with the following file structure, using localhost as my server (i.e. localhost/test)


  1. index.html

  2. test.css

  3. test.jpg

  4. test.js

  5. sw.js (Code Shown below);

    importScripts('https://storage.googleapis.com/workbox-cdn/releases/3.0.0/workbox-sw.js');

    if (workbox) {
    console.log(`Yay! Workbox is loaded
  • 写回答

2条回答 默认 最新

  • dongqian5384 2018-04-18 18:22
    关注

    To elaborate to @pate's answer.

    Workbox by default tries to make sure that pretty URL's are supported out of the box.

    So in the first example, you cached /test/index.html. So when you request /test/, Workbox precaching actually checks the precache for:

    • /test/
    • /test/index.html

    If your page was /test/about.html, and you visited the page /test/about precache would append a .html and check for that.

    When you switched to the .php extension this logic would suddenly no longer work.

    There are a few options to get this working:

    1. If you are using any of the workbox tools to build your manifest, you are use the templatedUrls feature to map to a file (More details here):

      templatedUrls: {
          '/test-2/': ['/test-2/index.php']
      }
      
    2. If you are making the precache list yourself server side, you can just tell it to precache the URL /test-2/ without the index.php and precaching will simply cache that. Please note that you must ensure the revision changes with any changes to index.php.

    3. If you aren't making the precache manifest, you can use urlManipulaion option to tell precache to check for URL's, (More details here):

      workbox.precaching.precacheAndRoute(
        [
          .....
        ],
        {
          urlManipulaion: ({url}) => {
            // TODO: Check if the URL ends in slash or not
            // Add index.php based on this.
            return [url, `${url}.php`, `${url}index.php`];
          }
        }
      );
      
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(1条)

报告相同问题?

悬赏问题

  • ¥15 MATLAB代码求涡量
  • ¥100 采用栈和深度优先算法对我的代码进行修改显示路径
  • ¥15 pointnet2包安装
  • ¥20 射频功率问题,解答者有酬谢!
  • ¥80 构建降雨和积水的预测模型
  • ¥15 #Qt Transform setTransform()在鼠标拖动移动视角是一致在原地不动,无法变换视角(细微观察似乎视图有在原地抖动),无法变换视角(细微观察似乎视图有在原地抖动)
  • ¥50 如何利用无人机拍摄的数码照片测量鸟卵的长短径
  • ¥100 github贡献者给与奖励
  • ¥15 使用DS18B20+ESP8266获取温度数据返回-127.00
  • ¥15 odbc代码新增sqlserver数据源