vueプロジェクトはシングルポイント登録を実現します。

vueプロジェクトはodc-clientを使って単独で登録することを実現します。
redirect
まず、私たちはルートフックページで判断を追加する必要があります。tokenがなければ、サーバーにリダイレクトしてシングルポイント登録を行います。
odc.jsシングルポイント登録に必要な配置項目

export const identityServerBase = 'http://baidu.com';//         
export const vueBase = 'http://localhost:8080'

//      https://github.com/IdentityModel/oidc-client-js/wiki
export const openIdConnectSettings = {
    authority: `${identityServerBase}`,
    client_id: `vue-client`,
    redirect_uri: `${vueBase}/signin-oidc`,//          
    post_logout_redirect_uri: `${vueBase}`,
    silent_redirect_uri: `${vueBase}/redirect-silentrenew`,
    scope: 'openid profile api1',
    response_type: `id_token token`,
    automaticSilentRenew: true,
};

permission.js

import router from "./router";
import Oidc from "oidc-client";
import { openIdConnectSettings } from "./oidc";

router.beforeEach((to,from,next)=>{
   if(localStorage.getItem('token')){
      next()
   }else{
	  let mgr = new Oidc.UserManager(openIdConnectSettings);
	  mgr.signinRedirect(); //      
   }

})

これは私自身のプロジェクトです。これはrouterフックで権限を判断します。もしあなた達が使っていなくても大丈夫です。routerを無視して、直接elseの内容を実行します。tokenがないと、ページはサーバーにジャンプして登録します。
以下はログインが完了したらシステムに戻ります。
odic.vue

<template>
    <div></div>
</template>

<script>
import Oidc from "oidc-client";

export default {
    props: {},
    data() {
        return {};
    },

    components: {},

    methods: {},
    created() {
        new Oidc.UserManager()
            .signinRedirectCallback()
            .then(() => {
                this.$router.push("/save-auth");
            })
            .catch(function(e) {});
    }
};
</script>

コールバックを実行したら、save-authページにジャンプします。
save-auth.vue

<script>
import Oidc from "oidc-client";
import { openIdConnectSettings } from "./oidc";
export default {
  name: 'SaveAuth',
  created() {
    this.mgr =  new Oidc.UserManager(openIdConnectSettings);
    this.mgr.getUser().then((user) => {
      localStorage.setItem('userInfo',JSON.stringify(user))
      this.$router.push('/')
    })
  },
  render: function(h) {
    return h() // avoid warning message
  }
}
</script>

私たちが必要とするユーザー情報を保存してからトップページに移動して全体の流れが終わります。
本文の住所：vueプロジェクトは単独で登録することを実現します。