参考博客

http://blog.csdn.net/u013142781/article/details/50503299

主要JS 方法

wx.getLocation

获取地理位置信息传递参数

成功后返回参数

根据返回经纬度打开地理位置网页

wx.openLocation 参数设置



关键代码：


后台 - 构造微信验证消息




private static String appId = PropertiesUtil.getValue("common.properties", "app.id");


　　 
    @RequestMapping(value = "/get_jsapi_ticket")

    @ResponseBody

    public Map<String, Object> getJsapiTicket(

            HttpServletRequest request, HttpServletResponse response,

            HttpSession session, String url) throws IOException {

        Map<String, Object> jsapiSignature = createJsapiSignature(url);

        jsapiSignature.put("appId", appId);

        return jsapiSignature;

    }

    public Map<String, Object> createJsapiSignature(String url) {

        Map<String, Object> map = new HashMap<String, Object>();

        //准备参数

        String base_access_token = redisService.getBaseTokenFromRedis(appId, appSecret);

        JSONObject jsApiTicket = WeixinUtil.getJsApiTicket(base_access_token);

        String ticket = jsApiTicket.get("ticket").toString();

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

        String nonceStr = createNonceStr(16);

        //sha1加密

        String requesturl = "jsapi_ticket=" + ticket + "&noncestr=" + nonceStr + "&timestamp=" + timestamp + "&url=" + url;

        log.info("requesturl=" + requesturl);

        String signature = SHA1(requesturl);

        log.info("signature=" + signature);

        map.put("timestamp", timestamp);

        map.put("nonceStr", nonceStr);

        map.put("signature", signature);

        return map;

    }

    /**

     * SHA、SHA1加密

     *

     * @param str

     * @return

     */

    public static String SHA1(String str) {

        try {

            MessageDigest digest = java.security.MessageDigest

                    .getInstance("SHA-1"); //如果是SHA加密只需要将"SHA-1"改成"SHA"即可

            digest.update(str.getBytes());

            byte messageDigest[] = digest.digest();

            // Create Hex String

            StringBuffer hexStr = new StringBuffer();

            // 字节数组转换为 十六进制 数

            for (int i = 0; i < messageDigest.length; i++) {

                String shaHex = Integer.toHexString(messageDigest[i] & 0xFF);

                if (shaHex.length() < 2) {

                    hexStr.append(0);

                }

                hexStr.append(shaHex);

            }

            return hexStr.toString();

        } catch (NoSuchAlgorithmException e) {

            e.printStackTrace();

        }

        return null;

    }

    /**

     * 构造随机字符串

     *

     * @param length

     * @return

     */

    private static String createNonceStr(int length) {

        String baseStr = "abcdefghijklmnopqrstuvwxyzABCDEFGHIJKLMNOPQRSTUVWXYZ0123456789";

        StringBuffer temp = new StringBuffer();

        Random random = new Random();

        for (int i = 0; i < length; i++) {

            int number = random.nextInt(baseStr.length());

            temp.append(baseStr.charAt(number));

        }

        return temp.toString();

    }




前端 - 发送请求并解析地理位置信息




<%@ page contentType="text/html;charset=UTF-8" language="java" %>

<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<c:set var="ctx" value="${pageContext.request.contextPath}"/>

<!DOCTYPE html>

<html>

<head>

    <meta charset="utf-8" />

    <title>绑定页</title>

</head>

<body>

<a href="javascript:;" onclick="getLocation()">获取我的位置信息</a>

<script src="${ctx}/assets/jquery-1.10.2.min.js"></script>

<script src="${ctx}/assets/jweixin-1.2.0.js"></script>

<script type="text/javascript">

    $(function(){

        configWx();

    });

    function configWx() {

        var thisPageUrl = location.href.split('#')[0];

        $.get(

                "${ctx}/oauth/get_jsapi_ticket",

                {url:thisPageUrl},

                function(data){

                    console.log(data);

                    if(data!=null){

                        configWeiXin(data.appId, data.timestamp, data.nonceStr,

                                data.signature);

                    }else {

                        console.log("配置weixin jsapi失败");

                    }

                }

        );

    }

    function configWeiXin(appId, timestamp, nonceStr, signature) {

        wx.config({

            debug : true,// 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。

            appId : appId,

            timestamp : timestamp,

            nonceStr : nonceStr,

            signature : signature,

            jsApiList : [ 'chooseImage', 'uploadImage', 'downloadImage',

                'previewImage', 'openLocation', 'getLocation',

                'scanQRCode', 'checkJsApi', 'onMenuShareTimeline',

                'onMenuShareAppMessage', 'onMenuShareQQ',

                'onMenuShareWeibo', 'onMenuShareQZone' ]

        });

        console.log("wx");

        console.log(wx);

    }

    function getLocation() {

        wx.getLocation({

            type : 'gcj02', // 默认为wgs84的gps坐标，如果要返回直接给openLocation用的火星坐标，可传入'gcj02'

            success : function(res) {

                //使用微信内置地图查看位置接口

                wx.openLocation({

                    latitude : res.latitude, // 纬度，浮点数，范围为90 ~ -90

                    longitude : res.longitude, // 经度，浮点数，范围为180 ~ -180。

                    name : '我的位置', // 位置名

                    address : '中国海洋大学', // 地址详情说明

                    scale : 28, // 地图缩放级别,整形值,范围从1~28。默认为最大

                    infoUrl : 'http://www.haiyangdaxue.com' // 在查看位置界面底部显示的超链接,可点击跳转（测试好像不可用）

                });

            },

            cancel : function(res) {

            }

        });

    }

</script>

</body>

