JSSDK用法

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

先登录微信公众平台进入“公众号设置”的“功能设置”里填写“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: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());

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

跳转页面，传递到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>

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

<%@ 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用法的更多相关文章

JSSDK用法//////////////////zzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzzz
参照微信官方文档,调试成功之后总结如下: 步骤一:绑定域名先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”. 备注:登录后可在“开发者中心”查看对应的接口权限. 步骤二: ...
微信JS-SDK分享功能的.Net实现代码
JS-SDK接口是什么? 为了方便开发者实现微信内的网页(基于微信浏览器访问的网页)功能,比如拍照.选图.语音.位置等手机系统的能力,并方便开发者直接使用微信分享.扫一扫等微信特有的能力,微信推出了J ...
用c#开发微信 (10) JS-SDK 基本用法- 分享接口“发送到朋友”
微信JS-SDK是微信公众平台面向网页开发者提供的基于微信内的网页开发工具包.通过使用微信JS-SDK,网页开发者可借助微信高效地使用拍照.选图.语音.位置等手机系统的能力,同时可以直接使用微信分享. ...
用c#开发微信(10) JSSDK 基本用法分享接口“发送到朋友”
微信JS-SDK是微信公众平台面向网页开发者提供的基于微信内的网页开发工具包.通过使用微信JS-SDK,网页开发者可借助微信高效地使用拍照.选图.语音.位置等手机系统的能力,同时可以直接使用微信分享. ...
AppCan JSSDK模块扩展
1. 从源码开始: 我们先看源码的8188行到9525行: window.appcan && appcan.define('window',function($,export ...
微信jsSDK开发
(学习类)2015年最新微信公众平台开发微信JSSDK开发分享功能链接地址:http://blog.163.com/sdolove@126/blog/static/1146378852015132 ...
封装的通过微信JS-SDK实现自定义分享到朋友圈或者朋友的ES6类！
引言: 我们经常在做微信H5的过程中需要自定义分享网页,这个如何实现呢?请看如下的封装的ES6类及使用说明! /** * @jssdk js对象,包括appId,timestamp,nonceStr, ...
JS版微信6.0分享接口用法分析
本文实例讲述了JS版微信6.0分享接口用法.分享给大家供大家参考,具体如下: 为了净化网络,整顿诱导分享及诱导关注行为,微信于2014年12月30日发布了<微信公众平台关于整顿诱导分享及诱导关注 ...
微信公众号分享接口签名通过分享无效果（JSSDK自定义分享接口的策略调整）
为规范自定义分享链接功能在网页上的使用,自2017年4月25日起,JSSDK“分享到朋友圈”及“发送给朋友”接口,自定义的分享链接,其域名或路径必须与当前页面对应的公众号JS安全域名一致,否则将调用失 ...

随机推荐

JavaScript碎片
option option 元素定义下拉列表中的一个选项(一个条目). 浏览器将 <option> 标签中的内容作为 <select> 标签的菜单或是滚动列表中的一个元素显示. ...
（二）canvas边框问题
lineWidth 设置边框的大小 fillStyle 设置div的颜色 strokeStyle 设置边框的颜色注: 边框在不设置的情况下默认为1px 黑色,但是x,y轴的距离是以图形的正中心为原始 ...
使用stm32F4Discovery 的stlink v2给其他板子调试
不适用stm8. 1. 拔掉 CN3 的跳线帽 2.CN2 的原理图 3.按照2中的原理图和板子(核心板stm32c8t6),实际上我这边连接使用的结果是: 4. 5. 6.相关资料: 链接:ht ...
centos7怎么把语言切换成英语
一.简介在Linux的系统中经常碰到字符集导致的错误,本文总结了设置修改系统语言环境的方法步骤. 二.操作步骤执行如下指令,查看当前使用的系统语言 echo $LANG 执行如下指令,查看系统安装 ...
python 爬虫的一些使用技巧
1.最基本的抓站 import urllib2 content = urllib2.urlopen('http://XXXX').read() -2.使用代理服务器这在某些情况下比较有用,比如IP被封 ...
python3.x 函数的参数
2016-08-09 15:06:18 位置参数调用函数时,参数按照位置依次传递给函数 def show(a1,a2,a3,a4): print(a1,a2,a3,a4) show('s','h' ...
IQ信号理解
可参考http://wenku.baidu.com/link?url=Y3plyK9lgl96QowljJkWhgVaUGbH11j178DkId_vcl9z1V5cjl9ycTiB4Ym4iaypL ...
Java 多个引用类型变量引用同一个对象
引用类型变量在声明后必须引用对象才能使用. 一个引用变量只能唯一指向一个对象,但同一个对象可被多个引用类型变量引用. 如:MyDate today; //将变量跟配给一个保存引用的空间(栈) toda ...
further occurrences of HTTP header parsing errors will be logged at DEBUG level.
1. 获取参数Json的值为null String json=request.getParameter("Json"); 首先检查是否有下面的东东, 信息: Error par ...
1125 Chain the Ropes
题意:略. 思路:思考一下,最先拿去对折的绳子会参与之后的每次对折,而对一条绳子而言,对折的次数越多剩下的就越短,因此,要让最终的结果尽可能长,应该先让较短的绳子先对折. 代码: #include & ...

JSSDK用法

JSSDK用法的更多相关文章

随机推荐

热门专题