云南区块链商户平台：抓包技术自制开票工具(二)

前言

上节我们分析了云南区块链商户平台的登录接口以及数据加密、解密，本节我们将构建一个项目框架，将大致的雏形制作出来

说明

由于我们使用开票软件都是在云南区块链商户平台上操作，如果再开发电脑端就显得没必要，思考良久，最后打算开发移动端

本节成品图

在这里插入图片描述

接口列表

名	api
获取验证码	https://yunnan-cloud-backend.wetax.com.cn/v3/user/picture-code?token=
获取微信扫码	https://yunnan-cloud-backend.wetax.com.cn/v3/user/qr-code?token=
登录

登录流程图

在这里插入图片描述

获取验证码

由于接口返回的是base64的代码，且不带头，所以需要处理以下再进行渲染

<image :src="base64Image" mode="widthFix"  style="width: 150rpx;"></image>

yzm(){
			let that=this;
			uni.request({
			url: 'http://service.****.***/api/getcode.php',
			data: {
			id:'',
			},
			method: 'POST',
			header: {
			'content-type': 'application/x-www-form-urlencoded' //自定义请求头信息
			},
			success: (res) => {
			console.log(res)
			if (res.data.code==0) {
			console.log(res.data.data['unique_code'])
			console.log(res.data.data['picture'])
			that.base64Image='data:image/jpeg;base64,'+res.data.data['picture']
			} else{
			uni.showToast({
			title:res.data.message,
			icon:'error'
			})
			}
			}
			})
			}

为了防止跨域的问题，需要将抓包的接口封装成本地访问，例如我的文件getcode.php，访问后可解析接口数据

刷新前端页面可以实时显示验证码数据
在这里插入图片描述

登录请求

解密

<?php
// 设置参数
$key_text = '1*****************D';
$iv_text = 'A**************412';
$plaintext = '9********7';
$encoding = 'utf-8';

// 使用PKCS7填充
$block_size = 16;
$pad_length = $block_size - (strlen($plaintext) % $block_size);
$plaintext .= str_repeat(chr($pad_length), $pad_length);

// 如果IV不足16字节，使用空字节填充至16字节
$iv_length = strlen($iv_text);
if ($iv_length < 16) {
    $iv_text = str_pad($iv_text, 16, "\0");
}

// 创建AES加密器
$ciphertext = openssl_encrypt($plaintext, 'aes-128-cbc', $key_text, OPENSSL_RAW_DATA | OPENSSL_ZERO_PADDING, $iv_text);

// 将加密结果进行Base64编码
$encrypted_base64 = base64_encode($ciphertext);

echo "加密后的Base64编码结果：".$encrypted_base64."\n";
?>

运算模式：CBC
填充模式：PKCS7
密钥长度：128bit
key(text):1D
iv(text): A********2
需要加密：92*******27
字符编码：utf-8
输出base64编码

登陆后能够返回token及店铺信息
在这里插入图片描述

token处理

如果每次都要重新登陆，有点鸡肋，可以储存再本地，页面生命周期加载的同时检测是否过期

本地缓存

登陆成功后将token存储再本地，页面启动周期添加check_token()检查

that.token=res.data.data['token']
uni.setStorageSync('token',token)

onLoad() {
			this.yzm()
			this.check_token()
			
		},

失效检查

接口	说明
https://yunnan-cloud-backend.wetax.com.cn/v3/user/user-info?token=6idt*********Ush	通过token检查当前账号是否token过期

在这里插入图片描述

通过php进行模拟，失效返回结果

在这里插入图片描述

token状态码	说明
401	失效
0	正常

check_token(tokens){
				
			let that=this;
			uni.request({
			url: 'http://*******/is_token.php',
			data: {
			token:tokens
			},
			method: 'POST',
			header: {
			'content-type': 'application/x-www-form-urlencoded' //自定义请求头信息
			},
			success: (res) => {
			console.log(res.data)
			if (res.data.code==401) {
			uni.showToast({
				title:'登陆失效',
				icon:'error'
			})
			uni.removeStorageSync('token')
			}
			 else if (res.data.code==0) {
			 uni.showToast({
			 	title:'登陆成功',
			 	icon:'success'
			 })
			 console.log(res.data.data['user'])
			 that.userinfo=res.data.data['user']
			 that.status='1'
			 }
			 else{
			uni.showToast({
			title:res.data.message,
			icon:'error'
			})
			}
			}
			})	
			},