</html>


												


											
[微信开发] 微信JSAPI - 获取用户地理位置信息的更多相关文章
	

    
								
  1. 【微信小程序】获取用户地理位置权限，二次请求授权，逆解析获取地址
		
    摘要:微信小程序内获取用户地理位置信息授权,被拒绝后二次获取,获取权限后逆解析得到用户所在省市区等.. 场景:商城类小程序,在首页时需展示附近门店,即用户刚进入小程序时就需要获取到用户位置信息 ste ...
    
		
    2. 
						
  2. JSSDK获取用户地理位置信息
		
    复制一份JSSDK环境,创建一份index.html文件,结构如图7.1所示. 图7.1  7.1节文件结构 在location.js中,封装“getLocation”接口,如下: 01  wxJSS ...
    
		
    3. 
						
  3. 微信开发笔记：获取用户openid，以及用户头像昵称等信息
		
    微信开发的时候有一个很便利的途径来进行一个用户的一步注册登录,就是使用用户的微信信息来直接进行登陆,可以省去很多不必要的麻烦.那具体这些信息是如何来获取的呢? 首先呢,我们需要对微信进行一个授权,让微 ...
    
		
    4. 
						
  4. 微信小程序授权获取用户详细信息openid
		
    小程序获取用户的头像昵称openid之类 第一种使用wx.getUserInfo直接获取微信头像,昵称 wx.getUserInfo({ success: function (res) { that. ...
    
		
    5. 
						
  5. 微信小程序open-data获取用户的信息样式设置
		
    效果图 wxml代码 <view class="userinfo"> <!-- 用户头像 --> <view class="userinfo ...
    
		
    6. 
						
  6. [扩展推荐] Laravel 中利用 GeoIP 获取用户地理位置信息
		
    我最近需要一个用户地域检测来设置用户的默认区域和货币.由 Daniel Stainback 创建的 torann/geoip  很好地满足为Laravel 5 项目提供 GeoIP 服务的要求. 这个 ...
    
		
    7. 
						
  7. 根据ip获取用户地理位置
		
    各大网站都提供根据ip获取用户地理位置信息,这里以新浪的接口为例子 接口地址为:http://int.dpool.sina.com.cn/iplookup/iplookup.php?format=js ...
    
		
    8. 
						
  8. [微信小程序] 微信小程序获取用户定位信息并加载对应城市信息，wx.getLocation，腾讯地图小程序api，微信小程序经纬度逆解析地理信息
		
    因为需要在小程序加个定位并加载对应城市信息 然而小程序自带api目前只能获取经纬度不能逆解析,虽然自己解析方式,但是同时也要调用地图,难道用户每次进小程序还要强行打开地图选择地址才定位吗?多麻烦也不利 ...
    
		
    9. 
						
  9. php 微信登录 公众号 获取用户信息 微信网页授权
		
    php 微信登录 公众号 获取用户信息 微信网页授权 先自己建立两个文件: index.php  和  getUserInfo.php index.php <?php //scope=snsap ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. BZOJ.1016.[JSOI2008]最小生成树计数(Matrix Tree定理 Kruskal)
			
    题目链接 最小生成树有两个性质: 1.在不同的MST中某种权值的边出现的次数是一定的. 2.在不同的MST中,连接完某种权值的边后,形成的连通块的状态是一样的. \(Solution1\) 由这两个性 ...
    
			
    2. 
						
  2. BZOJ.4542.[HNOI2016]大数(莫队)
			
    题目链接 大数除法是很麻烦的,考虑能不能将其条件化简 一段区间[l,r]|p,即num[l,r]|p,类似前缀,记后缀suf[i]表示[i,n]的这段区间代表的数字 于是有 suf[l]-suf[r+ ...
    
			
    3. 
						
  3. BZOJ.3510.首都(LCT 启发式合并 树的重心)
			
    题目链接 BZOJ 洛谷 详见这. 求所有点到某个点距离和最短,即求树的重心.考虑如何动态维护. 两棵子树合并后的重心一定在两棵树的重心之间那条链上,所以在合并的时候用启发式合并,每合并一个点检查sz ...
    
			
    4. 
						
  4. 潭州课堂25班：Ph201805201 爬虫高级 第四课 sclapy 框架 crawispider类  (课堂笔记）
			
    以上内容以 spider 类 获取 start_urls 里面的网页 在这里平时只写一个,是个入口,之后 通过 xpath 生成 url,继续请求, crawispider 中 多了个  rules  ...
    
			
    5. 
						
  5. 使用pickle模块存储对象
			
    import time import hashlib import pickle import os class Info(): def __init__(self): self.create_tim ...
    
			
    6. 
						
  6. 关于Oracle游标out参数多层调用的BUG，ORA-06504
			
    数据库版本 Oracle Database 10g Enterprise Edition Release 10.2.0.1.0 - 64bit 测试代码 declare p_cur sys_refcu ...
    
			
    7. 
						
  7. Django缓存1
			
    1. 开发调试 # 此为开始调试用,实际内部不做任何操作 # 配置: CACHES = { 'default': { 'BACKEND': 'django.core.cache.backends.du ...
    
			
    8. 
						
  8. java工具类,在Windows,Linux系统获取电脑的MAC地址、本地IP、电脑名
			
    package com.cloudssaas.util; import java.io.BufferedReader; import java.io.IOException; import java. ...
    
			
    9. 
						
  9. 【荐】详解 golang 中的 interface 和 nil
			
    golang 的 nil 在概念上和其它语言的 null.None.nil.NULL一样,都指代零值或空值.nil 是预先说明的标识符,也即通常意义上的关键字.在 golang 中,nil 只能赋值给 ...
    
			
    10. 
						
  10. AngularJS中处理多个promise
			
    在使用AngularJS中处理promise的时候,有时会碰到需要处理多个promise的情况. 最简单的处理就是每个promise都then.如下: var app = angular.module ...
    
			
    11.