Flutter教程实现微信登录集成

在Flutter中集成微信登录时，如何正确配置Android和iOS端的应用签名以及包名？调用微信SDK后出现「未验证应用」错误该如何解决？官方文档提到的开放平台密钥和Flutter项目中的配置有何关联？使用flutter_wechat插件时，回调异常或无法返回授权码的情况该如何排查？iOS端在Info.plist设置URL Schemes后仍提示「无法识别应用」是什么原因？

3 回复

要实现微信登录集成，首先需要注册成为微信开放平台开发者并创建应用获取AppID。接着，在Flutter项目中引入flutter_wechat插件。

  1. 配置微信回调：在微信开放平台配置你的域名和包名，并设置好回调URL。
  2. 初始化SDK：在Flutter项目中调用插件初始化微信，传入AppID。
  3. 发起登录请求：通过插件调用微信登录接口，这会跳转到微信APP或网页授权。
  4. 处理回调：用户同意授权后，微信会回调你的应用，需在Flutter中监听并解析返回的code。
  5. 换取access_token：将code发送到微信服务器换取access_token和用户信息。
  6. 获取用户信息：使用access_token和openid向微信服务器请求用户详细信息。

注意，确保Android和iOS平台都正确配置签名等信息，避免回调失败。同时，妥善保存access_token，不要暴露给客户端。

更多关于Flutter教程实现微信登录集成的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


作为屌丝程序员，我来分享下基本思路：

  1. 首先要获取微信开放平台的AppID，在微信开放平台注册应用并创建移动应用。

  2. 在 Flutter 项目中添加依赖包 flutter_wechat 或 wechat_open_platform。

  3. 初始化微信 SDK：

bool isInitialized = await WeChat.instance.initialize(
    appId: "你的微信AppID", 
    universalLink: "你的Universal Link");
  1. 调起微信登录：
WeChatLoginResult result = await WeChat.instance.login();
  1. 处理返回结果：
if (result.code == 0) {
    print("登录成功 ${result.accessToken}");
} else {
    print("登录失败 ${result.message}");
}

  1. 回调处理：需要配置 iOS 的 URL Types 和 Android 的 activity，接收微信的回调。

  2. 注意要处理好签名和配置，尤其是 Android 的签名要与开放平台一致。

  3. 可选地可以请求用户信息：

Map<String, dynamic> userInfo = await WeChat.instance.getUserInfo();
  1. 完成登录后记得调用登出接口：
await WeChat.instance.logout();

按照这个流程就能实现简单的微信登录功能了。

下面是一个简洁的Flutter微信登录集成教程（使用官方fluwx插件）：

  1. 添加依赖
dependencies:
  fluwx: ^3.x.x # 使用最新版本
  1. 配置Android/iOS
  • Android: 在AndroidManifest.xml添加
<activity 
    android:name="com.tencent.tauth.AuthActivity"
    android:launchMode="singleTask"
    android:noHistory="true">
    <intent-filter>
        <action android:name="android.intent.action.VIEW"/>
        <category android:name="android.intent.category.DEFAULT"/>
        <category android:name="android.intent.category.BROWSABLE"/>
        <data android:scheme="你的微信APPID"/>
    </intent-filter>
</activity>
  1. 初始化代码
import 'package:fluwx/fluwx.dart' as fluwx;

void main() async {
  WidgetsFlutterBinding.ensureInitialized();
  await fluwx.registerWxApi(
    appId: "你的微信APPID",
    universalLink: "iOS通用链接"
  );
  runApp(MyApp());
}
  1. 登录实现
// 发起微信登录
await fluwx.sendAuth(
  scope: "snsapi_userinfo", 
  state: "随机字符串"
);

// 监听登录结果
fluwx.responseFromAuth.listen((data) {
  if (data != null) {
    print("code: ${data.code}");
    // 用code向你的服务器换取用户信息
  }
});
  1. 处理回调(Android) 在MainActivity.kt中添加：
override fun configureFlutterEngine(flutterEngine: FlutterEngine) {
    GeneratedPluginRegistrant.registerWith(flutterEngine)
    MethodChannel(flutterEngine.dartExecutor, "com.jarvanmo/fluwx")
        .setMethodCallHandler { call, result -> 
            fluwx.WXAPiHandler.handleMethodCall(call, result) 
        }
}

注意事项：

  1. 需要先在微信开放平台申请移动应用
  2. iOS需要配置Associated Domains
  3. 实际使用时需要服务器配合完成code换token流程

完整流程：用户点击登录 → 调起微信 → 授权后返回code → 用code向你的服务器请求用户信息

回到顶部