Twitter 注册/登录

用户可以通过 Twitter 账号登录/注册系统

接口使用说明

在调用接口之前，请确保您已经认真阅读了相关的接口文档。以下是针对不同登录方式的具体说明：

一、设置 Twitter 登录配置信息

更详细步骤可参考 Twitter 开发文档

Twitter 开发文档：https://developer.x.com/en/docs/platform-overview

在使用第三方登录服务之前，您需要先注册相应平台的开发者账号并创建应用。以下是Twitter的注册步骤：

1. 访问Twitter Developer：

   • 使用您的Twitter账号登录Twitter Developer平台。

2. 创建新应用：

   • 创建一个新的应用并获取API密钥和API密钥密钥。

3. 获取应用ID和应用密钥：

   • 创建成功后，获取客户端ID（Client ID）和客户端密钥（Client Secret）。

4. 在白标管理后台配置客户端ID和客户端密钥。

二、获取三方登录配置信息

调用获取三方配置接口拿到第一步注册的 Twitter 的 ClientId

请求参数

{
    // 第三方源：支持的第三方登录来源
    // 可选值包括：google, facebook, twitter, telegram, apple, metamask, 多个可用逗号隔开
    "thirdSource": "google,twitter"  // 示例：使用 Google Faceb 登录
}

返回结构

{
    // 第三方源：支持的第三方登录来源，例如 "google", "facebook", "twitter", "telegram", "apple", "metamask"
    "thirdSource": "twitter",  // 示例：使用 Twitter 登录

    // 客户端 ID：第三方应用的唯一标识符
    "clientId": "abcesddff",    // 示例：您的应用在 Twitter 上的客户端 ID

    // 开发者账号：与第三方源关联的开发者邮箱
    "developerAccount": "[email protected]" // 示例：开发者的邮箱地址
}

三、登录代码实现

参考文档：https://adodson.com/hello.js/#install

1. 使用 NPM 安装 Hello.js

npm install hellojs

2. 初始化 Hello.js

hello.init({
  'twitter': 'YOUR_TWITTER_CLIENT_ID' // 使用上一步获取的clientId
});

3. 发起登录授权请求

function loginWithTwitter() {
    hello('twitter').login().then(function(res) {
        // 登录成功后的处理
        console.log('Logged in to Twitter!');
        // 登录完成后，调用Twitter 三方登录校验接口处理逻辑
        twitterVerify({
            authResponse: res.authResponse
        });
    }, function(e) {
        // 处理错误
        console.error('Login failed:', e);
    });
}

4. Twitter 三方 accessToken 校验

调用 Twitter 三方登录校验接口

请求参数

{
    // 渠道来源：支持的渠道类型，例如 "h5"、"pc"
    "channelSource": "h5",  // 示例：表示来自 H5 端

    // 用户授权信息
    "authResponse": "accessToken"  // 示例：替换为实际的 accessToken
}

返回结构

{
    // 下一步操作行为：支持的操作类型，如 "login"、"bind"、"register"
    "action": "login",  // 示例：表示用户进行登录操作

    // 三方返回的用户邮箱
    "email": "[email protected]",  

    // 校验失败的原因（如果有）
    "failReason": "Invalid credentials", 

    // 三方返回的用户手机号
    "phone": "[phone]", 

    // 校验结果：表示校验是否成功，true 为成功，false 为失败
    "result": true,  // 示例：表示校验成功

    // 第三方登录源：支持的来源，例如 "google"、"facebook"、"twitter"
    "thirdSource": "twitter",  

    // 校验 token：用于身份验证的 token
    "token": "exampleToken123",

    // 第三方用户 ID：用户在第三方平台的唯一标识符
    "userId": "thirdPartyUserId",

    // 第三方授权凭证：用于访问第三方 API 的凭证
    "authToken": "authToken123" 
}

5. 完成登录/注册

根据上一步返回的信息，进行三方登录或注册接口的调用。

const twitterVerify = (data: UserService.LoginVerifyRes) => {
   // 获取操作类型、失败原因和第三方来源
    let { action, failReason, thirdSource } = data;

    // 根据操作类型进行不同的处理
    if (action === 'register') {
        // 注册操作
        register(data); 注册
    } else if (action === 'login') {
        // 登录操作
        login(data); 
    } else if (action === 'bind') {
        // 绑定操作
        login(data);
    } else {
        // 操作不符合预期，显示失败原因
        Toast.error(failReason);
    }
};

通过以上步骤，您可以成功集成 Twitter 登录功能，并获取用户授权的AccessToken。如果在集成过程中遇到问题，请检查网络连接或Twitter应用的配置，确保所有步骤正确无误。如需更多信息，请参考 Twitter 开发文档。