JavaScriptでアクセスしている現在のページのURLやBaseURLを取得する方法

location_BaseURL

SHARE

こんにちはフロントエンドエンジニアのまさにょんです！

今回は、JavaScriptでアクセスしている現在のページのURLやBaseURLを取得する方法について解説していきます。

JavaScriptでアクセスしている現在のページのURLやBaseURLを取得する方法

JavaScriptでアクセスしている現在のページのURLやBaseURLを取得する方法を見ていきます。

今回のSampleCodeは、当ブログのプライバシーポリシーページにて実行してみてください。

アクセスしている現在のページのURLを取得する方法

アクセスしている現在のページのURLを取得するには、window.location.href を使用します。

// アクセスしているURLを取得する
const accessURL = window.location.href;
console.log('accessURL', accessURL);
// accessURL https://masanyon.com/privacy-policy/

アクセスしているページのBaseURLを取得する方法

アクセスしているページのBaseURLを取得するには、いくつか方法があります。

今回は、そのうちの2つを解説します。

まず1つ目は、window.location.origin を使用したBaseURLの取得です。

const baseUrl = window.location.origin;
console.log('baseUrl', baseUrl);
// baseUrl https://masanyon.com

2つ目に紹介するのは、locationオブジェクトの protocol、hostname、portプロパティを組み合わせによる BaseURLの取得です。

const baseUrl2 =
    window.location.protocol +
    '//' +
    window.location.hostname +
    (window.location.port ? `:${window.location.port}` : '');

console.log('baseUrl2', baseUrl2);
// baseUrl2 https://masanyon.com

JavaScript書籍 Ver. 中級-上級者向け

JavaScript書籍 Ver. 初級者向け

Twitterやってます！Follow Me！

神聖グンマー帝国の逆襲🔥

神聖グンマー帝国の科学は、世界一ぃぃぃぃぃぃ！！！！！

最近の投稿

【SQL】1回のINSERTで、複数行のレコードを一括挿入・一括追加する方法 JS_uuid JavaScriptでランダムなuuidを作成する方法(randomUUIDの使い方) py_csv_to_json PythonでCSVをJSONに変換する方法 py_csv_cut PythonでCSV・Dataframeを指定の行数まで切り取る方法 js_for_of JavaScript(TypeScirpt)のfor-of文でindexの値も取得する方法と、Type IterableIteratorエラーの解決方法 Python_VSCode VSCode上のPython import文の「インポート “XXXXX” をソースから解決できませんでした」エラーの解決方法

前の記事

Reactの状態管理ツールであるRecoilのstateとHo…

次の記事

JavaScriptの正規表現内で変数を使用する方法
JavaScript_RegExp