[解決済み] マニフェスト 行: 1, 列: 1, 構文エラー

質問

これは、ホストされたURLです。 https://serviceworkerspike.azurewebsites.net/

私はVuejsを使用して、学校のプロジェクトとしてPWAを作成しています。Azureでウェブサイトをホストすると必ずこの問題が発生します。 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
}

• nameとshortnameのプロパティを次のようにしようとしました: "messageboarducn"

• また、starturlをホストされたurlに編集してみました： " https://serviceworkerspike.azurewebsites.net/ と "/"。

• また、manifest.jsonファイルをルートディレクトリと/srcディレクトリに移動してみましたが、他のガイドでは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>

どうすれば間違いを正すことができますか？

どのように解決するのですか？

私は全く同じ問題を抱えていました（Azure Windows Web Service上）。私はちょうど次の内容でルートフォルダに新しい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-filesのMIME設定を追加します。