XMLHttpRequest：sendしたときにエラー発生

はじめに

これは完全忘備録です。
予めご了承ください

したかったことと発生したエラー

新規投稿ページでタグをつける際に、インクリメンタルサーチ機能を実装した。
他の編集ページでタグを更新する際も同様のJSファイルを読み込ませて、インクリメンタルリサーチ機能を実装しようとすると以下のようなエラーが発生

ptag.js:16 GET http://localhost:3000/practices/3/ptaglist/?keyword=%E3%81%A0 404 (Not Found)

原因

こういうときは、まずは深呼吸。エラー文をしっかり読んで課題を最小単位までに分解してと、、、

404のエラーといことは、 リソースが見つからなかった場合ってことが多い、、、、
新規投稿ページのときとの差異はなんだろうか、、、
調べていくとsendされる先が違う！！！

そう！
答えは、パスが間違っている！！！

解決策

正確にいうと、今回の場合は相対パスで書いていたのでエラーが発生した。
よって絶対パスに変更してあげればOK！！

変更前.js

 const XHR = new XMLHttpRequest();
      XHR.open("GET", `ptaglist/?keyword=${keyword}`, true);
      XHR.responseType = "json";
      XHR.send();

変更後.js

 const XHR = new XMLHttpRequest();
      XHR.open("GET", `/twwets/ptaglist/?keyword=${keyword}`, true);
      XHR.responseType = "json";
      XHR.send();

終わりに

エラーは本当にありがたいものです。答えのヒントをくれますからね。
とにかくエラーがでたら、課題を最小単位に分離して考えていけば必ず答えは出ます！
頑張りましょう！！！