wlnapp

一个具有加密功能的前端Web应用程序框架，包含SM2/SM3/SM4国密算法。

安装

npm install wlnapp

发布

npm publish --registry https://registry.npmjs.org

使用方法

基本用法

import createWln from 'wlnapp';

const wln = createWln({
  api: 'https://your-api-endpoint.com',
  pk: 'your-public-key'
});

// 使用wln实例
wln.fetch('/your/api/path'，{key1: data2, key2: data2}).then((res) => {
  console.log(res);
}).catch((res) => {
  wln.toast(res)
});

高级用法

import createWln, { sm2, sm3, sm4 } from 'wlnapp';

const wln = createWln({
  api: 'https://your-api-endpoint.com',
  pk: 'your-public-key',
  debug: true
}, {
  // 自定义回调实现
  toast: (msg, type) => { 
    console.log(`提示: ${msg}`); 
  },
  alert: (msg, fnOk) => { 
    console.log(`警告: ${msg}`);
    fnOk && fnOk();
  }
});

// 直接使用加密函数
const encrypted = sm2.doEncrypt('data', 'public-key', 1);
const hash = sm3.encryptStr('data');
const encryptedSM4 = sm4.encrypt('key', 'data');

使用工具函数

wlnapp 提供了一系列实用的工具函数，可以通过导入 utility 模块来使用：

// 导入工具函数（这会将工具函数添加到原生对象的原型上）
import 'wlnapp/utility';

// 现在可以使用扩展的字符串和日期方法
const hexString = '48656c6c6f20576f726c64';
const base64String = hexString.HexToBase64(); // 将十六进制字符串转换为Base64

const dateUnix = 1760025044; // Unix时间戳
const dateString = dateUnix.showTime('yyyy-MM-dd HH:mm:ss'); // 格式化Unix时间戳为日期字符串
const dateString = new Date().format('yyyy-MM-dd HH:mm:ss'); // 格式化日期

const randomStr = ''.randomString(10); // 生成指定长度的随机字符串

// 使用字符串方法
const trimmed = '  hello world  '.trim(); // 去除首尾空格
const startsWith = 'hello world'.startWith('hello'); // 检查字符串是否以指定内容开头
const endsWith = 'hello world'.endWith('world'); // 检查字符串是否以指定内容结尾

使用类型定义

wlnapp 提供了常用的类型定义，可以通过以下方式导入：

// 通过主模块导入类型
import { Result, Query, Pager } from 'wlnapp';

// 或者直接从model模块导入
import { Result, Query, Pager } from 'wlnapp/model';

// 使用类型定义
const query: Query = {
  key: '',
  page: 1,
  size: 10
};

const pager: Pager = {
  rows: [],
  total: 0,
  message: '',
  loadMsg: '数据加载中，请稍候~',
  errMsg: '加载失败，请稍后再试！'
};

interface User {
  id: number;
  name: string;
}

const result: Result<User> = {
  Success: true,
  Message: '操作成功',
  Code: 200,
  Data: {
    id: 1,
    name: '张三'
  }
};

使用CSS样式

本框架提供了一套基于Element UI的样式文件，可以直接在项目中使用：

// 在JavaScript中导入CSS
import 'wlnapp/element-ui.css';

或者在HTML中直接链接：

<link rel="stylesheet" href="node_modules/wlnapp/wlnapp/wui-ctrl/element-ui.css">

功能特性

• SM2/SM3/SM4国密算法
• 支持加密传输的API请求处理
• 跨平台兼容性 (UniApp, Web等)
• 支持开发时使用Mock数据
• TypeScript支持

导出模块

该包导出以下模块:

• default: 主要的 createWln 函数
• utility: 工具函数
• sm2, sm3, sm4: 单独的加密模块
• types: TypeScript类型定义
• model: 数据模型类型定义
• element-ui.css: Element UI样式文件

开发指南

项目结构

.
├── dist/               # 构建输出目录
├── wlnapp/             # 核心源码
├── index.js            # 包入口文件
├── package.json        # 包配置文件
└── README.md           # 项目说明文档

构建

项目使用 Rollup 进行构建，生成以下格式的文件：

• CommonJS (cjs)
• ES Module (esm)
• UMD (umd)

许可证

MIT

本项目使用了以下第三方库：

jsbn

• 作者: Tom Wu
• 许可证: MIT风格许可证
• 用途: 提供大整数运算支持，用于SM2加密算法
• 项目地址: https://github.com/andyperlitch/jsbn