微信开放平台:微信开放平台

fluwx实现微信登录

1.在flutter中的yaml文件中进行配置:

 #微信SDK插件,它允许开发者调用 微信原生SDK https://github.com/OpenFlutter/fluwx
  fluwx: ^3.4.2

2.初始化:

main.dart中进行初始化操作,尽可能早的初始化

import 'package:fluwx/fluwx.dart';
  ///微信登录初始化
  static void initWXLogin() async {
    registerWxApi(
        appId: 'wxxxxxx',//查看微信开放平台
        doOnAndroid: true,
        doOnIOS: true,
        universalLink:
            'xxxxx'//查看微信开放平台
         );

    /* var result = await isWeChatInstalled;
    MyLogUtil.d("是否安装微信 $result");*/
  }

3.登录页代码:

import 'package:fluwx/fluwx.dart' as fluwx;



  @override
  void initState() {
    super.initState();

    fluwx.weChatResponseEventHandler.distinct((a, b) => a == b).listen((res) {
      if (res is fluwx.WeChatAuthResponse) {
        int errCode = res.errCode;
        MyLogUtil.d('微信登录返回值:ErrCode :$errCode  code:${res.code}');
        if (errCode == 0) {
          String code = res.code;
       //把微信登录返回的code传给后台,剩下的事就交给后台处理
          _presenter.getWeChatAccessToken(code);
          showToast("用户同意授权成功");
        } else if (errCode == -4) {
          showToast("用户拒绝授权");
        } else if (errCode == -2) {
          showToast("用户取消授权");
        }
      }
    });
  }


  _buildText('微信登录', padding: EdgeInsets.only(left: widthDimens(10)),
              onJumpTo: () {
            fluwx
                .sendWeChatAuth(
                    scope: "snsapi_userinfo", state: "wechat_sdk_demo_test")
                .then((data) {
              if (!data) {
                showToast('没有安装微信,请安装微信后使用该功能');
              }
              MyLogUtil.d('微信登录:$data');
            });
          }),


Widget _buildText(String textStr,
      {VoidCallback onJumpTo,
      EdgeInsetsGeometry padding: const EdgeInsets.all(0)}) {
    return Padding(
      padding: padding,
      child: InkWell(
        onTap: onJumpTo,
        child: Text(
          textStr,
          maxLines: 1,
          overflow: TextOverflow.ellipsis,
          style: TextStyles.text99912,
        ),
      ),
    );
  }

fluwx实现微信支付

1和2与微信登录相同

3.微信支付页

///1.调起微信支付
//注:里面传的参数都是从自己后台返回的

 fluwx
        .payWithWeChat(
      appId: params['appId'],
      partnerId: params['partnerId'],
      prepayId: params['prepayId'],
      packageValue: params['packageValue'],
      nonceStr: params['nonceStr'],
      timeStamp: Utils.str2Int(params['timeStamp']),
      sign: params['sign'],
    )
        .then((data) {
      MyLogUtil.d('微信支付返回值:$data');
    }).catchError((e) {
      MyLogUtil.d('微信支付异常:$e');
    });
  }




///2.支付结果的监听
  @override
  void initState() {
    super.initState();

    // 监听支付结果
    fluwx.weChatResponseEventHandler.listen((event) async {
      // 关闭弹窗
      closeProgress();
      // 支付成功
      if (event.errCode == 0) {
        showToast('支付成功');
        NavigatorUtils.goBackWithParams(context, '支付成功');
      } else if (event.errCode == -2) {
        showToast('用户取消支付了');
      } else {
        showToast('支付失败原因:${event.errStr}');
      }
    });
  }

原生端iOS 通用链接(Universal Link)配置

注:android不需要在做其它的配置,iOS端还需要配置通用链接(Universal Link)

1.在苹果开发者账号打开Associated Domains配置

2.在xcode打开Associated Domains开关,将Universal Links域名加到配置上


如果没有Associated Domains选项,点击上方的+Capability添加。值参考下面的7里面的说明

Domains中的域名必须是使用applinks开头,然后输入自己的域名即可。注意:当app第一次启动之后,会自动从你自己的域名目录下下载这个apple-app-site-association文件。

3.配置URL Types


把微信的appID添加为url scheme

4.配置LSApplicationQueriesSchemes


打开plist的LSApplicationQueriesSchemes,添加微信的scheme

    <key>LSApplicationQueriesSchemes</key>
    <array>
        <string>wechat</string>
        <string>weixin</string>
        <string>weixinULAPI</string>
    </array>

5.配置apple-app-site-association文件

创建一个空白文件(必须纯文本,命名为apple-app-site-association,去除后缀名)

修改"appID"字段值,值为:teamID.bundleID   查看1.Associated Domains配置里面的图

注:该文件是要存储在一个以https开头的链接服务器里面的

{
    "applinks": {
        "apps": [],
        "details": [
            {
                "appID": "teamID.bundleID",
                "paths": [ "*" ]
            }
        ]
    }
}
 

6.后台服务器配置

把文件apple-app-site-association,放置在服务器提供的链接地址下,格式是“链接/apple-app-site-association”如:https://www.demo.com/apple-app-site-association

用浏览器打开这个地址,可以下载这个文件。用GET请求这个地址,返回文件的JSON内容。

注:有些博客上写的必须在服务器的根目录下,经测试只要是以https开头的链接都可以,就是一个普通的存放文件的链接

7.微信开放平台配置

配置好bundleID和universalLink

如果后台提供的url地址是 https://www.demo.com/apple-app-site-association。那么 Associated Domains 中填写applinks:www.demo.com

微信后台的Universal Links填写https://www.demo.com/
 

8.不成功时排查以下原因:

工程配置associated domain未打开或未添加Universal links域名
配置文件未上线或未按苹果要求放在服务器指定的路径下(域名根目录)
配置文件的Universal links的path末尾没有加通配符*
配置文件的appID(teamID+bundleID)与实际代码和微信开放平台配置的bundleID不匹配

info添加的weixinULAPI注意大小写,如果格式不对也注册不成功 


 

Logo

为开发者提供学习成长、分享交流、生态实践、资源工具等服务,帮助开发者快速成长。

更多推荐