参照微信官方文档,调试成功之后总结如下:
步骤一:绑定域名

先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。
备注:登录后可在“开发者中心”查看对应的接口权限。
步骤二:引入JS文件

在需要调用JS接口的页面引入如下JS文件,(支持https):http://res.wx.qq.com/open/js/jweixin-1.0.0.js
备注:支持使用 AMD/CMD 标准模块加载方法加载
步骤三:写代码

//初始化定义(在页面js里面)
wx.config({
debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: '', // 必填,公众号的唯一标识--->用户的微信公众号appid
timestamp: '', // 必填,生成签名的时间戳--->系统自己生成的时间戳。
nonceStr: '', // 必填,生成签名的随机串--->系统本地生成的UUID。
signature: '',// 必填,签名,见附录1
jsApiList: [] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2--->一大串CC+CV
});
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9

为了获取上述参数如下操作
获取参数流程==========================================================================

1:https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=‘自己申请的公众号appid’&secret=’自己申请的公众号secret’
根据appid和secret返回的json格式数据
获取access_token;(涉及访问量,根据2小时限制需要缓存在本地 !)

2:https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=‘上一步access_token’&type=jsapi
根据上一步返回的access_token
获取jsapi_ticket;(涉及访问量,根据2小时限制需要缓存在本地 !)

3: 获取nonce_str=UUID.randomUUID().toString();

获取timestamp=Long.toString(System.currentTimeMillis() / 1000);

获取url=request.getRequestURL();

获取signature

   string1=(jsapi_ticket+nonce_str+timestamp+url)//注意这里参数名必须全部小写,且必须有序-->MessageDigest类
a)MessageDigest crypt = MessageDigest.getInstance("SHA-1");
b)crypt.reset();
c)crypt.update(string1.getBytes("UTF-8"));
d)signature = byteToHex(crypt.digest());
  • 1
  • 2
  • 3
  • 4
  • 5

获取成功==================================================================================

跳转页面,传递到wx.config()中去。demo.jsp

