flutter使用fluwx調通微信支付

陽春boy發表於2021-05-18

需求

使用flutter的情況下用fluwx調通微信支付,使用的是fluwx的包,程式碼量不多,複雜的是安卓和ios的各種配置。

環境

flutter   1.9.1
fluwx  1.2.1+1
複製程式碼

使用方法

引入fluwx,然後註冊微信api

fluwx.registerWxApi(
      appId:"wx0axxxxxxxxxx3edb",
      universalLink:"https://www.baidu.com/"
    );
複製程式碼

呼叫支付,引數由後端寫好介面請求得到

fluwx.pay(
            appId: wechatParams["appid"], 
            partnerId: wechatParams["partnerid"],
            prepayId: wechatParams["prepayid"],
            packageValue: wechatParams["package"],
            nonceStr: wechatParams["noncestr"],
            timeStamp: wechatParams["timestamp"],
            sign: wechatParams["sign"],
            extData: 'test'
          );

複製程式碼

監聽支付的回撥

fluwx.responseFromPayment.listen((data) {
            print('支付回撥通知。。。。。。’);
            if(data.errCode == 0){
              print('支付成功');
            }else{
              print('支付失敗');
            }

複製程式碼

程式碼見上,其他安卓和ios的配置見下文

IOS的配置

iOS的微信支付的官方配置文件 詳細的再官方文件都有介紹,建議先看一遍官方文件,以下是我總結的幾個步驟:

  1. 配置專案的Universal Links,同時和微信公眾平臺配置的保持一致
  2. Xcode開啟Associated Domains開關,將Universal Links域名加到配置上
  3. 檢查有沒有WechatOpenSDK,沒有的話用CocoaPods 整合
  4. 在 Xcode 中,選擇你的工程設定項,選中“TARGETS”一欄,在“info”標籤欄的“URL type“新增“URL scheme”為你所註冊的應用程式 id
  5. 在Xcode中,選擇你的工程設定項,選中“TARGETS”一欄,在 “info”標籤欄的“LSApplicationQueriesSchemes“新增weixin 和weixinULAPI(重要)
  6. ios配置結束,可以打包出來看效果

安卓的配置

安卓的微信支付官方配置文件 詳細的再官方文件都有介紹,建議先看一遍官方文件,以下是我總結的幾個步驟:

  1. 在 build.gradle 檔案中,新增如下依賴即可
dependencies {
    api 'com.tencent.mm.opensdk:wechat-sdk-android-without-mta:+'
}
複製程式碼
  1. 並在 AndroidManifest.xml 檔案裡面加上 exported 屬性,設定為 true
<activity
      android:exported="true”>
</activity>
複製程式碼
  1. 獲取應用的簽名,同時更新到微信開放平臺,確認兩邊的簽名和應用id一致,(官方獲取安卓APP簽名的應用,最下面有個簽名生成工具

  2. 安卓配置成功,可以打包出來看看效果

參考資料

)

相關文章