@beaver-im/js-sdk

@beaver-im/js-sdk

海狸开放平台登录组件：Web Component <beaver-login>，支持扫码登录、账号密码登录；登录成功后拿到授权码 code，由你的服务端换 Token。

安装

npm install @beaver-im/js-sdk

快速开始

<beaver-login
  app-id="your_app_id"
  api-base="https://server.wsrh8888.com"
  oauth-base="https://oauth.wsrh8888.com"
  redirect-url="https://yoursite.com/callback"
></beaver-login>

<script type="module">
  import BeaverSDK from '@beaver-im/js-sdk'

  BeaverSDK.register()

  document.querySelector('beaver-login').addEventListener('login', (e) => {
    const { authCode } = e.detail.result
    // 交给服务端换取 accessToken
  })
</script>

若设置了 redirect-url，登录成功会跳转到该地址，并在 Query 中带上 code，可不监听 login 事件。

组件属性

属性	类型	必填	说明
app-id	string	是	开放平台应用 AppID
api-base	string	否	开放 API 网关，默认 https://server.wsrh8888.com
oauth-base	string	否	扫码页域名（拼 /scan?sceneId=），默认 https://oauth.wsrh8888.com
redirect-url	string	否	登录成功后的回跳地址

登录事件

element.addEventListener('login', (e) => {
  // e.detail: { code: 0, msg: '', result: { authCode: '...' } }
})

登录能力

方式	说明
扫码登录	展示二维码，手机海狸 App 扫码确认
密码登录	手机号 / 邮箱 + 密码
本机快捷登录	本机已登录海狸 PC 时，请求 127.0.0.1:38794 一键授权

Vue / Electron 示例

<template>
  <beaver-login
    :app-id="appId"
    :api-base="apiBase"
    :oauth-base="oauthBase"
    @login="onLogin"
  />
</template>

<script setup>
import BeaverSDK from '@beaver-im/js-sdk'
import { onMounted } from 'vue'

onMounted(() => {
  BeaverSDK.register()
})

function onLogin(e) {
  const authCode = e.detail?.result?.authCode
}
</script>

本地开发

npm install
npm run build

产物：dist/beaver-sdk.es.js、dist/beaver-sdk.umd.js。

License

MIT