crossorigin="use-credentials"

crossorigin="use-credentials"

資格情報が必要なmanifest.jsonのレスポンスがCORSエラーになったときにまず疑う
表題の設定をlink要素に与え忘れている可能性大

このへんをよく読む daiiz
Content-Type: application/manifest+json
マニフェストのアクセスに資格情報が必要な場合、マニフェストファイルが現在のページと同じオリジンにあったとしても、 crossorigin 属性を use-credentials に設定する必要があります。
たしかにassetsも含めて全て認証必須にしていた

Before
GAEアプリにIdentity-Aware Proxyを導入したときにやらかした daiiz
html
Copied!
<link rel="manifest" href="/manifest.json">
server.js
Copied!
const sendManifest = (req, res) => {
res.setHeader('Content-Type', 'application/json; charset=utf-8')
res.status(200).sendfile('./public/manifest.json')
}
... has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header os present on the requested resources.
いつもよく見るやつ

After
crossorigin="use-credentials" の記述が重要
html
Copied!
<link rel="manifest" href="/app.webmanifest" crossorigin="use-credentials">
server.js
Copied!
const sendManifest = (req, res) => {
res.setHeader('Content-Type', 'application/manifest+json; charset=utf-8')
res.status(200).sendfile('./public/manifest.json')
}
無事にマニフェストファイルが読み込まれてDesktop PWAインストールボタンが現れた
めでたしめでたし
Powered by Helpfeel