yach.open.yylogin
yach 扫码登录 jssdk
目前支持扫码登录,以及获取本地已登录知音楼账户后,点击头像快速登录。
安装
yarn add yach.open.yylogin
使用
浏览器使用
<!-- 引入 --><script src="node_modules/yach.open.yylogin/lib/yyLogin.browser.js"></script><!-- 使用 -->window;
npm 使用
// 引入;// 使用;
options
参数 | 必填 | 备注 |
---|---|---|
goto | 是 | goto 参数结构:https://yach-oapi-test.zhiyinlou.com/connect/oauth2/sns_authorize?appid=APPID&response_type=code&scope=snsapi_login&state=STATE&redirect_uri=REDIRECT_URI,并且要将goto参数urlencode编码。 |
style | 否 | 渲染二维码的区域的样式,可以自定义去除背景颜色和边框 |
width | 否 | 表示显示二维码的区域的宽 二维码大小是固定的 210px*210px |
height | 否 | 表示显示二维码的区域的 |
env | 否 | 环境:dev、test、pre、online(default) |
示例
;/* * 解释一下goto参数,参考以下例子: * const url = encodeURIComponent('http://localhost.me/index.php?test=1&aa=2'); * const goto = encodeURIComponent('https://yach-oapi-test.zhiyinlou.com/connect/oauth2/sns_authorize?appid=appid&response_type=code&scope=snsapi_login&state=STATE&redirect_uri='+url) */const obj = ;
回调
您引入的js会在获取用户扫描之后将获取的token通过window.parent.postMessage(data,'*');返回给您的网站。
data
示例:
- 扫码后返回临时登陆码
code: 'xxxxxx' type: 'loginTmpCode'
- 点击头像快速登录后返回免登码
code: 'xxxxxxxxxx' type: 'authCode'
您可以通过以下代码获取这个data:
const hanndleMessage = { const origin data = event; const origins = 'http://127.0.0.1:8000' ;// 白名单 if origins if!data || typeof data !== 'string'// Safari兼容 return console; try const code type = JSON; iftype === 'authCode'//免登码 点击头像 // xxxxxx iftype === 'loginTmpCode'// 临时登陆码 扫码 // xxxx catch error console };if typeof windowaddEventListener !== 'undefined' window; else if typeof windowattachEvent !== 'undefined' window;