微信JS-SDK介绍
微信JS-SDK是微信公众平台面向网页开发者提供的基于微信内的网页开发工具包。

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

本次的内容:

实现:分享到朋友圈,qq,qq空间,微信朋友的功能。

基础接口

判断当前客户端版本是否支持指定JS接口
wx.checkJsApi({
jsApiList: [‘chooseImage’], // 需要检测的JS接口列表,所有JS接口列表见附录2,
success: function(res) {
// 以键值对的形式返回,可用的api值true,不可用为false
// 如:{“checkResult”:{“chooseImage”:true},“errMsg”:“checkJsApi:ok”}
}
});
备注:checkJsApi接口是客户端6.0.2新引入的一个预留接口,第一期开放的接口均可不使用checkJsApi来检测。

获取“分享到朋友圈”按钮点击状态及自定义分享内容接口
wx.onMenuShareTimeline({
title: ‘’, // 分享标题
link: ‘’, // 分享链接
imgUrl: ‘’, // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
});
获取“分享给朋友”按钮点击状态及自定义分享内容接口
wx.onMenuShareAppMessage({
title: ‘’, // 分享标题
desc: ‘’, // 分享描述
link: ‘’, // 分享链接
imgUrl: ‘’, // 分享图标
type: ‘’, // 分享类型,music、video或link,不填默认为link
dataUrl: ‘’, // 如果type是music或video,则要提供数据链接,默认为空
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
});
获取“分享到QQ”按钮点击状态及自定义分享内容接口
wx.onMenuShareQQ({
title: ‘’, // 分享标题
desc: ‘’, // 分享描述
link: ‘’, // 分享链接
imgUrl: ‘’, // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
});
获取“分享到腾讯微博”按钮点击状态及自定义分享内容接口
wx.onMenuShareWeibo({
title: ‘’, // 分享标题
desc: ‘’, // 分享描述
link: ‘’, // 分享链接
imgUrl: ‘’, // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
});
获取“分享到QQ空间”按钮点击状态及自定义分享内容接口
wx.onMenuShareQZone({
title: ‘’, // 分享标题
desc: ‘’, // 分享描述
link: ‘’, // 分享链接
imgUrl: ‘’, // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
});

第二部分:分享方法的实现。

那么,我们如何来实现这个分享内容呢?

JSSDK使用步骤
步骤一:绑定域名

  1. 先登录微信公众平台 ,登录后可在“开发者中心”查看对应的接口权限。

说明了有这个分享的权限。

  1. 进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。

js域名,一般不用http这样的开头。

步骤二:引入JS文件

在需要调用JS接口的页面引入如下JS文件,(支持https):http://res.wx.qq.com/open/js/jweixin-1.0.0.js

请注意,如果你的页面启用了https,务必引入 https://res.wx.qq.com/open/js/jweixin-1.0.0.js ,否则将无法在iOS9.0以上系统中成功使用JSSDK

如需使用摇一摇周边功能,请引入 jweixin-1.1.0.js

备注:支持使用 AMD/CMD 标准模块加载方法加载

步骤三:通过config接口注入权限验证配置
所有需要使用JS-SDK的页面必须先注入配置信息,否则将无法调用(同一个url仅需调用一次,对于变化url的SPA的web app可在每次url变化时进行调用,目前Android微信客户端不支持pushState的H5新特性,所以使用pushState来实现web app的页面会导致签名失败,此问题会在Android6.2中修复)。

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

注意,我这里只是动态获取,并没有做缓存,如果有需要的同学,需要做一些缓存。

获取微信config

