关键字：微信公众平台 JSSDK&获取地理位置接口&网页获取用户地理位置&getLocation作者：方倍工作室&原文：&&
在这篇微信公众平台开发教程中，我们将介绍如何在网页中获取用户的地理位置信息。
本文分为以下二个部分：
生成JS-SDK权限验证签名
使用地理位置接口获取坐标
一、微信JS-SDK
1. 获得Access Token
access token的获得方法在前面有介绍，详情见&
2. 获取jsapi_ticket
生成签名之前必须先了解一下jsapi_ticket，jsapi_ticket是公众号用于调用微信JS接口的临时票据。正常情况下，jsapi_ticket的有效期为7200秒，通过access_token来获取。由于获取jsapi_ticket的api调用次数非常有限，频繁刷新jsapi_ticket会导致api调用受限，影响自身业务，开发者必须在自己的服务全局缓存jsapi_ticket 。
参考以下文档获取access_token（有效期7200秒，开发者必须在自己的服务全局缓存access_token）：用第一步拿到的access_token 采用http GET方式请求获得jsapi_ticket（有效期7200秒，开发者必须在自己的服务全局缓存jsapi_ticket），接口地址如下
https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=ACCESS_TOKEN&type=jsapi
成功返回如下JSON：
"errcode":0,
"errmsg":"ok",
"ticket":"bxLdikRXVbTPdHSM05e5u5sUoXNKd8-41ZO3MhKoyN5OfkWITDGgnr2fwJ0m9E8NYzWKVZvdVtaUgWvsdshFKA",
"expires_in":7200
获得jsapi_ticket之后，就可以生成JS-SDK权限验证的签名了。
3. 签名算法实现
签名生成规则如下：参与签名的字段包括noncestr（随机字符串）, 有效的jsapi_ticket, timestamp（时间戳）, url（当前网页的URL，不包含#及其后面部分） 。对所有待签名参数按照字段名的ASCII 码从小到大排序（字典序）后，使用URL键值对的格式（即key1=value1&key2=value2&）拼接成字符串string1。这里需要注意的是所有参数名均为小写字符。对string1作sha1加密，字段名和字段值都采用原始值，不进行URL 转义。
即signature=sha1(string1)。 示例：
noncestr=Wm3WZYTPz0wzccnW
jsapi_ticket=sM4AOVdWfPE4DxkXGEs8VMCPGGVi4C3VM0P37wVUCFvkVAy_90u5h9nbSlYy3-Sl-HhTdfl2fzFy1AOcHKP7qg
timestamp=
url=http://mp.weixin.qq.com?params=value
步骤1. 对所有待签名参数按照字段名的ASCII 码从小到大排序（字典序）后，使用URL键值对的格式（即key1=value1&key2=value2&）拼接成字符串string1：
jsapi_ticket=sM4AOVdWfPE4DxkXGEs8VMCPGGVi4C3VM0P37wVUCFvkVAy_90u5h9nbSlYy3-Sl-HhTdfl2fzFy1AOcHKP7qg&noncestr=Wm3WZYTPz0wzccnW&timestamp=&url=http://mp.weixin.qq.com?params=value
步骤2. 对string1进行sha1签名，得到signature：
0f9de62fce790f9a083d5c99e95740ceb90c27ed
完整代码如下
class JSSDK {
private $appId;
private $appSecret;
public function __construct($appId, $appSecret) {
$this-&appId = $appId;
$this-&appSecret = $appSecret;
public function getSignPackage() {
$jsapiTicket = $this-&getJsApiTicket();
// 注意 URL 一定要动态获取，不能 hardcode.
$protocol = (!empty($_SERVER['HTTPS']) && $_SERVER['HTTPS'] !== 'off' || $_SERVER['SERVER_PORT'] == 443) ? "https://" : "http://";
$url = "$protocol$_SERVER[HTTP_HOST]$_SERVER[REQUEST_URI]";
$timestamp = time();
$nonceStr = $this-&createNonceStr();
// 这里参数的顺序要按照 key 值 ASCII 码升序排序
$string = "jsapi_ticket=$jsapiTicket&noncestr=$nonceStr&timestamp=$timestamp&url=$url";
$signature = sha1($string);
$signPackage = array(
=& $this-&appId,
"nonceStr"
=& $nonceStr,
"timestamp" =& $timestamp,
"signature" =& $signature,
"rawString" =& $string
return $signPackage;
private function createNonceStr($length = 16) {
$chars = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ";
$str = "";
for ($i = 0; $i & $length; $i++) {
$str .= substr($chars, mt_rand(0, strlen($chars) - 1), 1);
return $str;
private function getJsApiTicket() {
// jsapi_ticket 应该全局存储与更新，以下代码以写入到文件中做示例
$data = json_decode(file_get_contents("jsapi_ticket.json"));
if ($data-&expire_time & time()) {
$accessToken = $this-&getAccessToken();
// 如果是企业号用以下 URL 获取 ticket
// $url = "https://qyapi.weixin.qq.com/cgi-bin/get_jsapi_ticket?access_token=$accessToken";
$url = "https://api.weixin.qq.com/cgi-bin/ticket/getticket?type=jsapi&access_token=$accessToken";
$res = json_decode($this-&httpGet($url));
$ticket = $res-&
if ($ticket) {
$data-&expire_time = time() + 7000;
$data-&jsapi_ticket = $ticket;
$fp = fopen("jsapi_ticket.json", "w");
fwrite($fp, json_encode($data));
fclose($fp);
$ticket = $data-&jsapi_
return $ticket;
private function getAccessToken() {
// access_token 应该全局存储与更新，以下代码以写入到文件中做示例
$data = json_decode(file_get_contents("access_token.json"));
if ($data-&expire_time & time()) {
// 如果是企业号用以下URL获取access_token
// $url = "https://qyapi.weixin.qq.com/cgi-bin/gettoken?corpid=$this-&appId&corpsecret=$this-&appSecret";
$url = "https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=$this-&appId&secret=$this-&appSecret";
$res = json_decode($this-&httpGet($url));
$access_token = $res-&access_
if ($access_token) {
$data-&expire_time = time() + 7000;
$data-&access_token = $access_token;
$fp = fopen("access_token.json", "w");
fwrite($fp, json_encode($data));
fclose($fp);
$access_token = $data-&access_
return $access_token;
private function httpGet($url) {
$curl = curl_init();
curl_setopt($curl, CURLOPT_RETURNTRANSFER, true);
curl_setopt($curl, CURLOPT_TIMEOUT, 500);
curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, false);
curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, false);
curl_setopt($curl, CURLOPT_URL, $url);
$res = curl_exec($curl);
curl_close($curl);
return $res;
二、网页获得地理位置坐标
1. 绑定域名
先登录微信公众平台进入&公众号设置&的&功能设置&里填写&JS接口安全域名&。
2. 获取签名包
require_once "jssdk.php";
$jssdk = new JSSDK("yourAppID", "yourAppSecret");
$signPackage = $jssdk-&GetSignPackage();
3. 引入JS文件
在需要调用JS接口的页面引入如下JS文件，（支持https）：
&script src="http://res.wx.qq.com/open/js/jweixin-1.0.0.js"&&/script&
4.通过config接口注入权限验证配置
所有需要使用JS-SDK的页面必须先注入配置信息，否则将无法调用。
wx.config({
debug: false,
appId: '&?php echo $signPackage["appId"];?&',
timestamp: &?php echo $signPackage["timestamp"];?&,
nonceStr: '&?php echo $signPackage["nonceStr"];?&',
signature: '&?php echo $signPackage["signature"];?&',
jsApiList: [
// 所有要调用的 API 都要加到这个列表中
'checkJsApi',
'openLocation',
'getLocation'
5. 通过ready接口处理成功验证
地理位置需要在页面加载时就调用，需要把相关接口放在ready函数中调用来确保正确执行
wx.ready(function () {
5.1 通过checkJsApi判断当前客户端版本是否支持指定获取地理位置
wx.checkJsApi({
jsApiList: [
'getLocation'
success: function (res) {
// alert(JSON.stringify(res));
// alert(JSON.stringify(res.checkResult.getLocation));
if (res.checkResult.getLocation == false) {
alert('你的微信版本太低，不支持微信JS接口，请升级到最新的微信版本！');
5.2. 使用getLocation接口获取地理位置坐标
wx.getLocation({
success: function (res) {
var latitude = res. // 纬度，浮点数，范围为90 ~ -90
var longitude = res. // 经度，浮点数，范围为180 ~ -180。
var speed = res. // 速度，以米/每秒计
var accuracy = res. // 位置精度
cancel: function (res) {
alert('用户拒绝授权获取地理位置');
三、实现效果
弹出请求获取页面
JS成功获取地理位置参数
四、内容更新及源码下载
本节最新的教程说明及源代码已在《微信公众平台开发》一书中发布，费用仅30元，
购买地址：
阅读(...) 评论()