Unified Login SDK
统一登录前端SDK,基于OAuth2协议实现前后端分离项目的认证和权限管理。
安装
npm install unified-login-sdk
快速开始
基础使用
import unifiedLoginSDK from 'unified-login-sdk';
// 初始化配置
unifiedLoginSDK.init({
clientId: 'your-client-id',
basepath: 'https://api.example.com',
homePage: '/dashboard',
idpLogoutUrl: 'https://idp.example.com/logout'
});
// 检查登录状态
if (!unifiedLoginSDK.isAuthenticated()) {
// 执行登录
await unifiedLoginSDK.login();
}
// 获取用户信息
const userInfo = unifiedLoginSDK.getUserInfo();
console.log('欢迎:', userInfo.nickName);
Vue 3 集成
// main.js
import { createApp } from 'vue';
import { createVuePlugin } from 'unified-login-sdk';
const app = createApp(App);
const loginPlugin = createVuePlugin('localStorage');
app.use(loginPlugin, {
config: {
clientId: 'your-client-id',
basepath: 'https://api.example.com',
homePage: '/dashboard',
idpLogoutUrl: 'https://idp.example.com/logout'
}
});
app.mount('#app');
权限检查
// 检查单个权限
const hasPermission = await unifiedLoginSDK.hasPermission('user:read');
// 检查多个权限
const hasAllPermissions = await unifiedLoginSDK.hasAllPermissions(['user:read', 'user:write']);
// 检查角色
const hasRole = await unifiedLoginSDK.hasRole('admin');
核心功能
- ✅ OAuth2认证流程
- ✅ Token自动管理
- ✅ 用户信息获取
- ✅ 权限和角色检查
- ✅ Vue 2/3插件支持
- ✅ 路由守卫集成
- ✅ 事件监听机制
API参考
主要方法
| 方法 | 说明 | 参数 | 返回值 |
|---|---|---|---|
init(config) |
初始化SDK | 配置对象 | void |
login() |
执行登录 | redirectUri(可选) | Promise |
logout() |
退出登录 | 无 | Promise |
isAuthenticated() |
检查认证状态 | 无 | boolean |
getUserInfo() |
获取用户信息 | 无 | UserInfo |
hasPermission(permission) |
检查权限 | 权限标识 | Promise |
hasRole(role) |
检查角色 | 角色标识 | Promise |
事件监听
// 登录事件
unifiedLoginSDK.on('login', () => {
console.log('用户已登录');
});
// 退出事件
unifiedLoginSDK.on('logout', () => {
console.log('用户已退出');
});
浏览器支持
- Chrome (推荐)
- Firefox
- Safari
- Edge
许可证
MIT