/*** 方法名:getWxConfig</br>* 详述:获取微信的配置信息 </br>* 开发人员:souvc </br>* 创建时间:2016-1-5 </br>* * @param request* @return 说明返回值含义*/public static Map<String, Object> getWxConfig(HttpServletRequest request){Map<String, Object> ret = new HashMap<String, Object>();String requestUrl = request.getRequestURL().toString();String access_token = "";String jsapi_ticket = "";String timestamp = Long.toString(System.currentTimeMillis() / 1000); // 必填,生成签名的时间戳String nonceStr = UUID.randomUUID().toString(); // 必填,生成签名的随机串String url = String.format(BasicSysCodeService.getTicketUrl(), accessToken.getAccessToken());JSONObject json = httpsRequest(url, "GET", null);if (json != null){jsapi_ticket = json.getString("ticket");}String signature = "";// 注意这里参数名必须全部小写,且必须有序String sign ="jsapi_ticket=" + jsapi_ticket + "&noncestr=" + nonceStr + "&timestamp=" + timestamp + "&url=" + requestUrl;try{MessageDigest crypt = MessageDigest.getInstance("SHA-1");crypt.reset();crypt.update(sign.getBytes("UTF-8"));signature = byteToHex(crypt.digest());}catch (Exception e){e.printStackTrace();}ret.put("appId", BasicSysCodeService.getAppId());ret.put("timestamp", timestamp);ret.put("nonceStr", nonceStr);ret.put("signature", signature);return ret;}/*** 方法名:byteToHex</br>* 详述:字符串加密辅助方法 </br>* 开发人员:souvc </br>* 创建时间:2016-1-5 </br>* * @param hash* @return 说明返回值含义*/private static String byteToHex(final byte[] hash){Formatter formatter = new Formatter();for (byte b : hash){formatter.format("%02x", b);}String result = formatter.toString();formatter.close();return result;}/*** 发送https请求** @param requestUrl 请求地址* @param requestMethod 请求方式(GET、POST)* @param outputStr 提交的数据* @return JSONObject(通过JSONObject.get(key)的方式获取json对象的属性值)*/private static JSONObject httpsRequest(String requestUrl, String requestMethod, String outputStr){JSONObject jsonObject = null;try{// 创建SSLContext对象,并使用我们指定的信任管理器初始化TrustManager[] tm = {new MyX509TrustManager()};SSLContext sslContext = SSLContext.getInstance("SSL", "SunJSSE");sslContext.init(null, tm, new java.security.SecureRandom());// 从上述SSLContext对象中得到SSLSocketFactory对象SSLSocketFactory ssf = sslContext.getSocketFactory();URL url = new URL(requestUrl);HttpsURLConnection conn = (HttpsURLConnection)url.openConnection();conn.setSSLSocketFactory(ssf);conn.setDoOutput(true);conn.setDoInput(true);conn.setUseCaches(false);// 设置请求方式(GET/POST)conn.setRequestMethod(requestMethod);// 当outputStr不为null时向输出流写数据if (null != outputStr){OutputStream outputStream = conn.getOutputStream();// 注意编码格式outputStream.write(outputStr.getBytes("UTF-8"));outputStream.close();}// 从输入流读取返回内容InputStream inputStream = conn.getInputStream();InputStreamReader inputStreamReader = new InputStreamReader(inputStream, "utf-8");BufferedReader bufferedReader = new BufferedReader(inputStreamReader);String str = null;StringBuffer buffer = new StringBuffer();while ((str = bufferedReader.readLine()) != null){buffer.append(str);}// 释放资源bufferedReader.close();inputStreamReader.close();inputStream.close();inputStream = null;conn.disconnect();jsonObject = JSONObject.fromObject(buffer.toString());}catch (ConnectException ce){log.error("连接超时:{}", ce);}catch (Exception e){log.error("https请求异常:{}", e);}return jsonObject;}
  @RequestMapping(value = "/getJssdk.do")public String getJssdk(Model model,HttpServletRequest request){Map<String, Object> map = CommonUtil.getWxConfig(request);model.addAttribute("appId", map.get("appId"));model.addAttribute("timestamp", map.get("timestamp"));model.addAttribute("nonceStr", map.get("nonceStr"));model.addAttribute("signature", map.get("signature"));return "weixin";}
<%@ page language="java" import="java.util.*" contentType="text/html; charset=utf-8"  pageEncoding="utf-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8"><title>欢迎访问搜投网  www.souvc.com </title></head>
<body>欢迎访问!</body><script type="text/javascript" src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script type="text/javascript">// 微信信息的以及调用的配置wx.config({debug: false,appId: '${appId}',timestamp: '${timestamp}',nonceStr: '${nonceStr}',signature: '${signature}',jsApiList: ['onMenuShareTimeline', 'onMenuShareAppMessage','onMenuShareQQ','onMenuShareWeibo','onMenuShareQZone']});wx.ready(function(){// 获取“分享到朋友圈”按钮点击状态及自定义分享内容接口wx.onMenuShareTimeline({title: 'java微信公共号——服务器开发', // 分享标题link:"https://blog.csdn.net/dfgakldsjkl/article/details/996210",imgUrl: "http://images.cnblogs.com/cnblogs_com/liuhongfeng/737147/o_1442809977405.jpg" // 分享图标});// 获取“分享给朋友”按钮点击状态及自定义分享内容接口wx.onMenuShareAppMessage({title: 'java微信公共号——消息的接受与响应', // 分享标题desc: "java微信公共号——消息的接受与响应", // 分享描述link:"https://blog.csdn.net/dfgakldsjkl/article/details/99639653",imgUrl: "http://images.cnblogs.com/cnblogs_com/liuhongfeng/737147/o_QQ%E5%9B%BE%E7%89%8720151118180508.png", // 分享图标type: 'link', // 分享类型,music、video或link,不填默认为link});//获取“分享到QQ”按钮点击状态及自定义分享内容接口wx.onMenuShareQQ({title: 'java微信公众号——定时获取access_token', // 分享标题desc: 'java微信公众号——定时获取access_token', // 分享描述link: 'https://blog.csdn.net/dfgakldsjkl/article/details/99671431', // 分享链接imgUrl: 'http://images.cnblogs.com/cnblogs_com/liuhongfeng/737147/o_qrcode_for_gh_228cd30523bc_258.jpg', // 分享图标success: function () {// 用户确认分享后执行的回调函数},cancel: function () {// 用户取消分享后执行的回调函数}});//获取“分享到腾讯微博”按钮点击状态及自定义分享内容接口wx.onMenuShareWeibo({title: 'java微信公共号——获取微信用户的基本信息', // 分享标题desc: 'java微信公共号——获取微信用户的基本信息', // 分享描述link: 'https://blog.csdn.net/dfgakldsjkl/article/details/99620569', // 分享链接imgUrl: 'http://images.cnblogs.com/cnblogs_com/liuhongfeng/737147/o_qrcode_for_gh_228cd30523bc_258.jpg', // 分享图标success: function () {// 用户确认分享后执行的回调函数},cancel: function () {// 用户取消分享后执行的回调函数}});//获取“分享到QQ空间”按钮点击状态及自定义分享内容接口wx.onMenuShareQZone({title: 'java微信公众号——授权获取用户信息', // 分享标题desc: 'java微信公众号——授权获取用户信息', // 分享描述link: 'https://blog.csdn.net/dfgakldsjkl/article/details/99730890', // 分享链接imgUrl: 'http://images.cnblogs.com/cnblogs_com/liuhongfeng/737147/o_qrcode_for_gh_228cd30523bc_258.jpg', // 分享图标success: function () {// 用户确认分享后执行的回调函数},cancel: function () {// 用户取消分享后执行的回调函数}});});
</script></html>

java微信公众号——微信JS-SDK的使用相关推荐

  1. python微信库有哪些_GitHub - zwczou/weixin-python: 微信SDK - 包括微信支付,微信公众号,微信登陆,微信消息处理等...

    微信SDK 提供微信登陆,公众号管理,微信支付,微信消息的全套功能 文档目录 如果需要单独使用其中的某些模块,可以见文档目录的具体模块 如果需要组合在一起可以参考快速开始 目录 安装 使用pip su ...

  2. 如何编辑微信公众号(微信公众号内容制作流程)

    如何编辑微信公众号(微信公众号内容制作流程) 一.关于申请事项的常见问题概述 1 .注册要花钱吗? 微信官方账号注册完全免费. 微信官方账号唯一需要交钱的地方就是年度认证费.作为个人账户,目前没有认证 ...

  3. 微信公众号/微信小程序获取用户信息以及推送微信模版消息_MQ

    微信公众号/微信小程序获取用户信息以及推送微信模版消息_MQ 一.获取用户信息 1.首先我们需要了解什么是微信用户的OpenID 在关注者与公众号产生消息交互后,公众号可获得关注者的OpenID(加密 ...

  4. 自动获取微信公众号微信文章信息(每日自动推送)

    自动获取微信公众号微信文章信息 目录 前言 一.获取文章列表 二.自动化获取微信公众号cookie 1.影刀自动登录微信 2.获取公众号cookie 1.安装mitmproxy 2.配合切换代理脚本, ...

  5. 实现微信公众号微信头像上传

    这次我们做的项目需要实现一个微信公众号头像上传并且剪裁的功能,实在没有头绪,之后通过网上搜索和自己的修改实现了一个适合我们这个框架的方法. 首先本次项目我们的页面用的事velocity框架,页面代码是 ...

  6. 微信公众号微信搜索好物和服务器,你一定不知道还可以用这样的方法阅读微信公众号内容...

    搜索 通过搜狗微信公众平台搜索,可以搜索微信或是公众号内容.也就是说,如果你想了解公众号上关于某个关键词都有些什么内容,用这个方法就可以找到: 订阅 有人习惯用RSS订阅网上的内容,可是微信并未提供这 ...

  7. 如何推广微信公众号 微信公众号推广技巧

    在2012年中国互联网大会上,腾讯公司董事会主席兼首席执行官马化腾表示,微信在去年年初推出,仅仅用了14个月,在今年三月份超过1亿的注册用户,目前微信已经达到2亿用户.微信的火不亚于当年的微博,从微信 ...

  8. 个人怎么申请微信公众号-微信公众号使用教程33

    在以前的<秦子恒微信课堂>中, 子恒老师介绍公众号是以公司申请并认证的, 但是随着公众号的普及, 很多个人也申请了公众号, 并且运营得非常好. 有学员问是否可以介绍下个人公众号方面的内容, ...

  9. 微信公众号-微信事件推送未正确响应

    目录 前景提要 问题解决 正确的响应结果 前景提要 上篇文章说到,最近遇到一连串微信公众号相关的问题,这次记录的是微信事件推送未正确响应引起警报的问题 这个警报的问题,是从微信警报群里暴露出来的(可在 ...

最新文章

  1. oracle cdc 提交顺序,Oracle CDC部署流程
  2. AI一分钟|锤子发布TNT系统和Pro 2S;美团点评将在9月20日左右正式登陆港交所
  3. 如何将JavaScript数组信息导出到csv(在客户端)?
  4. python 使用socks 爬虫_小白学 Python 爬虫(17):Requests 基础使用
  5. 2022-03-19
  6. 用户体验五要素_Kwai竞品分析-用户体验五要素
  7. 站点分析基础概念之目标转化率
  8. [Leedcode][JAVA][第136题][第137题][只出现一次的数字][位运算][HashSet][HashMap]
  9. Apache和Nginx下禁止访问特定的目录或文件
  10. mysql operator_mysql-operator容器化部署mysql8
  11. Android 手机设置CMWAP 接入点
  12. Linux中级之负载均衡(lvs,nginx,haproxy)、中间件
  13. 用c语言实现窗口化,c怎么窗口化只能开挂吗
  14. 复旦女神陈果:孤独是一个人的狂欢,在你寂寞时请关注这些公众号充实自己
  15. 【Luogu1879】玉米田
  16. 淘宝特价版将接入微信 腾讯会松口吗?
  17. IE7兼容and工作总结
  18. 黑苹果 服务器系统安装教程,黑苹果安装教程,详细教您黑苹果怎么安装
  19. Epson修复Epson错误代码0xf1
  20. TC358743xbg是一颗将HDMI信号转换成MIPI CSI2的芯片

热门文章

  1. mysql master slave区别_mysql master/slave 使用感受
  2. 卷积神经网络预测比利时车标
  3. android自定义View之(六)------高仿华为荣耀3C的圆形刻度比例图(ShowPercentView)
  4. 常用简单算法-质因数分解
  5. Linux:使用ps-grep-awk批量kill杀进程
  6. oracle sql获取本季度,oracle sql 获取本季度所有月份,上季度所有月份
  7. 使用erlang实现P2P磁力搜索-实现
  8. 04 【布局之Overscroll Behavior 定位偏移量】
  9. IT男的一次中年破局尝试--出书
  10. 【第48题】常用的数学工具类5-指数与对数运算