@TOC

一、外部应用

外部应用就是通过门户的方式链接到外部的应用的形式；没有直接写在门户中，而是通过跳转链接的方式访问；

流程：

1.添加wlogin和blank跳转文件

wlogin是用来通过门户跳转外部链接用的，如果登录token失效会重定向到门户登录页面

//wlogin.vue代码
<template>
  <div></div>
</template>

<script setup>
function forward() {
  location.href = '地址/sso/oauth/authorize?client_id=37837847384784&response_type=code&redirect_uri=地址/bbtj/blank&scope=all'
}
forward()
</script>

//blank代码
<template>
  <div></div>
</template>

<script setup>
import {getTokenByCode} from "@/api/login";
import {getHtmlArg} from "@/utils/index";
import { setToken} from '@/utils/auth';
const router = useRouter();

function getTK() {
  let param = {"code":getHtmlArg('code'),"systemName":"bbtj"}
  getTokenByCode(param).then(res => {
    setToken(res.data.access_token);
  	//跳转到当前应用的首页
    router.push({path: '/home'})
  })
}

getTK();
</script>

//getHtmlArg方法

// 获取地址栏参数
export function getHtmlArg(name) {
  var match = window.location.href.match(new RegExp(name + '=([^&#]*)'));
  return match ? decodeURIComponent(match[1]) : defaultValue;
}

2.ruoter中添加对应的路由，wlogin和blank

添加对应的路由，跳转到对应的页面

3.permission.js中添加wlogin和blank到白名单中

添加白名单，并修改重定向到wlogin登录页面；wlogin是门户登录页面。

4.添加对应的前缀

这个是跟后端约定的字段，后端根据这个字段去跳转不同的子系统

• router/index.js
• vite.config.js
• 

5.修改打包接口前缀

这个前缀也是需要添加到生产环境的地址中的，应该是用来代理用的(不是很确定)

• .env.production

二、内部应用

内部应用就是通过把这个应用放在这个应用的内部，不是通过注册应用的方式实现登录，所以这个不涉及登录；我的理解就是组件直接写在门户中，不用通过链接跳转，可以直接通过获取token访问。

流程

1.添加blank实现跳转登录

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

<script setup>
//检验token是否为授权的token
import {checkToken} from '@/api/login'
import { getToken, setToken, removeToken } from '@/utils/auth'
const router = useRouter();
const store = useStore();
function getTK() {
  const redirect = ref(undefined);
  let token = getHtmlArg('token');
  checkToken(token).then(res => {
    console.log(JSON.stringify(res));
    if(res.code === 200){
    //因为通过门户直接跳转的话不会走登录接口，所以在这里需要调用下面几个方法
    //1.首先需要保存一下当前的token；2.然后获取当前登录信心;3.获取当前路由信息；
      setToken(token)
      store.dispatch('GetInfo').then(() => {
        store.dispatch("GenerateRoutes").then((accessRoutes) => {
          let defultPath = accessRoutes[0].path + "/" + accessRoutes[0].children[0].path;
          router.push({path: redirect.value || defultPath});
        });
      })
    }else{
      router.push({path:'/login'})
    }

  })
}

getTK();
</script>

2.添加router，添加路由

只有添加路由之后，才能实现路由跳转，实现对应页面的逻辑。

3.perssion.js中把blank加入白名单中

白名单是为了可以直接跳转到对应的页面，没有限制。

4.添加前缀

这个是跟后端约定的字段，后端根据这个字段去跳转不同的子系统

• vite.config.js

• router/index.js

5.添加打包文件的前缀

这个前缀也是需要添加到生产环境的地址中的，应该是用来代理用的(不是很确定)

• env.production