一般的なクロスドメイン構成の概要

1. https byGoogleを無効にする手順

注:セキュリティ上の理由から、個々のブラウザは自動的にhttpリクエストプロトコルをhttpsプロトコル仕様に変換します。
解決策:Google ChromeでHTTPSを無効にする必要があります。
コマンド:chrome:// net-internals /#hsts
ここに画像の説明を挿入

2.サフィックスタイプのマッチング手順を開きます

2.1。ビジネスの説明

注:ユーザーがindex.htmlにアクセスすると、webappディレクトリにindex.htmlページが表示されます。将来さらに製品情報がある場合は、必然的に複数の製品用にxxxx.html /が準備されます。このような作業負荷も同様です。大規模な
最適化:ユーザーの要求をインターセプトし、指定されたテンプレートページに移動して、データの入力を実現します。
ここに画像の説明を挿入

2.2。構成クラスの編集

注:デフォルトでは、springMVCは/ indexなどのプレフィックスリクエストのみをインターセプトできます。/index.htmlにアクセスすると、特定のページにアクセスすることになります。したがって、springMVCにサフィックスリクエストをインターセプトさせる必要があります。製品リストのジャンプを実現するには。
ここに画像の説明を挿入

2.3。検索エンジンのしくみ

注:通常、検索エンジンは.htmlの末尾に静的ページのみを記録します。検索エンジンが記録した後、ユーザーが検索によって情報を見つけた場合、検索エンジンはWebサイトをユーザーにプッシュして、Webサイトの露出を増やします。

コアメカニズム:転置インデックス
ここに画像の説明を挿入

2.4。疑似静的記述

疑似静的は比較的現実的な静的です。通常、検索エンジンの使いやすさを向上させるために、記事コンテンツの静的ページを生成しますが、一部の友人はリアルタイムで情報を表示したいと考えています。または、動的スクリプトを使用していくつかの問題を解決したいとします。静的メソッドを使用してWebサイトのコンテンツを表示することはできません。しかし、これは検索エンジンの親しみやすさを失います。2つの中間の方法を見つける方法は?これは疑似静的技術を生み出します。疑似静的テクノロジーとは、表示がhtmlなどの静的ページの形式であることを意味しますが、実際にはASPなどの動的スクリプトによって処理されます。
概要:.htmlで終わる動的ページのテクノロジー

3.クロスドメインの実装

3.1.JSONPメソッド

3.1.1JSONPの説明

JSONP(JSON with Padding)は、JSONの「使用モード」であり、主流のブラウザーでのクロスドメインデータアクセスの問題を解決するために使用できます。同一生成元ポリシーにより、一般的に、server1.example.comにあるWebページはserver1.example.com以外のサーバーおよびHTMLページと通信できません。

3.1.2JSONPの原則の説明

手順:
1)javaScriptのsrc属性を使用して、リモートデータ取得を実現します。取得したデータはJSオブジェクトであり、ブラウザがJSの解析を担当します。

<script type="text/javascript" src="http://manage.jt.com/test.json"></script>
2).自定义回调函数.
	<script type="text/javascript">
	/*JS是解释执行的语言  */
	/*定义回调函数  */
	function hello(data){
     
     
		alert(data.name);
	}
	</script>
3).将返回值结果,经过特殊的格式封装.

3.1.3JSONPの最適化

1)関数名は過去に動的に渡される必要があります
。2)通常のajaxを使用してJSONP呼び出しを実装
できますか。3)コールバック関数を動的に生成できますか。

3.1.4JSONP実装エントリのケース

ここに画像の説明を挿入

3.1.5.JSONPControllerを編集する

説明:JT-MANAGEでJSONPControllerを定義しますここに画像の説明を挿入

3.1.5 JSONP Advanced API(2)

ここに画像の説明を挿入

3.2。クロスドメイン実装-CORSメソッド

3.2.1.CORSの概要

クロスオリジンリソースシェアリング(英語:クロスオリジンリソースシェアリング、略語:CORS)は、Webページの制限されたリソースに他のドメイン名のページからアクセスできるようにするために使用されるメカニズムです。(クロスドメインを実装)、CORSは応答ヘッダーで識別することによりクロスドメインURLを許可します。後で、同一生成元ポリシーはセキュリティ仕様に基づいてクロスドメインアクセス方法をリリースします。
注:ロゴを追加する必要があります。サーバーへのアクセスを許可します。

このメカニズムにより、ページはさまざまなソース(英語:クロスオリジン)からの画像、スタイル、スクリプト、iframe、およびビデオを自由に使用できます。一部のクロスドメインリクエスト(特にAjax)は、同一生成元ポリシー(英語:同一生成元ポリシー)によって禁止されていることがよくあります。クロスオリジンリソースシェアリングは、ブラウザとサーバーがクロスオリジンリクエスト(英語:クロスオリジンリクエスト)を使用するのに十分な安全性があるかどうかを相互に確認する方法を定義します。これは、純粋な同一生成元リクエストよりも無料で機能的ですが、純粋なクロスオリジンリクエストよりも安全です。
クロスドメインリソース共有はブラウザテクノロジの仕様であり、Webサービスが異なるドメインからサンドボックススクリプトを送信して、ブラウザの同一生成元ポリシーを回避する方法を提供します。

3.2.2CORS構成クラスの編集

@Configuration
public class CORSConfig implements WebMvcConfigurer {
    
    

    /**
     *   添加资源共享的策略
     *   参数说明:
     *      1.addMapping()  什么样的请求允许跨域
     *      2.allowedOrigins()  设定允许访问的网址
     *      3.allowCredentials() 是否允许携带cookie
     *
     */
    @Override
    public void addCorsMappings(CorsRegistry registry) {
    
    
        registry.addMapping("/**")
                .allowedOrigins("*")
                //如果设置true时,则必须设定允许访问的网址,不可以用*号标识.
                .allowCredentials(false);
                //.maxAge()       30分钟
                //.allowedMethods("*")  GET POST  HEAD
    }
}

3.2.3ページ効果へのアクセス

ここに画像の説明を挿入

おすすめ

転載: blog.csdn.net/weixin_40597409/article/details/111052438