Gla*_*xer 20 json manifest azure vue.js azure-web-app-service
这是托管网址：https : //serviceworkerspike.azurewebsites.net/
我正在使用 Vuejs 创建一个 PWA 作为学校项目，每当我使用 Azure 托管网站时，都会发生这种情况，我在 localhost 上没有问题...... Chrome devtools 响应如下：
/manifest.json:1 Failed to load resource: the server responded with a status of 404 ()
/manifest.json:1 Manifest: Line: 1, column: 1, Syntax error.
manifest.json:1 GET https://serviceworkerspike.azurewebsites.net/manifest.json 404
manifest.json:1 Manifest: Line: 1, column: 1, Syntax error.
我在 index.html 中添加了这个：
<link rel="manifest" href="/manifest.json">
这是我的 manifest.json 文件：
{
"name": "MessageBoardUCN",
"short_name": "MessageBoardUCN",
"theme_color": "#ff095a",
"background_color": "#feaaee",
"display": "standalone",
"start_url": "/index.html",
"icons": [
{
"src": "images/icons/icon-72x72.png",
"sizes": "72x72",
"type": "image/png"
},
{
"src": "images/icons/icon-96x96.png",
"sizes": "96x96",
"type": "image/png"
},
{
"src": "images/icons/icon-128x128.png",
"sizes": "128x128",
"type": "image/png"
},
{
"src": "images/icons/icon-144x144.png",
"sizes": "144x144",
"type": "image/png"
},
{
"src": "images/icons/icon-152x152.png",
"sizes": "152x152",
"type": "image/png"
},
{
"src": "images/icons/icon-192x192.png",
"sizes": "192x192",
"type": "image/png"
},
{
"src": "images/icons/icon-384x384.png",
"sizes": "384x384",
"type": "image/png"
},
{
"src": "images/icons/icon-512x512.png",
"sizes": "512x512",
"type": "image/png"
}
],
"splash_pages": null
}
我试图做这样的名称和短名称属性：“messageboarducn”
我还尝试将 starturl 编辑为托管 url：“ https://serviceworkerspike.azurewebsites.net/ ”和“/”
我也尝试在根目录和 /src 目录中移动 manifest.json 文件，但其他指南告诉我它应该与 index.html 位于同一文件夹中，并且 /public 是默认的
通常你没有带有 Vuejs 的 web.config 文件，但我什至尝试添加一个如下所示的文件：
<?xml version="1.0" encoding="utf-8" ?>
<configuration>
<system.webServer>
<staticContent>
<remove fileExtension=".json" />
<mimeMap fileExtension=".json" mimeType="application/json" />
<mimeMap fileExtension=".webmanifest" mimeType="application/manifest+json" />
</staticContent>
</system.webServer>
</configuration>
我该如何纠正错误？
Fra*_*sco 21
如果您的清单文件位于根级别（您的 index.html 所在的位置），您可以在<head>index.html 文件的标签中像下面这样引用它：
<link rel="manifest" crossorigin="use-credentials" href="manifest.json"/>
加上清单文件中的 startUrl 应该是：
"start_url": "/"
当您将根作为起点时。
否则，如果您要使用特定的基本 url 为您的应用程序提供服务，则应将其反映在 startUrl 属性中：
Example:
--> www.myapp.com/my-other-url-part/
Use:
"start_url": "/my-other-url-part/"
Or simply:
"start_url": "./" <-- This would match any base-href != "/"
然后，您应该将您的 Web 服务器设置为自动提供 index.html 文件（这通常默认启用）
Neo*_*ear 11
我遇到了完全相同的问题（在 Azure Windows Web 服务上）。我刚刚在根文件夹中创建了一个新的 web.config，内容如下（或编辑现有的，如果有的话）：
<?xml version="1.0" encoding="UTF-8"?>
<configuration>
<system.webServer>
<staticContent>
<mimeMap fileExtension=".json" mimeType="application/json" />
</staticContent>
<modules runAllManagedModulesForAllRequests="true"/>
</system.webServer>
</configuration>
这为 json 文件添加了 mime 配置。
小智 8
对我来说，修复非常简单，只是在 index.html 中组织代码的问题，下面的链接标签必须在从 favicon 生成器复制的少数标签之上，就在元标签的下方
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />
小智 6
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" />从index.html头文件中删除此行或在公共目录中创建manifest.json文件
| 归档时间： |
|
| 查看次数： |
50247 次 |
| 最近记录： |