gpt4 book ai didi

javascript - 是否可以动态更改 manifest.json 文件

转载 作者:行者123 更新时间:2023-12-05 00:31:33 25 4
gpt4 key购买 nike

我正在研究 React PWA,我想知道是否可以将图标 URL 动态添加到 manifest.json文件。所以我的目标是在用户登录之前显示通用应用程序图标。之后,我从远程 API 请求一个新图标并将其设置为 list 文件,以便更改仪表板上的网站图标和移动图标.
理想情况下,我希望在没有任何后端更改的情况下实现这一点

最佳答案

在 HTML 中有一个带有 rel="manifest" 的链接标签但没有 href 属性。稍后使用此标签填充您的 list 。如:
您的文件:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>title</title>
<link rel="manifest" id="my-manifest-placeholder">
</head>
<body>
<!-- page content -->
</body>
</html>
现在在 Javascript 中有两个选项:
  • 现在在 Javascript 中有两个选项:
    使用 URL 设置 href 属性:document.querySelector('#my-manifest-placeholder').setAttribute('href', '/my-dynamic-manifest-url.json');
  • 使用 JSON 对象设置 list
  • var myDynamicManifest = {
    "name": "Your Great Site",
    "short_name": "Site",
    "description": "Something dynamic",
    "start_url": "<your-url>",
    "background_color": "#000000",
    "theme_color": "#0f4a73",
    "icons": [{
    "src": "whatever.png",
    "sizes": "256x256",
    "type": "image/png"
    }]
    }
    const stringManifest = JSON.stringify(myDynamicManifest);
    const blob = new Blob([stringManifest], {type: 'application/json'});
    const manifestURL = URL.createObjectURL(blob);
    document.querySelector('#my-manifest-placeholder').setAttribute('href', manifestURL);
    SOURCE

    关于javascript - 是否可以动态更改 manifest.json 文件,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/65808992/

    25 4 0
    Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
    广告合作:1813099741@qq.com 6ren.com