1.公众号配置。

2.引入js

一个放在根目录下的txt文件。

3.1)第一个ajax为获取后台传给的wx.config需要的参数;wx.ready().通过ready接口处理成功验证.然后才是wx.getLocation().获取到经度纬度之后,调用百度地图api,然后将获取的经纬度参数传到api接口,返回对应的city和province;

2)因为是微信授权的api,所以登陆的时候需要获取之前扫码进入时候带的微信code等信息,编码转换问题,encodeURIComponent(location.href.split('#')[0]),获取进入时候的url?号后的参数;

 $.ajax({
type:"get",
url:config.api+"/user/JsApiCheck?url="+encodeURIComponent(location.href.split('#')[0]),
dataType: 'json',
async: false,
   contentType: "application/json; charset=utf-8",
success:function(msg){
console.log(msg.data.jsApiCheck); wx.config({
debug: true, // 开启调试模式
appId: msg.data.jsApiCheck.appId, // 必填,公众号的唯一标识
timestamp:msg.data.jsApiCheck.timestamp , // 必填,生成签名的时间戳
nonceStr: msg.data.jsApiCheck.noncestr, // 必填,生成签名的随机串
signature: msg.data.jsApiCheck.sign,// 必填,签名,
jsApiList: ["getLocation"] // 必填,需要使用的JS接口列表,
}) } });
var latitude,
longitude;
wx.ready(function(){
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; // 位置精度 },fail:function(res){
alert(res);
},complete:function(res){
/* alert("complete"+JSON.stringify(res)); */
latitude = res.latitude; // 纬度,浮点数,范围为90 ~ -90
longitude = res.longitude; // 经度,浮点数,范围为180 ~ -180。
getlat(); } }); }) function getlat(){
$.ajax({
type:"get",
url:"http://api.map.baidu.com/geocoder/v2/?callback=renderReverse&location="+latitude+","+longitude+"&output=json&pois=1&ak=XXHuea5MbHQVRH6DoLCme5QQiYAxnNng",
dataType: 'jsonp',
async: false,
   contentType: "application/json; charset=utf-8",
success:function(res){
/*alert(JSON.stringify(res));*/
alert(res.result.addressComponent.province);
alert(res.result.addressComponent.city); //初始化
var Storage=window.localStorage;
Storage.setItem('province',res.result.addressComponent.province);
Storage.setItem('city',res.result.addressComponent.city); },error:function(res){ alert("error"+JSON.stringify(res));
}
}); }

wx获取地理位置的更多相关文章

  1. 【原创】微信公众号与HTML 5混合模式揭秘3——JSSDK获取地理位置

    微信公众号与HTML 5混合模式揭秘1——如何部署JSSDK 微信公众号与HTML 5混合模式揭秘2——分享手机相册中照片 JSSDK为开发者提供了两个位置API服务:获取地理位置和使用微信内置地图查 ...

  2. 转:微信开发获取地理位置实例(java,非常详细,附工程源码)

    微信开发获取地理位置实例(java,非常详细,附工程源码)   在本篇博客之前,博主已经写了4篇关于微信相关文章,其中三篇是本文基础: 1.微信开发之入门教程,该文章详细讲解了企业号体验号免费申请与一 ...

  3. Java微信公众平台开发之获取地理位置

    本部分需要用到微信的JS-SDK,微信JS-SDK是微信公众平台面向网页开发者提供的基于微信内的网页开发工具包.通过使用微信JS-SDK,网页开发者可借助微信高效地使用拍照.选图.语音.位置等手机系统 ...

  4. 微信开发获取地理位置实例(java,非常详细,附工程源码)

    在本篇博客之前,博主已经写了4篇关于微信相关文章,其中三篇是本文基础: 1.微信开发之入门教程,该文章详细讲解了企业号体验号免费申请与一些必要的配置,以及如何调用微信接口. 2.微信开发之通过代理调试 ...

  5. 微信js-sdk开发获取签名和获取地理位置接口示例

    ###微信js-sdk开发获取签名和获取地理位置接口示例 前言:在做微信公众号开发时需要获取用户的地理位置信息,之前通过高德或者百度.腾讯等地图的api时发现经常获取不到,毕竟第三方的东西,后来改为采 ...

  6. 微信获取地理位置转城市demo

    <script type="text/javascript" src="https://res.wx.qq.com/open/js/jweixin-1.0.0.js ...

  7. 微信js获取地理位置

    1.绑定域名 先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”. 备注:登录后可在“开发者中心”查看对应的接口权限. 2.引入js文件 <script type=&q ...

  8. 微信公众平台网页开发实战--3.利用JSSDK在网页中获取地理位置(HTML5+jQuery)

    复制一份JSSDK环境,创建一份index.html文件,结构如图7.1所示. 图7.1  7.1节文件结构 在location.js中,封装“getLocation”接口,如下: 01 wxJSSD ...

  9. 微信小程序获取地理位置

    小程序只支持获取当前位置的经纬度,并不能直接获取到地理名称,需要通过第三方来逆地址解析,这里我选择的是腾讯位置服务 在使用前需要去申请key,这里是地址:https://lbs.qq.com/cons ...

