JS SDK
JS SDK 2020是微博开放平台最新的升级版,它较之前版本有较大改变:
- 1、聚焦移动端H5场景,去除了原来PC时代的旧组件;
- 2、分享功能,适配多场景,无论是在微博、微信、手机浏览器,还是PC上,都可以方便使用;
- 3、采用开放标签,样式完全由开发者自己控制;
- 4、更加安全,因此去除了原来的JS前端直接授权、直接调接口的功能,防止数据外泄,相应的页面授权需求,需要开发者按照标准授权流程接入,调用开放接口则需要放在服务端完成;
下面我们来一起体验一下这些特性。
开发指南
如果你没有AppKey请先在开放平台网站,注册自己的应用,申请入口。
1、绑定安全域名
在使用JS SDK 2020时,需要为该应用绑定安全域名,其中微博客户端JS 接口将以此域名来进行校验。
绑定安全域名的操作可以在 我的应用 的 高级信息 页面完成。
2、引用JS SDK 2020文件
在你的页面部署 wbsdk.js 文件,同时,如果你的页面编码不是UTF-8,请添加charset="utf-8"属性。
HTML
<script src="https://open.weibo.com/views/js/wbsdk.js" type="text/javascript" charset="utf-8"></script>
3、初始化JS SDK 2020
调用JSSDK访问API接口。
Javascript
WB2.anyWhere(function(W){ W.parseCMD("/users/show.json", function(sResult, bStatus){ try{ //to do something... }catch(e){} },{ uid: '123456789' }{ method: 'get' }); });
如果你的应用处于开发调试过程,建议使用JS SDK 2020的调试模式,可以在初始化时,配置 debug 为 true,开启调试模式,此时在调用出错时,出错信息将通过 alert 弹出,方便在移动端调试。
JS
wb.init({ debug: false, ... });
开放标签
开放标签类似原来的组件,目前主要就是分享功能。
分享开放标签
分享当前页面到微博,适配各种场景。
示例
HTML
<wb-share-button>分享到微博</wb-share-button>
开放标签中的样式,完全由开发者自己控制,例如。
HTML
<wb-share-button><div class="myStyle">分享到微博</div></wb-share-button>
指定分享的内容和页面地址,可以通过 data:title,data:url 属性标签完成自定义,例如。
HTML
<wb-share-button data:title="title" data:url="url">分享到微博</wb-share-button>
如果需要在分享的时候,指定一张分享图片,需要先将图片上传到微博图床,然后再开放标签上指定图片的PID,例如。
HTML
<wb-share-button data:pid="53b515f0ly1glgemvpjwfj20gi0aw114">分享到微博</wb-share-button>
内容聚合流开放标签
按照关键词,输入一个内容聚合流。
示例
HTML
<wb-topic-timeline data:keyword="王者荣耀" data:height="500"></wb-topic-timeline>
其中,data:keyword 属性为需要指定的关键词,data:height 属性为显示 view 的高度。
微博客户端JS 接口说明
微博客户端JS 接口。
wb.getNetworkType
获取网络类型。
示例
Javascript
WB2.logout(function() { //callback function });
参数说明
参数名称 | 类型 | 说明描述 |
---|---|---|
success | Function | 调用成功后的回调函数。 |
fail | Function | 调用失败后的回调函数。 |
wb.setBrowserTitle
设置页面标题。
示例
Javascript
WB2.logout(function() { //callback function });
参数说明
参数名称 | 类型 | 说明描述 |
---|---|---|
success | Function | 调用成功后的回调函数。 |
fail | Function | 调用失败后的回调函数。 |
wb.setSharingContent
设置在微博内分享到微信的内容。
示例
Javascript
参数说明
参数名称 | 类型 | 说明描述 |
---|---|---|
success | Function | 调用成功后的回调函数。 |
fail | Function | 调用失败后的回调函数。 |
示例
Javascript
参数说明
参数名称 | 类型 | 说明描述 |
---|---|---|
success | Function | 调用成功后的回调函数。 |
fail | Function | 调用失败后的回调函数。 |