【JavaScript】パラメーターを保持したままリダイレクトする

JavaScript(ジャバスクリプト)

2023.11.27

特定のパラメーターを保持したままリダイレクトするために、JavaScriptを使用する方法は以下の通りです。

このコードは、ブラウザの現在のURLからパラメーターを取得し、指定のパラメーターが存在する場合、新しいURLを構築し、そのパラメーターを保持したままリダイレクトします。

現在のURLからパラメーターを取得
URLSearchParamsとは？
具体的な例
まとめ

現在のURLからパラメーターを取得

// 現在のURLからパラメーターを取得
const urlParams = new URLSearchParams(window.location.search);
const yourParameter = urlParams.get('your_parameter');

if (yourParameter !== null) {
  // パラメーターが存在する場合、新しいURLを構築してリダイレクト
  const newURL = `/new_page?your_parameter=${yourParameter}`;
  window.location.href = newURL;
}

JavaScriptを使用して、この操作をブラウザ上で実行できます。

URLSearchParamsとは？

URLSearchParams は、WebのJavaScript環境で使用されるオブジェクトであり、URLのクエリパラメータを扱うためのものです。クエリパラメータは、URLの末尾に追加されるキーと値のペアで構成され、通常は ? の後に続きます。

[rml_read_more]

https://example.com/search?q=javascript&page=1

具体的な例

指定したパラメーター（ここでは”id”）を保持しながら、JavaScriptを使用してリダイレクトする具体的な例を示します。

例として、以下のような現在のURLがあるとします。

http://example.com/page?your_parameter=123&id=456

このURLから”id”パラメーターを取得し、新しいURLにそのパラメーターを保持したままリダイレクトします。

// 現在のURLからパラメーターを取得
const urlParams = new URLSearchParams(window.location.search);
const idParameter = urlParams.get('id');

if (idParameter !== null) {
  // パラメーターが存在する場合、新しいURLを構築してリダイレクト
  const newURL = `/new_page?id=${idParameter}`;
  window.location.href = newURL;
}

このコードは、現在のURLから”id”パラメーターを取得し、それを新しいURLに含めてリダイレクトします。上記の例では、新しいURLは次のようになります。