参考博客

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. Web大前端面试题-Day8
			
    1. 说说你对作用域链的理解? 作用域链的作用是保证执行环境里 有权访问的变量和函数是有序的, 作用域链的变量只能向上访问, 变量访问到window对象即被终止, 作用域链向下访问变量是不被允许的;  ...
    
			
    2. 
						
  2. react输入  撤销
			
    销毁阶段可以使用的函数:componentWillUnmount:在删除组件之前进行清理操作,比如计时器和事件监听器.因为这些函数都是开发者手动加上去的,react不知道,必须进行手动清理. 实例第一 ...
    
			
    3. 
						
  3. C#全能数据库操作类及调用示例
			
    C#全能数据库操作类及调用示例 using System; using System.Data; using System.Data.Common; using System.Configuratio ...
    
			
    4. 
						
  4. Winform给TextBox设置默认值
			
    Winform给TextBox设置默认值(获取焦点后默认值消失) 主要是通过TextBox的获取焦点Enter和失去焦点Leave两个事件来实现的, 思路如下: 1.设置一个字符串常量,作为TextB ...
    
			
    5. 
						
  5. BZOJ.3884.上帝与集合的正确用法(扩展欧拉定理)
			
    \(Description\) 给定p, \(Solution\) 欧拉定理:\(若(a,p)=1\),则\(a^b\equiv a^{b\%\varphi(p)}(mod\ p)\). 扩展欧拉定理 ...
    
			
    6. 
						
  6. 潭州课堂25班：Ph201805201 第十五课  迭代器，生成器  (课堂笔记)
			
    推导表达式 li1 = list() for i in range(10): # 迭代循环内容 li1.append(i) print( li1 ) ---->>> [0, 1, 2 ...
    
			
    7. 
						
  7. 用vue的自定义组件写了一个拖拽 组件,局部的 只能在自定义元素内的
			
    简单实现 没有做兼容<!DOCTYPE html> <html lang="en"> <head> <meta charset=" ...
    
			
    8. 
						
  8. 状态压缩+矩阵乘法hdu-4332-Constructing Chimney
			
    题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=4332 题目意思: 用1*1*2的长方体构造一个中间为空的底面3*3的立体烟囱. 解题思路: 实际上就 ...
    
			
    9. 
						
  9. 关于iphone6/5/4s 在iOS8.0系统下 仅仅读@3x图片
			
    做iphone6和plus适配时候发现一个问题,先来看图(一下讨论所有在真机下完毕,非模拟器) 128*750图片是  nav@2x.png watermark/2/text/aHR0cDovL2Js ...
    
			
    10. 
						
  10. Unity Shader-后处理：高斯模糊
			
    一.简介   上一篇文章学习了模糊的原理以及基本的模糊实现,对于清晰和模糊这个定义感觉还是比较说明问题,这里再贴出一下:“清晰的图片,各个像素之间会有明显的过渡,而如果各个像素之间的差距不是很大,那么 ...
    
			
    11.