微信JS-SDK,提供给开发者的基于微信内的网页开发工具包

使用微信JS-SDK,网页开发者可借助微信高效地使用拍照、选图、语音、位置等手机系统的能力,同时可以直接使用微信分享、扫一扫、卡券、支付等微信特有的能力

使用步骤

1、绑定域名

微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”

2、引入JS文件

在需要调用JS接口的页面引入如下JS文件 http://res.wx.qq.com/open/js/jweixin-1.4.0.js

3、通过config接口注入权限验证配置

所有需要使用JS-SDK的页面必须先注入配置信息,否则将无法调用

wx.config({
debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: '', // 必填,公众号的唯一标识
timestamp: , // 必填,生成签名的时间戳
nonceStr: '', // 必填,生成签名的随机串
signature: '',// 必填,签名
jsApiList: [] // 必填,需要使用的JS接口列表
});

4、通过ready接口处理成功验证

wx.ready(function(){
// config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中。
});

5、通过error接口处理失败验证

wx.error(function(res){
// config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。
});

6、先检查是否为微信浏览器

var isWeixin = function () {
//判断是否是微信
var ua = navigator.userAgent.toLowerCase();
return ua.match(/MicroMessenger/i) == "micromessenger";
};

如果是微信,则请求后端接口获取签名并配置config

  if (isWeixin()) {
// share
var url = location.href;
$.post('/api/weixin/getSignpackage', { url: url }, function (data) {
var option = JSON.parse(data);
wx.config({
// debug: true,
appId: option.appId,
timestamp: option.timestamp,
nonceStr: option.nonceStr,
signature: option.signature,
jsApiList: [
]
});
});
}

微信分享

原有的 wx.onMenuShareTimeline、wx.onMenuShareAppMessage、wx.onMenuShareQQ、wx.onMenuShareQZone 接口,即将废弃

最新接口为户端6.7.2及JSSDK 1.4.0以上版本支持的 wx.updateAppMessageShareData、updateTimelineShareData 接口

  • 自定义“分享给朋友”及“分享到QQ”按钮的分享内容(1.4.0)
