Эх сурвалжийг харах

feat(login): 新增登录加密功能并重构模块导出方式
- 添加登录加密功能模块,包含加密工具和登录参数处理
- 重构模块导出方式,使用命名导出替代默认导出
- 新增crypto-js和dayjs依赖以支持加密功能
- 更新README文档说明新增功能和使用方法
- 调整项目结构,将功能模块统一组织到func目录

JiangWei 2 өдөр өмнө
parent
commit
86695bb21f

+ 1 - 0
README.md

@@ -5,6 +5,7 @@
 | mixins       | 混入                                                         |
 | components   | 在vue文件components注册组件                                  |
 | setupPlugins | 在main.js处使用  `setupPlugins(Vue, {   AntiDebugPlugin: {     enableAntiDebug: process.env.NODE_ENV !== "development",   }, });` |
+| loginEncrypt | 登录加密功能,用于加密登录信息 `import { loginEncrypt } from '@jfcloudvip/front-toolkit';` |
 
 mixins:
 

+ 3 - 1
package.json

@@ -14,6 +14,8 @@
     "access": "public"
   },
   "dependencies": {
-    "@jfcloudvip/vue-anti-debug-plugin": "latest"
+    "@jfcloudvip/vue-anti-debug-plugin": "latest",
+    "crypto-js": "^4.1.1",
+    "dayjs": "^1.10.7"
   }
 }

+ 1 - 1
src/components/index.js

@@ -1,7 +1,7 @@
 import BrowserTypePrompt from "./BrowserTypePrompt/index.vue";
 import ExpireModel from "./ExpireModel/index.vue";
 
