React + Express + ベーシック認証で、manifest.jsonに401エラーが出たので対処したメモ
Create React appsでReactアプリを作成、yarn build
コマンドでbuildしたアプリに、expressとbasic-authを使い、ベーシック認証をかける仕組みを作ろうと思ったら、
GET http://localhost:3000/manifest.json 401 (Unauthorized)
というエラーが出た。faviconや他の静的ファイルはBasic認証を通しているので、何故?と思って調べたら、manifestファイルはCORSの設定をしないと、ベーシック認証が突破できない模様。
public/index.html
のmanifest.jsonを読み込んでいる箇所を、以下のように書き換えることで回避ができた。crossorigin
という属性が有るのは知っていたけど、こういうところで使うのかぁ、という共有。Reactって書いたけどcrossorigin
にしか言及してなくってすんません。
<link rel="manifest" href="%PUBLIC_URL%/manifest.json" crossorigin="use-credentials"/>