‘壹’ uniapp微信支付,nestjs后台需要怎样配置
uniapp微信支付,nestjs后台配置,后端拿到微信正确的响应后,需要从其中取出一些字段,存在map中,然锋凳森后包装成查询参数字符串加上key,再md5后大写,将获得的字符串放在map中,作为sign的属性值,最后将map返粗州给前端银亩即可,这里需要注意的是,不论是发给微信的参数,还是发给前端让前端发给微信的参数的每一个字段名都需要跟微信要求的一致。
‘贰’ uniapp安卓生成签名证书
安装JRE环境 建议低版本 转自https://ask.dcloud.net.cn/article/35777
使用keytool -genkey命令生成证书:
keytool -genkey -alias testalias -keyalg RSA -keysize 2048 -validity 36500 -keystore test.keystore
testalias是证书别名,可修改为自己想设置的字符,建议使用英文字母和数字
test.keystore是证书文件名称,可修改为自己想设置的文件名称,也可以指定完整文件路径
36500是证书的有效期,表示100年有效期,单位天,建议时间设置长一点,避免证书过期
JKS 密钥库使用专用格式。建议使用 " keytool -importkeystore -srckeystore android_cac.keystore -destkeystore android_cac.keystore -deststoretype pkcs12 " 迁移到行业标准格式 PKCS12。
‘叁’ uniapp中unipush推送的使用
uniapp官方推送文档:UniPush使用指南 - DCloud问答
1 unipush其实就是dcloud帮你集成了个推的sdk到uniapp内部,本质是dcloud帮你做了二次封装,你不需要去个推官网集成App端的推送sdk(服务端需要去个推集成服务端的sdk,但有个大方向就是服务端一定要使用 透传模板 ),你也不需要去个推申请账号,而是直接用dcloud的账号就好了。
2 在线消息、离线消息、透传消息的区别
在线消息(推送):指App在前台或App刚退到后台但时间不长还没有被杀死进程的状态
离线消息(推送):指App根本就没有打开或App打开了又被杀死了,离线消息本质是手机厂商自己实现的手机系统级的长连接
透传消息:也叫应用内消息或自定义消息,本质是个推自己实现的长连接
1 华为手机必须用自有证书云打包才能实现离线推送
2 小米手机用云打包或自定义调试基座打包都能实现离线推送
3 oppo和vivo如果要实现离线推送,必须先上架oppo和vivo的官方应用商店才能实现离线推送
因为华为手机必须用自有证书才能实现离线推送的关系,其他小米手机,ov也就跟着统一使用自有证书来打包了
首先证书里存储的是一些用于表明开发者身份的信息,就是类似一个身份证的东西,为了证明你是你,对于App来说就是给App签名用的,一个证书可以签名多个App。
自有证书,字面意思,就是自己拥有的证书,对于uniapp来说,如果你的应用安全性不高或者根本用不到推送功能,那么你可以直接选择用dcloud的公共测试证书来打包。
只要你需要实现华为手机的离线消息推送,那么你就一定需要制作一个自有证书,只要制作一个,就可以一劳永逸。
如果你需要支持华为手机的离线推送,那么必须制作一个签名证书,一般情况下,你只要做推送功能的,不支持华为说不过去,所以别管那么多直接做一个证书就完事。
Android平台签名证书(.keystore)生成指南 - DCloud问答
https://ask.dcloud.net.cn/article/35777
使用Windows电脑制作自有证书的过程中,注意记录好你的证书别名,证书私钥密码,因为打包的时候需要填写。
根据上面制作证书的文档,你可以获取到形如下面样子的两个值
sha1是需要填写在dcloud开发者后台的,sha256是需要填写在华为开放平台后台
SHA1:
29:13:A2:70:8A:97:EE:72:12:8B:61:5A:68:B0:59:43:87:58:AC:42
SHA256:
16:EC:B2:F1:DC:14:BD:2B:4E:E2:4F:03:45:74:17:84:83:D4:B7:58:96:B5:CE:86:46:E9:37:45:07:DD:BC:A8
在华为后台配置sha256的时候,复制到输入框后一定要点击右侧的蓝色小对勾,不然保存不上。
小米的配置没啥可说的,直接创建应用就可以了,然后启用一下推送,注意所有包名要写一致,把appid等相关信息复制到dcloud后台,小米的配置就完事了。
下面是华为:
华为创建应用的时候包名也要统一。
数据存储位置选中国就可以,sha256这里就填你自有证书获取到的sha256
如果找不到sha256,可能你需要点到我的项目而不是我的应用。
然后登录dcloud开发者后台
注意这里的pkgName就是包名的意思,这里把华为小米的appid等信息分别填入保存。
这里的安卓应用签名就是你自有证书的sha1值,如果你的sha1值和下面那行写的一样,那么恭喜你写错了,iOS BundleId就是iOS的包名,建议安卓和iOS包名统一。
以上都配置完毕后,用透传消息来测试离线推送。
除了intent格式需要注意,其他都随便写字符串就可以。
intent:#Intent;action=android.intent.action.oppopush;launchFlags=0x14000000;component=你的包名/io.dcloud.PandoraEntry;S.UP-OL-SU=true;S.title=测试标题;S.content=测试内容;S.payload=test;end
把“你的包名”四个字改成你的包名,其他不要改。
然后你把打包好的App安装到手机上,不出意外的话,你就会收到推送了。
‘肆’ uni-app发布H5流程
首先在manifest.json文件中进行基础配置,昌神获取uni-app的ID号,填写应用名称,应用描纳伍述,版本名称以及版本号。
然后在H5配置模块,填写页面标题等基础信息。
点击发洞迅或行-》网站-PC Web 或手机H5-》填写网站标题,网站域名。
点击发布以后本地会生成一份打包文件,将打包文件上传至设置的网站,访问网站域名即可。
‘伍’ uni-app 利用Hbuilderx 的 rsa加密插件,实现加密
1.安装插件,通过HbuilderX 导入插件
https://ext.dcloud.net.cn/plugin?id=1389
2.项目文件夹下,会自动生成一个文件夹,js_sdk,把最毕旦里面的jsencrypt文件夹,拷贝到components下
3. 在需要参数加纤蠢密的vue页面,引入该组件,就可以正常使用了
import jsencrypt from '@/components/jsencrypt/jsencrypt.vue';
onLoad(options){
var publiukey='-----BEGIN PUBLIC KEY-----'毁数陪+'/L5i2osbl8C9+WJTeucF+S76xFxdU6jE0NQ+Z+zEdhUTooNRaY5nZiu5PgDB0ED/' +'-----END PUBLIC KEY-----';
var pubblicData=jsencrypt.setEncrypt(publiukey,"1234");
console.log('密文',pubblicData);
}
‘陆’ uniapp支付之微信支付
本文内容是指的uni-app项目的支付,文档中5+ APP的项目类型不涉及。
虽然uni-app已经为我们封装好了一个统一的API,所以在uni-app中我们只需要调用uni.requestPayment即可。但是uni-app官方文档的散乱看起来也挺头疼的。这里我精简整个流程,并对自己开困答森发时碰到问题做个总结。
需要注意的是,支付模块的开发不仅仅是需要客户端的开发,还需要服务端的开发。这里是在保证服务端的配置正确的前提下,对于前端uni-app的开发与配置指南。
这里有必要说明一下,申请微信支付流程对于初次申请者会感觉有些汪亩混乱,如果不理清相应关系可能会在各种平台找来找去。
对于APP,要在微信开放平台( https://open.weixin.qq.com )注册申请账号。注这里公司使用需300元认证费。在应用详情中申请开通微信支付功能。
当审核都通过了,就可以获取到应用ID(APPID,即类似于个人ID一样,唯一标识)
有了以上基础,申请微信商户平台( https://pay.weixin.qq.com ),注册申请账号。之后只需关联AppID,即可。
无需配置,只需保证微信小程序配置即可。
在manifest.json文件“App模块配置”项的“Payment(支付)”下,勾选“微信支付”项
调用 [uni.requestPayment(OBJECT)]发起支付,OBJECT参数中provider属性值固定为 wxpay 、
这里 的timeStamp, nonceStr, package, signType, paySign是由后端与微信交互生成的,值得注意的是package,微信直传过来的值是packageValue。
这里是orderInfo,该属性值为订单对象。依然值得注意的是package,微信直传过来的值是packageValue。
partnerid,微信传过来的是partnerId。
prepayid,微信传过来是prepayId。
noncestr,微信传过来的是nonceStr。
timestamp,微信传过来的是timeStamp。
这里一定一定要注意大小写,不然订单请求失败,让你找问题,找到痛不欲生。
至此,微信小程序已经可以正常支付了。而APP则需要打包才可以。uni-app有两种打包方式,一个是提交云端打包,一个是本地离线打包。这里说下离线打包的相关配置和问题。
关于离线打包我会单独出一篇,这里不在讲解。只进行微信支付相关配置讲解。
在uni-app官方举纳提供的App离线SDK中有一个打包工程,如果想使用微信支付,就需要添加相应的依赖库以及资源,这点我就很怀念cocopods,方便太多了。
注意:SDK 中的
1.在URL Types 中添加配置: identifier 填写 weixin ,URL Schemes 填写 wx[后面是您在微信平台申请的appkey] ,如果没有该项按照图中的格式创建。注意 wx 这两个字母必须添加。
‘柒’ uniapp rsa 加密,签名,aes加密使用
rsa 加密
如果需要兼容微信小程序参考文档:
https://blog.csdn.net/qq_38318589/article/details/115371454
rsa 签名jsrsasign
rsa 加密,签名使用创建rsa.js,在需要使用的地方导入即可。内容如下
aes加密
创建aestool.js ,内容如下
‘捌’ 如何破解uniapp写的应用
最近uniapp 开发移动app项目遇到一个棘手问题,我想实现 TCPScoket 通信。我们知道 uniapp 开发基本用的是一些前端框架(如:vue, mpvue等)和一些 uni 自身 api。要想 uniapp 使用 Android 原生代码有以下三种常用方法:
一: 使用 plus.android.importClass() 调用安卓的类进行原生代码编写,但是经测试效果很不理想,速度很慢!
二:开发原生 Android 插件,运行速度快,但需要指悉一定的安卓开发经验,难度较高。
三:购买其他开发者开发的原生插件,但是一般价格不铅乎低。
综上所述,我们必须学会自己开发原槐逗悉生插件!
二、前期准备
1、Android Studio 开发工具。 下载地址:https://developer.android.google.cn/studio/ 安装教程:https://blog.csdn.net/weixin_43883917/article/details/108942788
2、离线SDK下载(下载最新版)。 下载地址: https://nativesupport.dcloud.net.cn/AppDocs/download/android
3、保证 HbuilderX 也是最新版
4、签名证书。 生成方法:https://blog.csdn.net/weixin_58605808/article/details/117387435
三、创建一个 Uniapp 案例 (TCP-Plugin)
1、 开发者中心创建一个应用:https://dev.dcloud.net.cn/app/index?type=0
2、 点击应用名称进入应用,选择 离线打包Key管理 ,输入如下信息:
签名证书获取:
3、 点击保存会生成 appkey,后面要用到:4、 启动 HbuilderX,左下角登录自己的账户,新建一个和刚刚同名的项目的默认模板项目,查看 manifest.json AppID 是否云端 APPID 对应:
以上 uniapp demo 算是创建完成!
四、Android 原生插件开发
一、导入已下载好的离线SDK中的原生插件开发框架项目,UniPlugin-Hello-AS
二、切换成 project模式, 项目结构如下:
三、把我们刚才申请的appkey填写到 app/src/main/AndroidManifest.xml 中,因为开发的是安卓,所以appkey填安卓的:
四、把我们的签名证书放到app目录下,博主的签名证书名叫 uniapp.keystore
五、配置签名证书,在 app/build.gradle 的 signingConfigs 选项中:
六、右键 UniPlugin-Hello-AS,创建 Mole
七、填写插件模块信息:
八、配置 TCP-Socket/build.gradle,复制官方案例 uniplugin_mole/build.gradle
apply plugin: 'com.android.library'
android {
compileSdkVersion 29
defaultConfig {
minSdkVersion 16
targetSdkVersion 28
versionCode 1
versionName "1.0"
testInstrumentationRunner 'androidx.test.runner.AndroidJUnitRunner'
}
buildTypes {
release {
minifyEnabled false
proguardFiles getDefaultProguardFile('proguard-android.txt'), 'proguard-rules.pro'
}
}
}
repositories {
flatDir {
dirs 'libs'
}
}
dependencies {
compileOnly fileTree(dir: 'libs', include: ['*.jar'])
compileOnly fileTree(dir: '../app/libs', include: ['uniapp-v8-release.aar'])
compileOnly 'androidx.recyclerview:recyclerview:1.0.0'
compileOnly 'androidx.legacy:legacy-support-v4:1.0.0'
compileOnly 'androidx.appcompat:appcompat:1.0.0'
implementation 'com.alibaba:fastjson:1.1.46.android'
implementation 'com.facebook.fresco:fresco:1.13.0'
/*implementation 'com.android.support:appcompat-v7:28.0.0'
testImplementation 'junit:junit:4.12'
androidTestImplementation 'com.android.support.test:runner:1.0.2'
androidTestImplementation 'com.android.support.test.espresso:espresso-core:3.0.2'*/
}
九、删除不必要的官方案例,让项目更加简洁(可选):
十、在TCP-Socket 模块下的 com/example/tcp/socket 创建类TcpMole
十一、TCP Scocket 通信功能实现,代码如下:
package com.example.tcp.socket;
import com.alibaba.fastjson.JSONObject;
import java.io.BufferedReader;
import java.io.BufferedWriter;
import java.io.IOException;
import java.io.InputStreamReader;
import java.io.OutputStreamWriter;
import java.io.PrintWriter;
import java.net.Socket;
import io.dcloud.feature.uniapp.annotation.UniJSMethod;
import io.dcloud.feature.uniapp.bridge.UniJSCallback;
import io.dcloud.feature.uniapp.common.UniMole;
public class TcpMole extends UniMole {
int port = 6666;
Socket socket = null;
OutputStreamWriter outputStream = null;
InputStreamReader inputStream = null;
@UniJSMethod
public void send(final JSONObject json, final UniJSCallback callback) {
new Thread(new Runnable() {
@Override
public void run() {
String ip = json.getString("ip");
String userId = json.getString("code");
JSONObject res = new JSONObject();
// 建立与服务器的连接
try {
socket = new Socket(ip, port);
socket.setSoTimeout(1500);
//建立连接后获取输入输出流
outputStream = new OutputStreamWriter(socket.getOutputStream());
inputStream = new InputStreamReader(socket.getInputStream());
} catch (Exception e) {
try {
socket.close();
} catch (IOException ioException) {
ioException.printStackTrace();
}
e.printStackTrace();
res.put("code", 400);
res.put("data", "系统异常, 请重启APP!");
callback.invoke(res);
}
BufferedReader socketReader = new BufferedReader((inputStream));
BufferedWriter bufferedWriter = new BufferedWriter(outputStream);
PrintWriter socketWriter = new PrintWriter(bufferedWriter, true);
socketWriter.println(userId);
try {
String s = socketReader.readLine();
res.put("code", 200);
res.put("data", s);
// 这里关闭连接, 不然回调以后,程序就不执行了,不能再 finally 里面关闭连接
socket.close();
callback.invoke(res);
} catch (IOException e) {
res.put("code", 400);
res.put("data", "系统异常, 请重启APP!");
callback.invoke(res);
}
}
}).start();
}
}
注意:Android4.0 以后不允许在主线程进行网络连接,否则会出现 android.os.NetworkOnMainThreadException。因此,必须另起一个线程进行网络连接方面的操作。
十二、注册插件,在 app/src/main/assets/dcloud_uniplugins.json 文件中写入,如下:
{
"nativePlugins": [
{
"plugins": [
{
"type": "mole",
"name": "TCP-Socket",
"class": "com.example.tcp.socket.TcpMole"
}
]
}
]
}
五、HbuilderX 生成本地打包 TCP-Plugin
1、引入原生插件方式如下:
const TCP = uni.requireNativePlugin("TCP-Socket");
index.vue 代码编写如下:
<template>
<view class="content">
<image class="logo" src="/static/logo.png"></image>
<view class="text-area">
<text class="title">{{title}}</text>
</view>
<view>
<button @click="clickBtn">点击发送消息</button>
</view>
</view>
</template>
<script>
const TCP = uni.requireNativePlugin("TCP-Socket");
export default {
data() {
return {
title: 'TCP-Socket 插件测试'
}
},
onLoad() {
},
methods: {
clickBtn(){
TCP.send({
ip: '192.168.0.100', // 服务器ip
code: '' // 需要发送的数据
}, e => {
// 回调函数
uni.showToast({
title: '响应数据:' + JSON.stringify(e),
icon: 'none'
});
})
}
}
}
</script>
<style>
(...省略)
</style>
2、HbuilderX 生成本地打包资源:
六、离线打包apk并进行真机调试
1、把生成的本地打包资源复制到 UniPlugin-Hello-AS 项目的 app/src/main/assets/apps 目录下:
2、配置 appid,在 UniPlugin-Hello-AS 项目的 app/src/main/assets/data/dcloud_control.xml 中配置:
3、在 UniPlugin-Hello-AS 项目的 app/build.gradle 中对 TCP-Socket 插件引用:
4、测试,手机或者虚拟设备连接以后,点击运行进行测试:
七、打包生成原生插件 aar
八、HbuilderX 引入TCP-Socket 打包的 aar 插件:
1、目录结构以及 package.json 编写如下:
2、manifest.json 选择本地插件:
九、制作自定义调试基座
打包自定义基座成功如下:
十、HbuilderX 真机调试测试插件
1、选择自定义调试基座:
注意:如果出现已经制作自定义调试基座,但是没有运行基座选择这一选项的情况。请重新进行自定义基座打包,直到出现运行基座选择为止!
2、选择运行到 Android App 基座进行真机调试:
测试成功!
原生插件开发调试打包全部完成!
十一、开发期间遇到的问题:
1、 [JS Framework] 当前运行的基座不包含原生插件[xxxx],请在manifest中配置该插件,重新制作包括该原生插件的自定义运行基座。
问题分析:
1、 package.json 配置编写错误 (仔细进行对照).
2、 是否在manifest中配置 (这种睿智操作一般不会犯)
3、 原生插件是否使用自定义基座 (大部分是这个原因)
4、 自己开发原生插件是否有错误,未成功打包到基座 (原因是这个的概率很小,因为在 Android Studio 离线打包的时候我们调试通过了,说明插件没有问题。)
2、Android Studio 问题:Gradle task list not built ring sync.Building the task list can impact Gradlesync performance on large projects.
解决方法如下:
完结~~, 撒花~~
‘玖’ uni-app 入门到精通 (二)
18 年时候有幸接触到 uniapp , 写了一篇 《uni-app 入门到精通》 ,由于一些原因,该方案并没有执行,该项目一系列文章也就没有再写下去,所以遭受到了许多人评论的吐槽,到如今公司项目的需求又要根据 uniapp 写 H5 嵌入到 app 中,所以想根据项目实际开发分享一下,有兴趣的伙伴可以参考和吐槽。
这一篇文章主要分享一下内容
uniapp 模板项目有两种初始化方式
由于无法舍弃 VSCode ,我们采用 vue-cli 来初始化项目, HBuilderX 大家可以参照官方文档
这种方式是可以通过 vue 脚手架命令指定模板,这个是 dcloudio 的官方提供模板
我们选择默认模板即可,
成功后我们执行
打开浏览器地址,直接运行即可。
一般刚接触前端的小伙伴可能会对 postcss 不太了解,这里简单介绍一下,
当然 PostCSS 具体使用是需要引入一些插件的,例如常用的是 autoprefixer postcss-preset-env 等, 具体如何使用大家可以自行参考资料,毕竟这块知识还是挺多的就不具体展开解释了。
通常我们在写移动端时候需要做的是页面适配方案的确定, uni-app 支持的通用 css 单位包括 px、rpx , 之前的 upx 方案已经被废弃掉,官方解释是目前市面上已经基本上支持了微信的 rpx 方案,所以 upx 中转方案已经意义不大了,不过还可以继续使用,不过已经不再推荐。
rpx 之初是由微信小程序提出一种方案,即根据宽度来进行适配以 750 宽屏幕为基准, 750rpx 恰好为屏幕宽度, uni-app 规定屏幕基准宽度 750rpx 。所以说如果你们的UI 设计以 750*1334 iphone 6/6s 为基准设计的话,你只需要将屏幕上 px 写为 rpx 即可,不用做任何换算,如果不是的话,你就需要做如下换算:
uniapp 有自己一套路由管理机制,而未采用 vue-route 方案,个人认为这套方案还是比较成熟和好用的,以及可以满足我们日常的需求:
保留当前页面,跳转到应用内的某个页面,使用uni.navigateBack可以返回到原页面。
2.uni.redirectTo(OBJECT)
关闭当前页面,跳转到应用内的某个页面。
3.uni.reLaunch(OBJECT)
关闭所有页面,打开到应用内的某个页面。
注意: 如果调用了 uni.preloadPage(OBJECT)) 不会关闭,仅触发生命周期 onHide
4.uni.switchTab(OBJECT)
跳转到 tabBar 页面,并关闭其他所有非 tabBar 页面。
注意: 如果调用了 uni.preloadPage(OBJECT)不会关闭,仅触发生命周期 onHide
5.uni.navigateBack(OBJECT)
关闭当前页面,返回上一页面或多级页面。可通过 getCurrentPages() 获取当前的页面栈,决定需要返回几层。
5.uni.preloadPage(OBJECT)
预加载页面,是一种性能优化技术。被预载的页面,在打开时速度更快。
以上路由API 已经满足我们的需求,当然进行路由跳转的前提是我们需要在 pages.json 进行路由配置, 包括路由和具体的样式配置
而进行具体路由跳转我们需要如下,需要多加一个 /
需要特别注意的一点是, 利用浏览器 在 进行 移动H5页面调试时候,会出现页面刷新之后页面栈会消失,此时navigateBack不能返回,如果一定要返回可以使用history.back()导航到浏览器的其他历史记录。
uniapp 提供网络请求的 api 是 uni.request ,具体支持的请求方法可以参考官网 method 有效值
不过我们通常不会直接使用,而是进过一系列的封装以方便我们的使用,具体封装接口使用会在随根据页面数据请求一并展示。