侯体宗的博客
  • 首页
  • Hyperf版
  • beego仿版
  • 人生(杂谈)
  • 技术
  • 关于我
  • 更多分类
    • 文件下载
    • 文字修仙
    • 中国象棋ai
    • 群聊
    • 九宫格抽奖
    • 拼图
    • 消消乐
    • 相册

微信公众号获取用户地理位置并列出附近的门店的示例代码

微信(小程序)  /  管理员 发布于 3年前   146

思路分析:

1、在微信公众号内获取用户地理位置

需要js-sdk签名包(关于如何获取文档有介绍)

2、根据获取的地理位置ajax去后台请求,通过sql语句,查询中距离最近的门店(sql语句在网上搜的,位置是通过后台添加的)

3、根据城市查询门店列表,使用通过表单提交事件,ajax请求后台获取列表

4、百度地图导航页面要注意引入地址

一、开始开发

1、该功能的实现需要调用微信公众号的js-sdk接口实现

简介:

微信JS-SDK是微信公众平台面向网页开发者提供的基于微信内的网页开发工具包。

通过使用微信JS-SDK,网页开发者可借助微信高效地使用拍照、选图、语音、位置等手机系统的能力,同时可以直接使用微信分享、扫一扫、卡券、支付等微信特有的能力,为微信用户提供更优质的网页体验。

2、调用微信js-sdk的步骤:官方的网址:https://mp.weixin.qq.com/wiki

步骤一:绑定域名

先登录微信公众平台进入“公众号设置”的“功能设置”里填写“JS接口安全域名”。

步骤二:引入JS文件

 在需要调用JS接口的页面引入如下JS文件,(支持https):http://res.wx.qq.com/open/js/jweixin-1.2.0.js

备注:支持使用 AMD/CMD 标准模块加载方法加载

步骤三:通过config接口注入权限验证配置

所有需要使用JS-SDK的页面必须先注入配置信息,否则将无法调用(同一个url仅需调用一次,对于变化url的SPA的web app可在每次url变化时进行调用,目前Android微信客户端不支持pushState的H5新特性,所以使用pushState来实现web app的页面会导致签名失败,此问题会在Android6.2中修复)

具体的使用可以查看官方的文档

