JavaScriptを使用してURLをリダイレクトする方法

清浅
リリース: 2019-01-16 15:23:05
オリジナル
4697 人が閲覧しました

window.location オブジェクトは、JavaScript 操作を使用して URL を新しい場所にリダイレクトできます。通常はサーバー構成と http ヘッダー プロパティを使用します。

JavaScriptを使用してURLをリダイレクトする方法

Web ページ内の多くの URL は、通常はサーバー構成と HTTP ヘッダーのプロパティを使用して、新しい場所にリダイレクトされます。ただし、多くの場合、JavaScript を使用して別の URL にリダイレクトまたは移動する必要がある場合があります。新しいページまたは URL にリダイレクトされる理由は次のとおりです。

ドメインまたは URL 構造を変更した

ユーザーはフォームを送信しましたが、シーケンスの次のページに誘導したいと考えています

このページには認証が必要な可能性があります

HTTP から HTTPS にリダイレクトします

シングルページアプリケーションなどで新しいページをトリガーするために必要です。

window.location はオブジェクト管理です。ブラウザによって読み込まれるアドレスです。位置オブジェクトの操作は、JavaScript を使用してページのリダイレクトを管理する方法です。 location オブジェクトには、JavaScript ページ リダイレクトをトリガーするプロパティとメソッドがあります。

Location オブジェクトのプロパティ:

ハッシュ: シングルページ アプリケーションおよびシングルページ Web サイトに使用されます

host: URL のドメイン名

hostname: host

href: 完全な URL

origin: URL のプロトコルとドメイン

パス名: 元の投稿 URL スラッグまたはページ

ポート: URL にポートが含まれる場合

プロトコル: http、https、ftp、ftps など。

それぞれこれらのプロパティのうちの 1 つは文字列であり、すべての標準文字列メソッドをサポートします。

#場所オブジェクトのメソッドは次のとおりです:

#assign: 場所オブジェクトを新しい URL に設定します

reload: 同じ URL でページを強制的にリロードします

置換: リダイレクトをトリガーします

search: queryString を許可します

新しいアドレスにリダイレクトします

アドレスを変更した後は、301 リダイレクトを実行する必要があります。ここでサーバーは、新しいアドレスを含む HTTP ステータス コード 301 を送信します。

301 ステータス コードは、ユーザー エージェント、つまりブラウザまたは検索エンジン スパイダーに、新しいアドレスがあることを伝えます

301 リダイレクトが許可しますトラフィックの流れを維持し、検索エンジンのランキングを維持したいと考えています。

通常、これはサーバーから実行します。ただし、それが不可能な場合もあり、JavaScript を使用して URL にリダイレクトする必要がある場合は、HTTP から HTTPS にリダイレクトする必要がある場合を含め、すべて便利です。ただし、JavaScript を使用して HTTP から HTTPS にリダイレクトするよりクリーンな方法は、次のコード スニペットです。

window.location.assign("new target URL");
window.location.replace("new target URL");
ログイン後にコピー

window.location オブジェクトのプロパティとメソッドは、JavaScript を使用して操作して、別の URL にリダイレクトできます。その中でも、location.replace と location.assign は非常に便利です。 replace メソッドを使用すると、セッション履歴をクリーンに保つことができ、assign メソッドを使用すると、ユーザーは URL 履歴を遡ることができます。

以上がJavaScriptを使用してURLをリダイレクトする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート