Flutter LinkedIn登录插件linkedin_login_android的使用

Flutter LinkedIn 登录插件 linkedin_login_android 的使用

描述

  • 它用于支持父包 linkedin_login
  • 包含特定于 Android 平台的逻辑

示例代码

import 'package:flutter/material.dart';

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  [@override](/user/override)
  Widget build(BuildContext context) {
    // 这里不需要展示实际的应用示例，因此返回一个简单的文本组件
    return const Text('示例应用无需展示');
  }
}

在上述示例中，我们创建了一个简单的 Flutter 应用程序。由于该插件主要用于 Android 平台上的 LinkedIn 登录功能，因此实际的示例代码可能需要包含与 LinkedIn API 的交互。

为了更好地理解如何使用 linkedin_login_android 插件，您可以参考以下完整的示例代码：

import 'package:flutter/material.dart';
import 'package:linkedin_login/linkedin_login.dart'; // 引入 LinkedIn 登录插件

void main() {
  runApp(MyApp());
}

class MyApp extends StatefulWidget {
  [@override](/user/override)
  _MyAppState createState() => _MyAppState();
}

class _MyAppState extends State<MyApp> {
  String _loginResult = '未登录';

  void _handleLoginResult(LoginResult result) {
    setState(() {
      if (result.status == LoginStatus.success) {
        _loginResult = '登录成功，用户ID为: ${result.accessToken}';
      } else {
        _loginResult = '登录失败，错误信息为: ${result.message}';
      }
    });
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: Scaffold(
        appBar: AppBar(
          title: const Text('LinkedIn 登录示例'),
        ),
        body: Center(
          child: Column(
            mainAxisAlignment: MainAxisAlignment.center,
            children: <Widget>[
              ElevatedButton(
                onPressed: () async {
                  final result = await Navigator.push(
                    context,
                    MaterialPageRoute(
                      builder: (context) => LinkedInAuth(
                        clientId: 'YOUR_CLIENT_ID', // 在此处替换您的 LinkedIn 客户端 ID
                        clientSecret: 'YOUR_CLIENT_SECRET', // 在此处替换您的 LinkedIn 客户端密钥
                        redirectUrl: 'YOUR_REDIRECT_URL', // 在此处替换您的重定向 URL
                        scopes: ['r_liteprofile', 'r_emailaddress'], // 所需的权限范围
                        onLoginSuccess: _handleLoginResult, // 登录成功后的回调函数
                        onLoginError: (error) {
                          setState(() {
                            _loginResult = '登录出错: $error';
                          });
                        },
                      ),
                    ),
                  );
                },
                child: const Text('使用 LinkedIn 登录'),
              ),
              const SizedBox(height: 20),
              Text(_loginResult), // 显示登录结果
            ],
          ),
        ),
      ),
    );
  }
}

更多关于Flutter LinkedIn登录插件linkedin_login_android的使用的实战教程也可以访问 https://www.itying.com/category-92-b0.html

1 回复

更多关于Flutter LinkedIn登录插件linkedin_login_android的使用的实战系列教程也可以访问 https://www.itying.com/category-92-b0.html


在 Flutter 中使用 linkedin_login_android 插件来实现 LinkedIn 登录功能，你可以按照以下步骤进行操作：

1. 添加依赖

首先，你需要在 pubspec.yaml 文件中添加 linkedin_login_android 插件的依赖：

dependencies:
  flutter:
    sdk: flutter
  linkedin_login_android: ^1.0.0  # 请检查最新版本

然后运行 flutter pub get 来安装依赖。

2. 配置 LinkedIn 开发者应用

在 LinkedIn 开发者平台上创建一个应用，并获取 Client ID 和 Client Secret。

3. 配置 Android 项目

在 android/app/build.gradle 文件中，确保 minSdkVersion 至少为 21：

android {
    defaultConfig {
        minSdkVersion 21
        targetSdkVersion 30
        // 其他配置
    }
    // 其他配置
}

4. 配置 AndroidManifest.xml

在 android/app/src/main/AndroidManifest.xml 文件中，添加以下内容：

<manifest xmlns:android="http://schemas.android.com/apk/res/android"
    package="com.example.yourapp">

    <application
        android:label="YourApp"
        android:icon="@mipmap/ic_launcher">

        <!-- 添加以下内容 -->
        <activity
            android:name="com.linkedin.android.liauthlib.thirdparty.LiThirdPartyAuthorizeActivity"
            android:theme="@style/LinkedInActivityTheme" />
        <activity
            android:name="com.linkedin.android.liauthlib.thirdparty.LiThirdPartyAuthorizeRedirectActivity"
            android:theme="@style/LinkedInActivityTheme" />
        <!-- 结束 -->

    </application>
</manifest>

5. 在 Flutter 中使用 linkedin_login_android

在你的 Flutter 代码中，使用 linkedin_login_android 插件来实现 LinkedIn 登录：

import 'package:flutter/material.dart';
import 'package:linkedin_login_android/linkedin_login_android.dart';

void main() {
  runApp(MyApp());
}

class MyApp extends StatelessWidget {
  [@override](/user/override)
  Widget build(BuildContext context) {
    return MaterialApp(
      home: LinkedInLoginScreen(),
    );
  }
}

class LinkedInLoginScreen extends StatefulWidget {
  [@override](/user/override)
  _LinkedInLoginScreenState createState() => _LinkedInLoginScreenState();
}

class _LinkedInLoginScreenState extends State<LinkedInLoginScreen> {
  String _accessToken = '';

  Future<void> _loginWithLinkedIn() async {
    try {
      final result = await LinkedInLoginAndroid.login(
        clientId: 'YOUR_CLIENT_ID',
        clientSecret: 'YOUR_CLIENT_SECRET',
        redirectUri: 'https://www.example.com/auth/linkedin/callback',
        scopes: ['r_liteprofile', 'r_emailaddress'],
      );

      setState(() {
        _accessToken = result.accessToken;
      });

      print('Access Token: $_accessToken');
    } catch (e) {
      print('Error: $e');
    }
  }

  [@override](/user/override)
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: Text('LinkedIn Login'),
      ),
      body: Center(
        child: Column(
          mainAxisAlignment: MainAxisAlignment.center,
          children: [
            ElevatedButton(
              onPressed: _loginWithLinkedIn,
              child: Text('Login with LinkedIn'),
            ),
            SizedBox(height: 20),
            Text('Access Token: $_accessToken'),
          ],
        ),
      ),
    );
  }
}
回到顶部