-export default {
+export {
   BrowserTypePrompt,
   ExpireModel,
 };

+ 11 - 0
src/func/index.js

@@ -0,0 +1,11 @@
+/**
+ * 导出所有功能函数
+ */
+
+import { loginEncrypt } from "./loginEncryption/index.js";
+
+export { loginEncrypt };
+
+export default {
+  loginEncrypt,
+};

+ 75 - 0
src/func/loginEncryption/README.md

@@ -0,0 +1,75 @@
+
+**```loginEncrypt()``` 方法**
+
+| **参数**    | **类型**   | **说明**                                |
+| ----------- | ---------- | --------------------------------------- |
+| authName    | string     | 认证名称                                |
+| authPasswd  | string     | 认证密码                                |
+| userName    | string     | 用户名                                  |
+| userPasswd  | string     | 用户密码(将被加密)                    |
+| grantType   | string     | 授权类型                                |
+| code        | string     | 授权码                                  |
+| scope       | string     | 授权范围                                |
+
+**返回值**:
+
+```typescript
+// typescript
+{
+  urlParams: {
+    url: string,
+    username: string,
+    grant_type: string,
+    code: string,
+    scope: string,
+  },
+  bodyParams: {
+    password: string,
+    [key: string]: any
+  },
+  headerParams: {
+    'Content-Type': string,
+    Authorization: string,
+    [key: string]: any,
+  }
+}
+```
+
+**使用示例**:
+
+```javascript
+import { loginEncrypt } from '@jfcloudvip/front-toolkit';
+
+async function clickLogin() {
+  const { urlParams, bodyParams, headerParams } = await loginEncrypt({
+    // 新增的参数
+    url: '/auth/oauth2/token', // 登录接口地址
+    authName: 'jfcloud',
+    authPasswd: 'jfcloud',
+    sm2Public: '',
+    // 原登录流程需要的参数
+    userName: '',
+    userPasswd: '',
+    grantType: '',
+    code: '123',
+    scope: 'server',
+  });
+  const res = await loginApi(urlParams, bodyParams, headerParams);
+  // 这里进行原来登录流程的后续操作
+  // ....
+}
+
+// api.js (在业务中定义请求方法的文件)
+import { service } from '@/utils/request';
+
+// 登录接口示例, 如果是 ts,可以加上类型, 方便后续的使用, 这里不重复定义类型了
+export function loginApi({ url, ...params }: UrlParams, data: BodyParams, headerParams?: HeaderParams) {
+  return service({
+    method: 'post',
+    url,
+    params,
+    data,
+    headers: headerParams,
+  })
+}
+```

+ 33 - 0
src/func/loginEncryption/index.js

@@ -0,0 +1,33 @@
+import { encryptedData } from '../../utils/encryption.js';
+
+export async function loginEncrypt({
+  authName,
+  authPasswd,
+  userName,
+  userPasswd,
+  grantType,
+  code,
+  scope,
+  // sm2Public,
+}) {
+  // btoa 编码
+  const base64Credentials = btoa(`${authName}:${authPasswd}`);
+  // 加密用户密码
+  const encryptedPwd = userPasswd ? await encryptedData(userPasswd) : '';
+  return {
+    urlParams: {
+      url: '/auth/oauth2/token',
+      username: userName,
+      grant_type: grantType,
+      code,
+      scope,
+    },
+    bodyParams: {
+      password: encryptedPwd,
+    },
+    headerParams: {
+      'Content-Type': 'application/x-www-form-urlencoded;charset=UTF-8',
+      Authorization: `Basic ${base64Credentials}`,
+    },
+  };
+}

+ 19 - 9
src/index.js

@@ -6,22 +6,32 @@
  */
 
 // 引入全局混入逻辑
-import Mixins from "./mixins/index.js";
+import { checkToken } from "./mixins/index.js";
 
 // 引入插件安装逻辑(如 Vue.use(...) 的封装)
-import SetupPlugins from "./plugin/index.js";
+import setupPlugins from "./plugin/index.js";
 
 // 引入自定义组件集合
-import Components from "./components/index.js";
+import { BrowserTypePrompt, ExpireModel } from "./components/index.js";
+
+// 引入登录加密功能
+import { loginEncrypt } from "./func/loginEncryption/index.js";
 
 // 将混入和插件安装函数作为命名导出,便于按需使用
-export const mixins = Mixins;
-export const setupPlugins = SetupPlugins;
-export const components = Components;
+export {
+  loginEncrypt,
+  checkToken,
+  BrowserTypePrompt,
+  ExpireModel,
+  setupPlugins,
+};
 
 // 默认导出所有模块,可用于 Vue 应用的全局注册或配置
 export default {
-  mixins,
-  components,
+  mixins: { checkToken },
+  components: { BrowserTypePrompt, ExpireModel },
   setupPlugins,
-};
+  func: { loginEncrypt },
+};
+
+// import { loginEncrypt } from 'xxxxxtollkit

+ 1 - 3
src/mixins/index.js

@@ -1,5 +1,3 @@
 import checkToken from "./checkToken/index.js";
 
-export default {
-  checkToken,
-};
+export { checkToken };

+ 26 - 0
src/utils/encryption.js

@@ -0,0 +1,26 @@
+import Nopadding from 'crypto-js/pad-nopadding'; //这里使输出HEX格式
+import CFB from 'crypto-js/mode-cfb'; //CFB模式
+import { AES } from 'crypto-js';
+import Utf8 from 'crypto-js/enc-utf8';
+import Base64 from 'crypto-js/enc-base64';
+import Hex from 'crypto-js/enc-hex';
+
+const KEY = 'jfcloud6jfcloud6';
+const Key = Utf8.parse(KEY);
+
+/**
+ * @description RSA加密(支持长字符加密)
+ * @param data
+ * @returns {Promise<{param: PromiseLike<ArrayBuffer>}|*>}
+ */
+export async function encryptedData(data) {
+  // 加密
+  var ciphertext = AES.encrypt(data, Key, {
+    iv: Key,
+    mode: CFB,
+    padding: Nopadding,
+  });
+  let result = ciphertext.ciphertext.toString(); //这里返回的是HEX格式
+  const encodedPassword = Base64.stringify(Hex.parse(result));
+  return encodedPassword;
+}