参考博客

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. DataGridView控件-[引用]
			
    DataGridView控件 DataGridView是用于Windows Froms 2.0的新网格控件.它可以取代先前版本中DataGrid控件,它易于使用并高度可定制,支持很多我们的用户需要的特 ...
    
			
    2. 
						
  2. [Visual Studio] 未能完成操作 不支持此接口
			
    vs2017添加引用时提示“未能完成操作 不支持此接口”, 一般情况下的处理办法:vs2017修复.修复是指重新安装,修改是指版本更新. 如果修复后仍然存在该问题,说明vs2017安装成功后部分功能未 ...
    
			
    3. 
						
  3. Javascript 函数声明先提升还是变量先提升
			
    大家都知道js 分为词法阶段 和执行阶段 也知道它是因为var变量和函数声明会提升 但是你知道他们两个谁先提升的吗 测试一下 function test(){ alert(4); } var test ...
    
			
    4. 
						
  4. JVM Debugger Memory View for IntelliJ IDEA
			
    Posted on August 19, 2016 by Andrey Cheptsov Every day we try to find new ways to improve developer  ...
    
			
    5. 
						
  5. VMware DHCP Service服务无法启动问题的解决
			
    我的电脑出现VMware DHCP Service和VMware NAT Service两个服务无法启动的问题: 打开VMware主界面,菜单->编辑->虚拟网络编辑器: 勾选上“将主机虚 ...
    
			
    6. 
						
  6. redis 基本信息查询
			
    在客户端可以用telnet命令 telnet ip port 再输入info 返回如下信息:
    
			
    7. 
						
  7. eclipse default handler IHandler interface “the chosen operation is not enabled”
			
    NOTE: These two methods: Tip: Subclass AbstractHandler rather than implementing IHandler. but you ca ...
    
			
    8. 
						
  8. domino server端的Notes.ini详解
			
    Web代理监控与调式问题     Web代理在服务器的执行优先级是最高的,由Web代理引发的服务器宕机现象很多,但是我们很难监控Web代理的运行.通过对notes.ini的研究可以通过如下途径进行处理 ...
    
			
    9. 
						
  9. Mysql 8 常用命令测试
			
    1.创建数据库,帐号及授权 create database testdb; CREATE USER 'rusking'@'%' IDENTIFIED BY '12345678'; CREATE USE ...
    
			
    10. 
						
  10. Linux内核编译与安装
			
    2013-04-16    Linux内核介绍  Linux内核是一个用C语言写成的,符合POSIX标准的类Unix操作系统.内核是操作系统中最基本的一部分,提供了众多应用程序访问计算机硬件的机制.L ...
    
			
    11.