wx.config({  debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来,若要查看传入的参数,可以在pc端打开,参数信息会通过log打出,仅在pc端时才会打印。  appId: '', // 必填,公众号的唯一标识  timestamp: , // 必填,生成签名的时间戳  nonceStr: '', // 必填,生成签名的随机串  signature: '',// 必填,签名,见附录1  jsApiList: [] // 必填,需要使用的JS接口列表,所有JS接口列表见附录2});

步骤四:通过ready接口处理成功验证

wx.ready(function(){  // config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中。});

步骤五:通过error接口处理失败验证

wx.error(function(res){  // config信息验证失败会执行error函数,如签名过期导致验证失败,具体错误信息可以打开config的debug模式查看,也可以在返回的res参数中查看,对于SPA可以在这里更新签名。})

自己的程序代码附上(我做的是获取用户的地理位置,就是出现一个获取地理位置的弹窗):

html页面:

//引入微信js文件

控制器中获取门店通过sql语句获取距离一定距离的门店的列表:

if(IS_AJAX){  $post = I('post.');  //纬度小,经度大  // 5公里范围是5000  $longitude = $post['longitude'];//经度信息  $latitude = $post['latitude'];//纬度信息        //通过sql语句查询距离5公里之内的门店  $sql = "select * from (select shop_id,shop_name,shop_tel,shop_position,shop_logo, ROUND(6378.138*2*ASIN(SQRT(POW(SIN(($latitude*PI()/180-`shop_wei`*PI()/180)/2),2)+COS($latitude*PI()/180)*COS(`shop_wei`*PI()/180)*POW(SIN(($longitude*PI()/180-`shop_jing`*PI()/180)/2),2)))*1000) AS distance from sp_shop order by distance ) as a where a.distance<=5000";  // $sql = "select * from (select shop_id,shop_name,shop_tel,shop_position,shop_logo, ROUND(6378.138*2*ASIN(SQRT(POW(SIN((36.09297*PI()/180-`shop_wei`*PI()/180)/2),2)+COS(36.09297*PI()/180)*COS(`shop_wei`*PI()/180)*POW(SIN((120.3743*PI()/180-`shop_jing`*PI()/180)/2),2)))*1000) AS distance from sp_shop order by distance ) as a where a.distance<=5000";  $shopInfo = M()->query($sql);  echo json_encode($shopInfo);exit;  }else{      if(session('openid')){        //获取微信签名包信息(用户地理位置的获取)填写的配置信息中,需要写入的东西(调用签名包封装的类:http://blog.csdn.net/bj123467/article/details/72910160)        $jssdk = new \Home\Model\WechatModel();        $signPackage = $jssdk->GetSignPackage();        $this->assign('signPackage', $signPackage);      $this->display();      }else{        //判断该用户是否存在         $model = new \Home\Model\WechatModel();         $openid_accesstoken = $model->openId();         $rst = M('user')->where(array('user_openid' => $openid_accesstoken['openid']))->find();         if($rst){          session('openid',$openid_accesstoken['openid']);          session('user_id', $rst['user_id']);          $jssdk = new \Home\Model\WechatModel();          $signPackage = $jssdk->GetSignPackage();          $this->assign('signPackage', $signPackage);          $this->display();exit;        }else{          //如果不存在获取微信用户的基本信息          $userInfo = $model->getOpenId($openid_accesstoken['openid'],$openid_accesstoken['access_token']);          $data = array(            'user_img' => $userInfo['headimgurl'],            'user_openid' => $userInfo['openid'],            'user_name' => filter($userInfo['nickname']),            'user_register_time' => time(),            'city' => $userInfo['province'].'-'.$userInfo['city'],          );          $id = M('user')->add($data);          session('openid', $userInfo['openid']);          session('user_id',$id);          $jssdk = new \Home\Model\WechatModel();          $signPackage = $jssdk->GetSignPackage();          $this->assign('signPackage', $signPackage);          $this->display();        }      }  }

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持。

您可能感兴趣的文章:

  • 微信小程序--获取用户地理位置名称(无须用户授权)的方法
  • 微信小程序 获取当前地理位置和经纬度实例代码
  • 微信js-sdk地理位置接口用法示例
  • 微信公众平台开发之地理位置.Net代码解析
  • 微信获取用户地理位置信息的原理与步骤


  • 上一条:
    微信小程序 调用微信授权窗口相关问题解决
    下一条:
    小程序实现左滑删除效果
  • 昵称:

    邮箱:

    0条评论 (评论内容有缓存机制,请悉知!)
    最新最热
    • 分类目录
    • 人生(杂谈)
    • 技术
    • linux
    • Java
    • php
    • 框架(架构)
    • 前端
    • ThinkPHP
    • 数据库
    • 微信(小程序)
    • Laravel
    • Redis
    • Docker
    • Go
    • swoole
    • Windows
    • Python
    • 苹果(mac/ios)
    • 相关文章
    • 2023年9月1日起:微信小程序必须备案才能上线运营(0个评论)
    • 腾讯官方客服回应了:微信好友上限约10000个!(0个评论)
    • 2023年做微信小程序的老铁注意:新增收费项、微信小程序获取手机号也收费了(0个评论)
    • 小程序开发之跳转微信直播示例api(0个评论)
    • 在uni_app中开发小程序之常用功能示例代码汇总(0个评论)
    • 近期文章
    • Laravel 10.24版本发布(0个评论)
    • go语言多项目批量更新依赖及自动调用jenkins构建流程步骤(0个评论)
    • 在go语言中实现数学pow(x^y 的幂次)代码示例(0个评论)
    • Laravel应用程序性能监控 (APM) 工具:Scout (0个评论)
    • 推荐一款针对git、diff和grep输出的语法高亮显示的扩展包:Git Delta(0个评论)
    • laravel框架中以公共函数方式实现job异步化执行封装代码示例(0个评论)
    • 在go语言中实现从http响应中解码JSON数据(0个评论)
    • go语言中如何使用JSON网络令牌(JWT)在控制器之间传递数据(0个评论)
    • 计算机网络知识详解(0个评论)
    • Laravel HTTP 测试与Symfony的DomCrawler(0个评论)
    • 近期评论
    • 路人 在

      php中使用hyperf框架调用讯飞星火大模型实现国内版chatgpt功能示例中评论 教程很详细,如果加个前端chatgpt对话页面就完美了..
    • 博主 在

      科学上网翻墙之v2rayN-Core客户端免费公益节点使用教程中评论 @ mashrdn 多切换几个节点测试,免费ssr是没那么稳..
    • mashrdn 在

      科学上网翻墙之v2rayN-Core客户端免费公益节点使用教程中评论 V2rayn免费节点添加上去了,youtobe无法打开网页,是怎么回事..
    • 张伟 在

      科学上网翻墙之v2rayN-Core客户端免费公益节点使用教程中评论 3q!有用,不过免费节点隔天就要去git上复制新的导进去..
    • 博主 在

      科学上网翻墙访问Google , 上外网神器佛跳墙VPN(永久免费)使用流程步骤中评论 该篇教程已不能用了,告知大家,免的老有老铁问我!..
    • 2016-10
    • 2017-10
    • 2018-01
    • 2020-03
    • 2021-06
    • 2021-10
    • 2022-03
    • 2023-02
    • 2023-06
    • 2023-07
    • 2023-08
    Top

    Copyright·© 2019 侯体宗版权所有· 粤ICP备20027696号 PHP交流群

    侯体宗的博客