フルスクラッチのJavaScriptアプリケーションにて記事表題の通りエラーになりました。
ログイン認証は済んでいるはずなのに、このfetchメソッドから./xxxxx.phpからJSONデータを受け取るところでこけている。なんで？
Request failed. TypeError: Failed to execute ‘fetch’ on ‘Window’: Request cannot be constructed from a URL that includes credentials: ./xxxxx.php
原因
・「./xxxxx.php」の部分が相対パスになっているため。
また、ログイン認証とは別にBasic認証があって。
・URL形式でBasic認証を突破しているため。
※いわゆる「http://ユーザ名:パスワード@example.com」という形式で記述してBasic認証を突破している。
…上記の２つが条件で部分的に（アプリケーション全体のこの部分という意味）通信の失敗が起こっていた。
参考URL
Basic認証のあるページにユーザ名とパスワードを書いたURLでブラウザからアクセスしました。
[Web] URLにBasic認証のIDとパスワードを埋め込む
解決策としては、fetchする時はフルパスを指定する事。
Basic認証の突破をURLで行わない。
速い話が「横着しないこと」が大切だ。
JavaScriptのフレームワークでは自分のサイトURLはフルパスで取得ができる。
なんだかフルパスだと野暮ったいので相対パスでいいのでは？と思うこともあるがWebブラウザが独自に補完してこのようなバグが生じるので、
フルパスのほうがいいのではないだろうか？（というかフルパスで指定されていることに意味はあるのだ）と思った次第です。
コメント