微信JSSDK
首先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。要记得哦。
先看后端操作，基于thinkphp5，
/*
微信JS-SDK配置
*/
public function share(){
$ticket = getJsapiTicket(getAccessToken(APPID,SECRET));//获取token_assecc并通过token_access获取ticket
$noncestr = 'Wm3WZYTPz0sddenW';//随机字符串，可自定义随机生成16位字符串方法
$time = time();//时间戳，要和加载到模板的保持一致
$url = 'http://www.XXXXX.com/index/index/share';//分享的链接，用于生成签名，微信官方会检查你调用js-api的接口和这个是否一致
$getSignatrue = 'jsapi_ticket='.$ticket.'&noncestr='.$noncestr.'×tamp='.$time.'&url='.$url;//拼接这些信息，用于生成签名
$signature = sha1($getSignatrue);//通过sha1()方法生成签名，此方法为微信内置方法
return $this->fetch('share',['time'=>$time,'noncestr'=>$noncestr,'signature'=>$signature,'appid'=>APPID]);
}这里的APPID和SECRET是在入口文件定义的常量，如下
// 微信AppID和AppSecret
define('APPID', 'wx8fc5311118f2dfb3');
define('SECRET', '97f96488de1111194dfc86f0e287a969');getAccessToken()方法是我封装的一个方法，放在thinkphp5的公共方法文件里就可以，可以参考微信开发动态获取access_token，反正微信开发离不开获取token_access.
接下来是前端模板
<html>
<head>
<title>
标题
title>
<script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js">script>
head>
<body>
<a href="javascript:void(0);" onclick="getLocation()"><h1>获取地理位置接口h1>a><br />
<a href="javascript:void(0);" onclick="openLocation()"><h1>使用微信内置地图查看位置接口h1>a><br />
<a href="javascript:void(0);" onclick="onMenuShareTimeline()"><h1>分享到朋友圈h1>a><br />
<a href="javascript:void(0);" onclick="onMenuShareAppMessage()"><h1>分享给朋友h1>a><br />
<a href="javascript:void(0);" onclick="chooseImage()"><h1>拍照或从手机相册中选图接口h1>a><br />
<a href="javascript:void(0);" onclick="getNetworkType()"><h1>获取网络状态接口h1>a><br />
<a href="javascript:void(0);" onclick="scanQRCode()"><h1>调起微信扫一扫接口h1>a><br />
<a href="javascript:void(0);" onclick="closeWindow()"><h1>关闭当前网页窗口接口h1>a>
body>
<script>
wx.config({
debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: '{$appid}', // 必填，公众号的唯一标识
timestamp: '{$time}', // 必填，生成签名的时间戳
nonceStr: '{$noncestr}', // 必填，生成签名的随机串
signature: '{$signature}',// 必填，签名
jsApiList: [
'onMenuShareTimeline', //分享到朋友圈
'onMenuShareAppMessage', //分享给朋友
'scanQRCode', //调起微信扫一扫接口
'getLocation', //获取地理位置接口
'chooseImage', //拍照或从手机相册中选图接口
'getNetworkType', //获取网络状态接口
'openLocation', //使用微信内置地图查看位置接口
'closeWindow', //关闭当前网页窗口接口
] // 必填，需要使用的JS接口列表
});
wx.ready(function(){
// config信息验证后会执行ready方法，所有接口调用都必须在config接口获得结果之后，config是一个客户端的异步操作，所以如果需要在页面加载时就调用相关接口，则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口，则可以直接调用，不需要放在ready函数中。
//判断当前客户端版本是否支持指定JS接口
// wx.checkJsApi({
// jsApiList: ['onMenuShareTimeline','onMenuShareAppMessage'], // 需要检测的JS接口列表，所有JS接口列表见附录2,
// success: function(res) {
// // 以键值对的形式返回，可用的api值true，不可用为false
// // 如：{"checkResult":{"chooseImage":true},"errMsg":"checkJsApi:ok"}
// alert('该api可用');
// }
// });
wx.onMenuShareAppMessage({
title: 'this is title', // 分享标题
desc: 'this is desc', // 分享描述
link: 'http://music.163.com', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: 'http://pic.616pic.com/ys_b_img/00/66/73/9KnqqgZBFe.jpg', // 分享图标
type: 'link', // 分享类型,music、video或link，不填默认为link
dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
success: function () {
// 用户点击了分享后执行的回调函数
alert('分享好友成功');
},
cancel: function (res) {
alert('分享好友已取消');
},
fail: function (res) {
alert(JSON.stringify(res));
}
});
wx.onMenuShareTimeline({
title: 'this is title', // 分享标题
link: 'http://music.163.com', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: 'http://pic.616pic.com/ys_b_img/00/66/73/9KnqqgZBFe.jpg', // 分享图标
success: function () {
// 用户点击了分享后执行的回调函数
alert('分享朋友圈成功');
}
});
});
// config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。
wx.error(function(res){
alert('config错误');
});
//分享到朋友圈
function onMenuShareTimeline(){
wx.onMenuShareTimeline({
title: 'this is title', // 分享标题
link: 'http://music.163.com', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: 'http://pic.616pic.com/ys_b_img/00/66/73/9KnqqgZBFe.jpg', // 分享图标
success: function () {
// 用户点击了分享后执行的回调函数
alert('分享朋友圈成功');
}
});
alert('onMenuShareTimeline');
}
//获取地理位置接口
function getLocation(){
wx.getLocation({
type: 'wgs84', // 默认为wgs84的gps坐标，如果要返回直接给openLocation用的火星坐标，可传入'gcj02'
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);
}
});
}
//调起微信扫一扫接口
function scanQRCode(){
wx.scanQRCode({
needResult: 0, // 默认为0，扫描结果由微信处理，1则直接返回扫描结果，
scanType: ["qrCode","barCode"], // 可以指定扫二维码还是一维码，默认二者都有
success: function (res) {
// var result = res.resultStr; // 当needResult 为 1 时，扫码返回的结果
}
});
}
//拍照或从手机相册中选图接口
function chooseImage(){
wx.chooseImage({
count: 1, // 默认9
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
success: function (res) {
var localIds = res.localIds; // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
alert(localIds);
}
});
}
//分享至好友
function onMenuShareAppMessage(){
wx.onMenuShareAppMessage({
title: 'this is title', // 分享标题
desc: 'this is desc', // 分享描述
link: 'http://music.163.com', // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
imgUrl: 'http://pic.616pic.com/ys_b_img/00/66/73/9KnqqgZBFe.jpg', // 分享图标
type: 'link', // 分享类型,music、video或link，不填默认为link
dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
success: function () {
// 用户点击了分享后执行的回调函数
alert('分享好友成功');
},
cancel: function (res) {
alert('分享好友已取消');
},
fail: function (res) {
alert(JSON.stringify(res));
}
});
}
//获取网络状态
function getNetworkType(){
wx.getNetworkType({
success: function (res) {
var networkType = res.networkType; // 返回网络类型2g，3g，4g，wifi
}
});
}
//使用微信内置地图查看位置接口
function openLocation(){
wx.openLocation({
latitude: 0, // 纬度，浮点数，范围为90 ~ -90
longitude: 0, // 经度，浮点数，范围为180 ~ -180。
name: '', // 位置名
address: '', // 地址详情说明
scale: 1, // 地图缩放级别,整形值,范围从1~28。默认为最大
infoUrl: 'http://music.163.com' // 在查看位置界面底部显示的超链接,可点击跳转
});
}
//关闭当前网页窗口接口
function closeWindow(){
wx.closeWindow();
}
script>
html>