<script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script> //初始化定义
var sd=${result.timestamp};
wx.config({
debug: false ,
appId: '${result.appId}',
timestamp: '${timestamp}',
nonceStr: '${appId}',
signature: '${signature}',
jsApiList: [
'onMenuShareTimeline',
'onMenuShareAppMessage',
'onMenuShareQQ',
'onMenuShareWeibo',
'hideMenuItems',
'showMenuItems',
'hideOptionMenu',
'showOptionMenu'
]
}); wx.ready(function () { //地理位置
wx.getLocation({
success: function (res) {
var latitude = res.latitude; // 纬度,浮点数,范围为90 ~ -90
var longitude = res.longitude; // 经度,浮点数,范围为180 ~ -180。
var speed = res.speed; // 速度,以米/每秒计
var accuracy = res.accuracy; // 位置精度
alert("latitude : "+latitude+"--longitude : "+longitude+"--speed : "+speed+"--accuracy : "+accuracy);
}
}); </script>
  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38

应一哥们要求,我把我自己调试用的例子发出
=========例子===========

<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<%@taglib uri="/struts-tags" prefix="s"%>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>syShaoyj1990</title> <script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"></script>
<script> var sd=${result.timestamp};
//初始化定义
wx.config({
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。
appId: '${result.appId}', // 必填,公众号的唯一标识--->用户的微信公众号appid
timestamp: sd, // 必填,生成签名的时间戳--->系统自己生成的时间戳。
nonceStr: '${result.nonceStr}', // 必填,生成签名的随机串--->系统本地生成的UUID。
signature: '${result.signature}',// 必填,签名,见附录1
jsApiList: ['onMenuShareTimeline',
'onMenuShareAppMessage',
'onMenuShareQQ',
'onMenuShareWeibo',
'startRecord',
'stopRecord',
'onVoiceRecordEnd',
'playVoice',
'pauseVoice',
'stopVoice',
'onVoicePlayEnd',
'uploadVoice',
'downloadVoice',
'chooseImage',
'previewImage',
'uploadImage',
'downloadImage',
'translateVoice',
'getNetworkType',
'openLocation',
'getLocation',
'hideOptionMenu',
' showOptionMenu',
' hideMenuItems',
'showMenuItems',
' hideAllNonBaseMenuItem',
' showAllNonBaseMenuItem',
' closeWindow',
' scanQRCode',
' chooseWXPay',
' openProductSpecificView',
' addCard',
' chooseCard',
'openCard'] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2--->一大串CC+CV
}); wx.config({
debug: false ,
appId: '${result.appId}',
timestamp: sd,
nonceStr: '${result.nonceStr}',
signature: '${result.signature}',
jsApiList: [
'onMenuShareTimeline',
'onMenuShareAppMessage',
'onMenuShareQQ',
'onMenuShareWeibo',
'hideMenuItems',
'showMenuItems',
'hideOptionMenu',
'showOptionMenu'
]
}); </script> <script>
wx.ready(function () {
//分享到qq
wx.onMenuShareQQ({
title: '分享到qq', // 分享标题
desc: '', // 分享描述
link: '', // 分享链接
imgUrl: '', // 分享图标
success: function () {
// 用户确认分享后执行的回调函数
},
cancel: function () {
// 用户取消分享后执行的回调函数
}
}); //地理位置
wx.getLocation({
success: function (res) {
var latitude = res.latitude; // 纬度,浮点数,范围为90 ~ -90
var longitude = res.longitude; // 经度,浮点数,范围为180 ~ -180。
var speed = res.speed; // 速度,以米/每秒计
var accuracy = res.accuracy; // 位置精度
alert("latitude : "+latitude+"--longitude : "+longitude+"--speed : "+speed+"--accuracy : "+accuracy);
}
}); //分享到朋友圈
wx.onMenuShareTimeline({
title: 'syj,分享到朋友圈测试!',
link: 'http://shaoyj1990.sinaapp.com',
imgUrl: 'http://image.baidu.com/detail/newindex?col=%E8%B5%84%E8%AE%AF&tag=%E5%A8%B1%E4%B9%90&pn=0&pid=5759608761913747677&aid=&user_id=10086&setid=-1&sort=0&newsPn=0&star=%E5%80%AA%E5%A6%AE&fr=&from=1',
success: function (res) {
alert("ok");
}
}); //分享给朋友
wx.onMenuShareAppMessage({
title: 'syj,分享给朋友测试!',
desc: '地球一小时,让地球母亲休息一小时!',
link: 'http://www.baidu.com',
imgUrl: 'http://www.baidu.com',
success: function (res) {
alert("ok");
}
}); }); </script>
</head>
<body>
<button id="getLocation">click</button>
</body>
</html>

JSSDK用法//////////////////zzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzz的更多相关文章

  1. JSSDK用法

    参照微信官方文档,调试成功之后总结如下: 步骤一:绑定域名 先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”. 备注:登录后可在“开发者中心”查看对应的接口权限. 步骤二: ...

  2. 微信JS-SDK分享功能的.Net实现代码

    JS-SDK接口是什么? 为了方便开发者实现微信内的网页(基于微信浏览器访问的网页)功能,比如拍照.选图.语音.位置等手机系统的能力,并方便开发者直接使用微信分享.扫一扫等微信特有的能力,微信推出了J ...

  3. 用c#开发微信 (10) JS-SDK 基本用法- 分享接口“发送到朋友”

    微信JS-SDK是微信公众平台面向网页开发者提供的基于微信内的网页开发工具包.通过使用微信JS-SDK,网页开发者可借助微信高效地使用拍照.选图.语音.位置等手机系统的能力,同时可以直接使用微信分享. ...

  4. 用c#开发微信(10) JSSDK 基本用法 分享接口“发送到朋友”

    微信JS-SDK是微信公众平台面向网页开发者提供的基于微信内的网页开发工具包.通过使用微信JS-SDK,网页开发者可借助微信高效地使用拍照.选图.语音.位置等手机系统的能力,同时可以直接使用微信分享. ...

  5. AppCan JSSDK模块扩展

    1.      从源码开始: 我们先看源码的8188行到9525行: window.appcan && appcan.define('window',function($,export ...

  6. 微信jsSDK开发

    (学习类)2015年最新微信公众平台开发 微信JSSDK开发分享功能 链接地址:http://blog.163.com/sdolove@126/blog/static/1146378852015132 ...

  7. 封装的通过微信JS-SDK实现自定义分享到朋友圈或者朋友的ES6类!

    引言: 我们经常在做微信H5的过程中需要自定义分享网页,这个如何实现呢?请看如下的封装的ES6类及使用说明! /** * @jssdk js对象,包括appId,timestamp,nonceStr, ...

  8. JS版微信6.0分享接口用法分析

    本文实例讲述了JS版微信6.0分享接口用法.分享给大家供大家参考,具体如下: 为了净化网络,整顿诱导分享及诱导关注行为,微信于2014年12月30日发布了<微信公众平台关于整顿诱导分享及诱导关注 ...

  9. 微信公众号 分享接口 签名通过 分享无效果(JSSDK自定义分享接口的策略调整)

    为规范自定义分享链接功能在网页上的使用,自2017年4月25日起,JSSDK“分享到朋友圈”及“发送给朋友”接口,自定义的分享链接,其域名或路径必须与当前页面对应的公众号JS安全域名一致,否则将调用失 ...

随机推荐

  1. jQuery的.bind()、.live()和.delegate()之间区别

    摘要:jQuery的.bind()..live()和.delegate()之间的区别并非总是那么明显的,然而,如果我们对所有的不同之处都有清晰的理解的话,那么这将会有助于我们编写出更加简洁的代码,以及 ...

  2. 规约模式Specification的学习

    最近一直在看DDD开发  规约似乎用得很普遍. 但是还是理解不了.所以记录下学习的进度.- 规约(Specification)模式 目的:查询语句和查询条件的分离 写了一个关于规约的模拟小程序 cla ...

  3. html()、text()、val()、innerHTML、value()的区分

    以上的方法可用于一般的html标签(div)与input中分别进行讨论 1.html(): jQuery方法,用于一般标签中,可读写,可以获得写入html标签. 2.text(): jQuery方法, ...

  4. *HDU2510 DFS

    符号三角形 Time Limit: 2000/1000 MS (Java/Others)    Memory Limit: 32768/32768 K (Java/Others)Total Submi ...

  5. c++利用循环数组建立FIFO模板队列

    可直接编译运行,其中status()方法效果如图: #include <iostream> using std::cout; template<typename T> clas ...

  6. 启用apache,发现80端口被占用【已解决】

    前段时间停止了Apache,结果在打开的时候发现无法打开,80端口被占用,于是win+r 运行cmd 输入netstat -ano 可以看到80端口被PID4占用,于是打开任务管理器-进程-查看,选择 ...

  7. 下载更新文件后,调用安装器自动安装apk文件

    在更新操作时,下载新apk之后,往往需要自动安装新apk,用以下代码即可安装下载在本地的apk文件(apkFile) Intent intent = new Intent(); intent.setA ...

  8. css定位 与position

    本文同时发表于本人个人网站 www.yaoxiaowen.com 在正式讨论position之前,我们需要知道几个概念. 块元素:独占一行的元素.比如div,h1~h6,p等,它是自带换行的. 内联元 ...

  9. MYSQL实现主从复制

    mysql主(称master)从(称slave)复制的原理:       (1).master将数据改变记录到二进制日志(binary log)中,也即是配置文件log-bin指定的文件(这些记录叫做 ...

  10. oracle中函数和存储过程的区别和联系【转载竹沥半夏】

    oracle中函数和存储过程的区别和联系[转载竹沥半夏] 在oracle中,函数和存储过程是经常使用到的,他们的语法中有很多相似的地方,但也有自己的特点.刚学完函数和存储过程,下面来和大家分享一下自己 ...