Redis を別の角度から使用して、セッションへのクロスドメイン アクセスの問題を解決する

シリーズ記事ディレクトリ

Redis キャッシュの侵入、故障、雪崩の問題と解決策
Spring Cache の使用 – クイック スタート
ページング クエリ – Java プロジェクト 実際の戦闘グローバル
例外処理 – Java 実際の戦闘プロジェクト
このシリーズの記事は継続的に更新されています。その他の記事については、「チェックアウト」をクリックしてください。ホームページ!



序文

vue3+SpringBoot でプロジェクトを実行する場合、vue フロントエンド プロジェクトはポート 8080 で実行され、バックエンド プロジェクトはポート 8081 で実行されるため、フロントエンドはクロスドメイン シナリオを通じて axios リクエストをバックエンドに送信します。プロジェクト ログイン関数をフィルターとして使用すると、セッションを直接使用して、ユーザーのログイン情報をセッションに保存できます。フィルターは、パスをインターセプトするときにセッションを確認してセッションを取得するだけで済みます。取得が成功した場合は、それを意味しますユーザーが正常にログインしたことを示します。セッションが保存できない状況は発生しません。
今回はフロントエンドとバックエンドの分離という問題が発生しましたので、以下でこの問題を解決していきます。


1. 遭遇した状況

ログインコントローラーのログインメソッドで、ログイン成功後のセッションに値を保存します。

request.getSession().setAttribute("administrator",admin.getId());

しかし、ページ上で f12 を開き、アプリケーションをクリックすると、セッション情報が保存されていないことがわかります。

セッションには値が保存されていません
これはクロスドメインが原因で発生する問題で、バックエンド サーバーがポート 8081 上にあるため、フロントエンド ポート 8080 のセッションにセッションを保存できません。

2、問題を解決する

問題はわかったので、この問題を見つけたとき (バックエンド コードをデバッグして追跡したため、セッションを保存するアクションが実際に実行されたことがわかり、問題の原因がクロスドメインであることがわかりました) 。最初からインターネットで資料を探して解決策を探しました。検索された問題のほとんどは、分散状況での共有セッションの問題です。私が現在抱えている問題にはまったく当てはまりません。

しばらく情報を確認した後、Redis のことを思い出しました。セッションの保存と取得のプロセス、その後セッションを使用して値にアクセスできるのであれば、Redis を使用しないのはなぜでしょうか。Redis を学習してからは、Redis がセッションの代わりに使用できるとは思いませんでした (笑)。そこで、Redis を使用して問題を解決するためのステップ コードを共有します。Redis を学習したことがある人には理解しやすいと思います。

2.1 ymlファイルの設定

Redisの基本情報をymlファイルに設定します。
ここに画像の説明を挿入

2.2 Redisの起動

Redisサーバーをオンにする
ここに画像の説明を挿入

3.3 コードの記述

ステップ 1: RedisTemplate を挿入する

@Autowired
private RedisTemplate redisTemplate;

ステップ 2: 成功したログイン値を Redis に保存する

//6.登录成功,将员工id存入Redis并返回登录成功结果
redisTemplate.opsForValue().set("administrator",admin.getId());

ステップ 3: フィルターがパスをインターセプトした後、Redis の値を取得します。もちろん、フィルタークラスにRedisTemplateを挿入することを忘れないでください

//4-1.判断登录状态,如果已登录,则直接放行
        if(redisTemplate.opsForValue().get("administrator") != null){
    
    
            /**
             * 设置将id存起来
             * */
            Long adminId = (Long) redisTemplate.opsForValue().get("administrator");
            BaseContext.setCurrentId(adminId);
            //放行
            filterChain.doFilter(request,response);
            return;
        }

3. 効果実証

まず、Redis デスクトップ管理を開いて値を表示します。ログインしていない場合は値はありません。以下の図に示すように、
ここに画像の説明を挿入
プロジェクトを開始した後、ログインして Redis に値があるかどうかを確認します。
ログインが成功すると、インターセプターが有効になっているときにデータベース データをクエリするための axios リクエストが送信されます。それで証明されました。
ここに画像の説明を挿入

ただし、以下に示すように、引き続き Redis に保存されている値を確認します。

ここに画像の説明を挿入
ご覧のとおり、この機能が実装されています。セッションによって果たされる役割の代わりに Redis を使用します。したがって、インターセプターはユーザーがログインしていることを自然に認識しているため、メソッドはデータベースにクエリを実行し、ページにデータを表示できます。


要約する

ここで Redis を使用すると、セッション アクセスのクロスドメイン問題が解決されますが、これはセッションのクロスドメイン問題の解決とは呼ばれず、考え方を変えることで同じ問題を解決しただけです。セッションでもこの問題は解決できると思いますが、フロントエンド コードを設定する必要があるはずです。私もよくわかりませんが、学んだ知識を使って問題を解決したほうが良いのではないでしょうか!Redisも非常に使いやすく、現状の問題を解決してくれるので、とても良い方法だと思います。

より良い方法がある場合は、コメント エリアでコミュニケーションをとり、互いに学ぶこともできます。

おすすめ

転載: blog.csdn.net/weixin_52258054/article/details/130083775