随机推荐

  1. 【学习总结】Git学习-GIT工作流-千峰教育(来自B站)

    Git工作流指南 - av32575602 文档资料 目录: 1-什么是版本控制系统 2-工作流简介 3-集中式工作流 4-功能分支工作流 5-GitFlow工作流 小记: 初看差点放弃了,不过后面还 ...

  2. Linux nfs下载安装与简单配置

    1.什么是NFS? 全称 network file system 网络文件系统 通过网络存储和组织文件的一种方法或机制. 2.为什么要用共享存储? 前端所有的应用服务器接收到用户上传的图片.文件.视频 ...

  3. Oracle篇 之 查询行及概念

    Oracle: s_emp   s_dept  s_region 行:Row(tuple) 列:Column(attribute) conn:改变用户 Drop:删除用户  drop user bri ...

  4. Android学习第8天

    进程的概念 a)        四大组件都运行在主线程中 b)        服务是没有界面的,可理解为没有界面的Activity c)         进程的优先级 i.              ...

  5. MT【320】依次动起来

    已知$ BC=6,AC=2AB, $点$ D $满足$ \overrightarrow{AD}=\dfrac{2x}{x+y}\overrightarrow{AB}+\dfrac{y}{2(x+y)} ...

  6. Hdoj 2149.Public Sale 题解

    Problem Description 虽然不想,但是现实总归是现实,Lele始终没有逃过退学的命运,因为他没有拿到奖学金.现在等待他的,就是像FarmJohn一样的农田生涯. 要种田得有田才行,Le ...

  7. luogu4705玩游戏

    题解 我们要对于每个t,求一个(1/mn)sigma(ax+by)^t. 把系数不用管,把其他部分二项式展开一下: simga(ax^r*by^(t-r)*C(t,r)). 把组合数拆开,就变成了一个 ...

  8. Hadoop基础-镜像文件(fsimage)和编辑日志(edits)

    Hadoop基础-镜像文件(fsimage)和编辑日志(edits) 作者:尹正杰 版权声明:原创作品,谢绝转载!否则将追究法律责任. 一.查看日志镜像文件(如:fsimage_00000000000 ...

  9. 【VS】VS2013 未找到与约束contractname 匹配的导出

    #事故现场 今天win10更新后,打开vs2013新建项目报错: #解决方案: 1.控制面板->程序->程序和功能,找到 Entity Framework Tools for Visual ...

  10. 金融量化分析【day112】:初识量化交易

    一.摘要 为什么需要量化交易? 量化交易是做什么? 量化交易的价值何在? 做量化交易需要什么? 聚宽是什么? 零基础如何快速入门量化交易? 自测与自学 二.量化交易比传统交易强多少? 它能让你的交易效 ...