@zhucl1006/capacitor-line-login

v1.1.0

Published

5 months ago

Capacitor plugin for Line Login integration with support for Android, iOS, and Web platforms

0High
0Medium
0Low

zhucl1006

capacitor plugin native

📱 Capacitor Line Login Plugin

一个功能完整的 Capacitor 插件，支持 Line Login 在 Android、iOS 和 Web 平台上的集成。

✨ 特性

🚀 跨平台支持: Android、iOS 和 Web 平台
🔐 完整的 OAuth 2.0 流程: 支持授权码模式和 PKCE
🛡️ 安全性: 内置 CSRF 防护和状态验证
📱 原生体验: 在移动设备上使用原生 Line SDK
🌐 Web 兼容: 在浏览器中使用 Line Login Web API
🔧 TypeScript 支持: 完整的类型定义
📖 详细文档: 包含平台特定配置指南

📦 安装

npm install capacitor-line-login
npx cap sync

🚀 快速开始

1. 初始化插件

import { LineLogin } from 'capacitor-line-login';

// 基本配置
await LineLogin.initialize({
  channelId: 'YOUR_LINE_CHANNEL_ID',
  scope: ['profile']
});

// 完整配置（Web 平台）
await LineLogin.initialize({
  channelId: 'YOUR_LINE_CHANNEL_ID',
  redirectUri: 'https://your-domain.com/line-callback',
  scope: ['profile', 'openid'],
  botPrompt: 'normal'
});

2. 执行登录

try {
  const result = await LineLogin.login();
  console.log('登录成功:', result);
  console.log('访问令牌:', result.accessToken);
  console.log('用户信息:', result.userProfile);
} catch (error) {
  console.error('登录失败:', error);
}

3. 获取用户信息

try {
  const profile = await LineLogin.getUserProfile();
  console.log('用户ID:', profile.userId);
  console.log('显示名称:', profile.displayName);
  console.log('头像URL:', profile.pictureUrl);
} catch (error) {
  console.error('获取用户信息失败:', error);
}

4. 检查登录状态

const { isLoggedIn } = await LineLogin.isLoggedIn();
if (isLoggedIn) {
  console.log('用户已登录');
} else {
  console.log('用户未登录');
}

5. 登出

await LineLogin.logout();
console.log('登出成功');

🔧 平台配置

Android 配置

添加 Line SDK 依赖（已自动包含）
配置 AndroidManifest.xml（已自动配置）
在 Line Developers Console 中配置:
- 添加 Android 应用
- 设置包名和签名证书指纹
- 启用 Line Login

iOS 配置

添加 Line SDK 依赖（已自动包含）

配置 URL Scheme:

<!-- ios/App/App/Info.plist -->
<key>CFBundleURLTypes</key>
<array>
  <dict>
    <key>CFBundleURLName</key>
    <string>line3rdp.YOUR_BUNDLE_ID</string>
    <key>CFBundleURLSchemes</key>
    <array>
      <string>line3rdp.YOUR_BUNDLE_ID</string>
    </array>
  </dict>
</array>

在 Line Developers Console 中配置:
- 添加 iOS 应用
- 设置 Bundle ID
- 配置 URL Scheme

详细配置指南请参考：

Web 配置

配置重定向 URI:

await LineLogin.initialize({
  channelId: 'YOUR_LINE_CHANNEL_ID',
  redirectUri: 'https://your-domain.com/line-callback'
});

在 Line Developers Console 中配置:
- 添加 Web 应用
- 设置 Callback URL

📚 API 文档

initialize(...)

initialize(options: LineLoginConfig) => Promise<void>

初始化Line Login SDK

| Param | Type | Description | | ------------- | ----------------------------------------------------------- | ----------- | | options | LineLoginConfig | 配置选项 |

login(...)

login(options?: LoginOptions | undefined) => Promise<LoginResult>

执行Line登录

| Param | Type | Description | | ------------- | ----------------------------------------------------- | ----------- | | options | LoginOptions | 登录选项 |

Returns: Promise<LoginResult>

getUserProfile()

