『壹』 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 有效值
不過我們通常不會直接使用,而是進過一系列的封裝以方便我們的使用,具體封裝介面使用會在隨根據頁面數據請求一並展示。