官方教程：教你用好微信JS-SDK接口

 

微信开放JS-SDK接口，开发者和行业用户可谓是欢欣鼓舞、奔走相告，目测将激起一大波第三方开发商的创新产品！真真是H5开发者的利好！但也有用户表示，还不了解JS-SDK接口到底是啥，究竟怎么用。现在，小编就通过大量实战案例为大家逐一讲解，争取让大家都会用、且用好JS-SDK接口，赶紧往下看吧！

 

 

1、分享类接口：支持获取“分享到朋友圈”、“发送给朋友”、“分享到QQ”和“分享到微博”按钮的用户点击状态，同时支持自定义分享内容。

 

 

小编解读：说起分享接口应用，最常见的莫过于公众号文章分享。通过分享按钮，用户可以将自己喜欢的文章分享给微信好友，也可分享到微信朋友圈。
通过此次开放的分享接口，开发者获得了新的能力：可以在用户分享时，为其设置个性化的分享图片、标题、描述等，从而使分享的内容更生动有趣，以获得更好的传播效果。
同时，通过此接口，开发者还可以获知用户是否分享了网页，帮助其更好地评估网页服务是否受用户喜爱等。

 

 

 

2、图像类接口：支持拍照，并从手机相册选择、上传、下载和预览图片。

 

小编解读：“云打印”已开通了图像类接口，用户可以自由选择、打印手机相册中已有的照片，或是即时拍摄一张照片。打印前，可通过大图预览确认照片选择是否有误。

 

这实际上帮助开发者在网页上流畅、低成本地实现了选图或拍照的功能，也为用户带去了更好的使用体验。

 

 

大家熟悉的“印美图”，就是通过图像类接口，接收用户上传的照片，从而帮助用户完成打印服务。今后，运营者、商家通过H5页面发起照片征集等活动时，图像类接口也能帮上忙了。

 

 

3、音频类接口：支持语音的录制、播放和暂停播放，同时支持将语音快速上传到云端服务器，或从云端服务器将语音快速下载到网页。

 

 

小编解读：“微邮筒”早前已开通了音频类接口，用户在制作明信片时，可以同时录一段语音。当亲朋好友或自己收到明信片时，扫一扫明信片上的二维码，即可收听该段语音。

 

 

如此一来，语音就脱离了手机存储的限制，用户在任何时候、通过任何帐号，只要打开微信扫码即可获取语音片段，让记忆更坚固、长久。

 

 

4、智能类接口：支持将语音快速地转换成文字。开发者无需掌握语音识别相关技术，只需简单引用微信JS-SDK提供的方法即可实现。

 

小编解读：微信的语音输入、语音转文字功能已上线有段时间了，受到用户的广泛好评。
事实上，TA能做的还有更多。比如“付费通账单查缴”就借此为用户提供了“语音缴费”服务。用户不用按键，对着手机说出账单户号，就像平时用微信跟朋友聊天一样，然后点击“确认”即缴费成功，可谓是“躺着都可以完成”。便捷的缴费体验赢得了用户的青睐，该帐号上线仅仅5天，就拥了11539名用户，交易成功1862笔，交易金额达到20万元。
因此，语音识别等智能类接口的开放，对一些开发能力稍弱的运营方来说，无疑是重大利好。

 

 

5、设备信息类接口：支持获取当前手机设备的网络状态，如2G、3G、4G或Wi-Fi，为用户提供流畅的浏览体验。

 

小编解读：精心设计的界面、互动体验，如果因为用户手机网络原因而无法呈现，出现跳转迟缓、显示不全等状况，不仅白白浪费了运营者的前期努力，也容易挫伤用户参与积极性，留下不佳的印象。如果能够获取用户当前手机设备状态，通过技术手段加以干预，比如根据设备网络状态推送合适的网页版本，那么将大大减少此类状况的发生，用户体验也将更有保障。

 

6、地理位置类接口：支持获取用户的地理位置信息（前提是获得用户同意），支持使用微信的内置地图查看器，查看地理位置或导航。

 

小编解读：“大众点评”已将地理位置功能应用得相当成熟，当用户发起团购美食、电影票、订酒店等需求时，“大众点评”可以立即根据用户实时位置，向用户展示其位置周边相应商家。用户打开相关商品、服务详情页后，还可点击商家地址，调出地图、查询导航指引。

 

 

7、界面操作类接口：支持隐藏或显示微信内置浏览器“右上角菜单”、“分享到朋友圈”、“发送给朋友”、“复制链接”等指定按钮，支持关闭当前网页窗口并返回公众号会话。

 

 

小编解读：众所周知，点击微信界面右上角的“···”，将打开微信所有的菜单按钮，但对不同类型的商家、活动来说，并非所有菜单按钮都有用，冗余的按钮反而会耽误时间，干扰用户选择。界面操作类接口的开放，能帮助运营者关闭不需要的按钮，优化选择界面，也能提升用户操作效率。

 

 

8、微信扫一扫接口：支持使用微信扫一扫，扫描一维码或二维码，并将用户扫码内容交由微信处理或返回给网页由网页处理。

 

小编解读：除了扫街景、翻译，微信扫一扫在购物中的应用也已十分广泛，京东、当当等许多网站均支持微信扫码支付结算，用户在逛街时，通过微信扫描商品条形码，亦可即时查询到线上购买价格。

 

 

除此之外，微信扫一扫亦可扫实物。微信与Panda.W在广州花城大道开展的“微信扫熊猫”图象识别合作，首创通过实物、3D图形加入微信扫码新功能，用户直接扫描实物，就能进入相应的商品售卖页面，开始购物。从看见到购买、售后无缝对接，大大缩短用户犹豫期，帮助商家有效促进了销售。

 

 

9、微信小店接口：支持从网页跳转到指定的微信小店商品页，支持浏览商品的详细信息，支持完整的购买、客服等流程。

 

小编解读：花心思做了H5推广页面，用户还得通过扫码、加关注、找入口，才能开始购买商品？太慢了！今后，用户只需轻轻一点，就能直接打开相应微信小店的商品详情页，光速完成详情查询和咨询、购买。

 

 

10、微信卡券接口：支持批量添加卡券、调起使用门店卡券列表及获取用户选择列表。

 

小编解读：简而言之，通过这个能力，商家能批量添加多种卡券，并直接为用户展示其附近的门店能够使用那些卡券，引导其选择领取。同时，通过对后台“用户选择列表”进行数据分析，能够快速了解相应商圈的用户喜好、整体产品受欢迎程度等，比如XX小区附近用户更爱“牛堡+姜饮”，以便后期的商品调配与优化经营。

 

 

11、微信支付接口：支持有支付权限的公众号在网页发起一个微信支付请求。

 

小编解读：在某些场景下，相对于图文消息，网页多样化的呈现形式更能满足运营者的需求。如“腾讯公益”，需要向用户介绍项目进程、项目详情等，信息量较大，同时又需要兼顾用户捐款的便捷性，因此，在网页能够直接发起微信支付请求的需求非常迫切。如今，用户在查看完“腾讯公益”各项目介绍内容后，已能直接在网页底部点击捐款按钮，就能立即通过微信支付进行捐款。

 

 

附微信开放JS-SDK接口权限列表：