wx.ready(function () {   //需在用户可能点击分享按钮前就先调用
wx.updateAppMessageShareData({
title: '', // 分享标题
desc: '', // 分享描述
link: '', // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: '', // 分享图标
success: function () {
// 设置成功
}
});
  • 自定义“分享到朋友圈”及“分享到QQ空间”按钮的分享内容(1.4.0)
wx.ready(function () {      //需在用户可能点击分享按钮前就先调用
wx.updateTimelineShareData({
title: '', // 分享标题
link: '', // 分享链接,该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: '', // 分享图标
success: function () {
// 设置成功
}
});

相关文档

微信JS-SDK说明文档

微信分享JS-SDK的更多相关文章

  1. 微信分享JS接口失效说明及解决方案

    关键字:微信分享 JS 失效  分享到朋友圈 微信分享JS接口目前已失效,以前可以自定义分享的标题.描述.图片.链接地址在微信6.0.2版本中失效. 官方回复如下: 旧版的获取分享状态及设置分享内容的 ...

  2. 微信企业号JS SDK

    微信企业号JS SDK <?php define('CorpID', "wx82e2c31215d9a5a7"); define('CorpSecret', "&q ...

  3. 微信分享接口SDK简介使用

    很久没做移动端活动了,想不少人都参与过微信里面的活动,既然活动就少不了分享.那我就行一个前端的角度说说如何实现微信分享的吧. 对应微信分享,现在已有公共接口,微信的开发者文档SDK:https://m ...

  4. 微信分享JS函数(原创)[已失效]

    //微信内置浏览器分享事件 //来自:http://www.cnblogs.com/cielwater //分享朋友圈事件 //UpdateWeixinJSBridge(CircleModel[Jso ...

  5. 微信前端js sdk以外的开发

    此时页面中就会出现刚才我画红圈部分的工具条. 这个工具条再加上上面的标题栏工具条. 极大的降低了可视区域的面积. 是否能将它去掉呢?答案是能够的.增加以下代码就能够去掉微信中以下的工具条: docum ...

  6. 调用微信js sdk

    场景:需要调用微信获取当前位置的借口. 途径:查看微信 https://mp.weixin.qq.com/wiki?t=resource/res_main&id=mp1421141115 .后 ...

  7. VueJs单页应用实现微信网页授权及微信分享功能

    在实际开发中,无论是做PC端.WebApp端还是微信公众号等类型的项目的时候,或多或少都会涉及到微信相关的开发,最近公司项目要求实现微信网页授权,并获取微信用户基本信息的功能及微信分享的功能,现在总算 ...

  8. Android 微信分享图文资料

    上个项目做Android的微信分享,需要分享的内容有图片有文字,看了微信分享的SDK,貌似没有这个API,在网上搜了好久,总算找到解决方法了,直接上代码: public void sendReq(Co ...

  9. 微信分享 API

    微信分享 API https://market.cmbchina.com/MPage/online/190416201200302/wechatShare.js /* * 注意: * 1. 所有的JS ...

  10. 微信JS SDK配置授权,实现分享接口

    微信开放的JS-SDK面向网页开发者提供了基于微信内的网页开发工具包,最直接的好处就是我们可以使用微信分享.扫一扫.卡券.支付等微信特有的能力.7月份的时候,因为这个分享的证书获取问题深深的栽了一坑, ...

随机推荐

  1. 实践中 XunSearch(讯搜)的使用教程步骤

    XunSearch(讯搜)的使用教程步骤 一.安装编译工具 yum install make gcc g++ gcc-c++ libtool autoconf automake imake mysql ...

  2. UNIX笔记 第二天

    一.进程的退出: exit(3) _exit(2) atexit(3)  onexit(3) 二.进程资源的回收:wait(2) waitpid(2) 三.加载新的可执行程序: exec函数族 exe ...

  3. Django积木块六——验证用户是否登录

    验证用户是否登录 # 开始在用户登录的时候验证结束后login登录 # request.user.is_authenticated() {% if request.user.is_authentica ...

  4. Appium之xpath定位元素

    原文:http://www.cnblogs.com/cnkemi/p/9180525.html appium也是以webdriver为基的,对于元素的定位也基本一致,只是增加一些更适合移动平台的独特方 ...

  5. VUE最佳实践

    vuex 作为model数据请求由action来获取,页面组建级的发送action,返回promise给组建使用,如果使用周期较长需comit到mutation保存到state. 数据分模块,根据业务 ...

  6. python图形界面编程

    EasyGui(easygui-docs-0.96\tutorial\index.html) import easygui as g import sys while 1: g.msgbox('mes ...

  7. 使用PowerShell快速部署Win12R2虚拟化桌面

    PowerShell一直是微软windows_Server产品中重要的一部分,可以通过PowerShell来完成所有的服务器配置,甚至一些在图形界面下无法完成的事情.随着每一个新版本的微软产品或者服务 ...

  8. phantomjs的安装和使用链接

    1.先下载phantomjs并解压2.将phantomjs的bin目录配置到环境变量中3.测试phantomjs,cmd下输入phantomjs进入 (按 Ctrl + c 组 合键退出和 phant ...

  9. day_11函数的形参与实参

    昨天讲了函数的定义和简单分类 1:什么是函数:具体特定功能的代码快 --特定功能代码作为一个整体,并给该整体命名,就是函数. 函数的优点: 1:减少代码的冗余 2:结构清晰,可读性强 3:具有复用性, ...

  10. C#常用工具类——Excel操作类(ZT)

    本文转载于: http://www.cnblogs.com/zfanlong1314/p/3916047.html /// 常用工具类——Excel操作类 /// <para> ----- ...