getUserProfile() => Promise<UserProfile>

获取用户信息

Returns: Promise<UserProfile>

isLoggedIn()

isLoggedIn() => Promise<{ isLoggedIn: boolean; }>

检查登录状态

Returns: Promise<{ isLoggedIn: boolean; }>

logout()

logout() => Promise<void>

登出

refreshToken()

refreshToken() => Promise<TokenResult>

刷新访问令牌

Returns: Promise<TokenResult>

echo(...)

echo(options: { value: string; }) => Promise<{ value: string; }>

Echo方法（测试用）

| Param | Type | | ------------- | ------------------------------- | | options | { value: string; } |

Returns: Promise<{ value: string; }>

Interfaces

LineLoginConfig

Line Login 配置接口

| Prop | Type | Description | | ---------------------- | --------------------- | ------------------------ | | channelId | string | Line Channel ID | | universalLinkURL | string | Universal Link URL (iOS) | | redirectUri | string | 重定向 URI (Web) | | scope | string[] | 权限范围 | | botPrompt | string | Bot 提示信息 | | debug | boolean | 调试模式 |

LoginResult

登录结果接口

| Prop | Type | Description | | ------------------ | --------------------------------------------------- | ----------- | | accessToken | string | 访问令牌 | | expiresIn | number | 令牌过期时间（秒） | | refreshToken | string | 刷新令牌 | | scope | string | 权限范围 | | tokenType | string | 令牌类型 | | userProfile | UserProfile | 用户个人资料 |

UserProfile

用户个人资料接口

| Prop | Type | Description | | ------------------- | ------------------- | ----------- | | userId | string | 用户ID | | displayName | string | 显示名称 | | pictureUrl | string | 头像URL | | statusMessage | string | 状态消息 | | language | string | 语言 |

LoginOptions

登录选项接口

| Prop | Type | Description | | ------------------ | ------------------------------------- | ----------- | | onlyWebLogin | boolean | 仅使用Web登录 | | botPrompt | 'normal' | 'aggressive' | Bot提示模式 | | scopes | string[] | 权限范围 |

TokenResult

令牌结果接口

| Prop | Type | Description | | ------------------ | ------------------- | ----------- | | accessToken | string | 访问令牌 | | expiresIn | number | 令牌过期时间（秒） | | refreshToken | string | 刷新令牌 | | tokenType | string | 令牌类型 |

Helper Functions

插件还提供了一些辅助函数：

import { LineLoginHelpers } from 'capacitor-line-login';

// 检查当前平台
const platform = LineLoginHelpers.getCurrentPlatform(); // 'web' | 'ios' | 'android'

// 检查平台支持
const isSupported = LineLoginHelpers.isPlatformSupported(); // boolean

// 检查是否为Web平台
const isWeb = LineLoginHelpers.isWebPlatform(); // boolean

// 检查是否为原生平台
const isNative = LineLoginHelpers.isNativePlatform(); // boolean

🛠️ 开发指南

运行示例应用

cd example-app
npm install
npm run dev

构建插件

npm run build

运行测试

npm test

🔍 故障排除

常见问题

Android 登录失败
- 检查 Line Developers Console 中的包名和签名证书指纹
- 确保已启用 Line Login
iOS 登录失败
- 检查 URL Scheme 配置
- 确保 Bundle ID 与 Line Developers Console 中的配置一致
Web 登录失败
- 检查 Callback URL 配置
- 确保使用 HTTPS（生产环境）

调试模式

启用调试模式以获取更多日志信息：

await LineLogin.initialize({
  channelId: 'YOUR_LINE_CHANNEL_ID',
  debug: true
});

📄 许可证

MIT License. 详见 LICENSE 文件。

🤝 贡献

欢迎提交 Pull Request 和 Issue！

🔗 相关链接

📊 支持的平台

| 平台 | 支持状态 | SDK 版本 | |------|----------|----------| | Android | ✅ | Line SDK 5.11.1+ | | iOS | ✅ | Line SDK 5.8.0+ | | Web | ✅ | Line Login Web API v2.1 |