精华内容
下载资源
问答
  • 微信应用开发记录

    2015-12-28 17:17:23
    微信应用开发记录前端时间在家,朋友介绍开发一个移动应用,即在公众号里面增加一个菜单,然后链接页面通过查询某个银行的附近网点和全部网点。这里有个关键是,在查询附近网点的同时,能够查询出与用户当前的距离,...

    微信应用开发记录

    前端时间在家,朋友介绍开发一个移动应用,即在公众号里面增加一个菜单,然后链接页面通过查询某个银行的附近网点和全部网点。这里有个关键是,在查询附近网点的同时,能够查询出与用户当前的距离,并且能通过百度导航,从当前用户所在地导航到网点。

    在这里有两个关键点:
    1、如何通过微信的JSSDK,获取当前用户所在的经纬度。
    2、如何通过百度地图的API,查询出附近的网点,并获取到网点的经纬度,然后进行导航。

    关键点解决方案
    1、在微信的JSSDK已经给出相关的API,获取当前用户所在的经纬度。
    2、在百度地图的WEBAPI中,也已经给出API,通过查询获取相关数据。

    难点和经验
    难点1、关于微信JSSDK的验证,微信的验证的难度超过预计,特别是在使用和调试上,经常让人无所适从。
    这里吐槽一下:我们看一下JSSDK的说明,简单看一下:
    1)、需要引用http://res.wx.qq.com/open/js/jweixin-1.0.0.js
    2)、需要配置验证参数:

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

    appId很容易理解,申请的公众号ID。timestamp时间戳怎么来没说,nonceStr签名的随机串怎么生成没说明,signature有说明,通过timestamp、nonceStr、JsapiTicket(7200秒有效)和访问页面Url使用Sha1加密算出signature签名。
    微信官方给出PHP的例子,本人使用C#,没用过PHP,还是不知道怎么验证。最后百度了一下,还好已经有人做过了,已经在网上说明。
    3)、timestamp产生,(不同语言自己写算法实现,官方有PHP代码)自己写算法实现,生成时间戳 从 1970 年 1 月 1 日 00:00:00 至今的秒数,即当前的时间,且最终需要转换为字符串形式。代码如下:

     public static string getTimestamp()
            {
                TimeSpan ts = DateTime.UtcNow - new DateTime(1970, 1, 1, 0, 0, 0, 0);
                return Convert.ToInt64(ts.TotalSeconds).ToString();
            }

    4)、nonceStr产生,(不同语言自己写算法实现,官方有PHP代码)生成签名的随机串,使用MD5签名结果

     public static string getNoncestr()
            {
                Random random = new Random();
                return GetMD5(random.Next(1000).ToString(), "GBK");
            }
            /** 获取大写的MD5签名结果 */
            public static string GetMD5(string encypStr, string charset)
            {
                string retStr;
                MD5CryptoServiceProvider m5 = new MD5CryptoServiceProvider();
                //创建md5对象
                byte[] inputBye;
                byte[] outputBye;
                //使用GB2312编码方式把字符串转化为字节数组.
                try
                {
                    inputBye = Encoding.GetEncoding(charset).GetBytes(encypStr);
                }
                catch (Exception ex)
                {
                    inputBye = Encoding.GetEncoding("GB2312").GetBytes(encypStr);
                }
                outputBye = m5.ComputeHash(inputBye);
                retStr = System.BitConverter.ToString(outputBye);
                retStr = retStr.Replace("-", "").ToUpper();
                return retStr;
            }

    5)、signature产生,这个复杂了,微信官方真的没说清楚,这里分三步走。
    *、首先通过APPID和AppSecret,产生Token票据,通过下面链接获取参数:”https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=” + appid + “&secret=” + secret。(7200秒有效)
    *、通过Token票据获取JsapiTicket(7200秒有效),通过下面链接获取参数:https://api.weixin.qq.com/cgi-bin/ticket/getticket?access_token=” + accesstoken + “&type=jsapi
    *、通过timestamp、nonceStr、JsapiTicket(7200秒有效)和访问页面Url使用Sha1加密算出signature签名。这里感谢网上高手,我这里给出参考
    http://www.cnblogs.com/ysyn/p/4665897.html,但是Sha1加密,少了一步排序,参考开源组件:
    最后代码如下:

     /// <summary>
            /// 获取JS-SDK权限验证的签名Signature
            /// </summary>
            /// <param name="ticket"></param>
            /// <param name="noncestr"></param>
            /// <param name="timestamp"></param>
            /// <param name="url"></param>
            /// <returns></returns>
            public static string GetSignature(string ticket, string noncestr, string timestamp, string url)
            {
                var parameters = new Hashtable();
                parameters.Add("jsapi_ticket", ticket);
                parameters.Add("noncestr", noncestr);
                parameters.Add("timestamp", timestamp);
                parameters.Add("url", url);
                return CreateSha1(parameters);
            }
            /// <summary>
            /// sha1加密
            /// </summary>
            /// <returns></returns>
            private static string CreateSha1(Hashtable parameters)
            {
                var sb = new StringBuilder();
                var akeys = new ArrayList(parameters.Keys);
                akeys.Sort();
                foreach (var k in akeys)
                {
                    if (parameters[k] != null)
                    {
                        var v = (string)parameters[k];
                        if (sb.Length == 0)
                        {
                            sb.Append(k + "=" + v);
                        }
                        else
                        {
                            sb.Append("&" + k + "=" + v);
                        }
                    }
                }
                return getSha1(sb.ToString()).ToString().ToLower();
            }
                   public static String getSha1(String str)
            {
                //建立SHA1对象
                SHA1 sha = new SHA1CryptoServiceProvider();
                //将mystr转换成byte[]
                ASCIIEncoding enc = new ASCIIEncoding();
                byte[] dataToHash = enc.GetBytes(str);
                //Hash运算
                byte[] dataHashed = sha.ComputeHash(dataToHash);
                //将运算结果转换成string
                string hash = BitConverter.ToString(dataHashed).Replace("-", "");
                return hash;
            }       
     这里有几个关键点,请大家注意,不要走弯路:
     *、返回结果的反序列化,可直接用JsonConvert.DeserializeObject实现
     *、四个参数大小写不能错,特别是Url的大小写,不能错,这个看网上很多走了弯路,可使用location.href.split('#')[0]
     参数的验证地址:有两个要分别验证的(????),为什么微信不一个验证就给人调试验证,让人难以理解。建议微信在增加一个验证调试接口。验证接口http://mp.weixin.qq.com/debug/cgi-bin/sandbox?t=jsapisign,这里验证比较麻烦,通常需要不少时间。
     *、innvalid url domain当前页面所在域名与使用的appid没有绑定,请确认正确填写绑定的域名,如果使用了端口号,则配置的绑定域名也要加上端口号,注意按照域名,填写qq.com
    难点2、百度地图WebApi的调用,相对来说就简单多了,只需要BaiduKey就行了,可直接使用http://developer.baidu.com/map/index.php?title=webapi。
    
    展开全文
  • 1、获取位置的API这里是获取到位置,并且打开地图定位到手机当前的经纬度坐标处wx.getLocation({ type: 'gcj02', //返回可以用于wx.openLocation的经纬度 success: function(res) { var latitude = res.latitude ...

    1、获取位置的API


    这里是获取到位置,并且打开地图定位到手机当前的经纬度坐标处

    wx.getLocation({
      type: 'gcj02', //返回可以用于wx.openLocation的经纬度
      success: function(res) {
        var latitude = res.latitude
        var longitude = res.longitude
        wx.openLocation({
          latitude: latitude,
          longitude: longitude,
          scale: 28
        })
      }
    })

    2、发起网络请求的API


    const requestTask = wx.request({
      url: 'test.php', //仅为示例,并非真实的接口地址
      data: {
         x: '' ,
         y: ''
      },
      header: {
          'content-type': 'application/json'
      },
      success: function(res) {
        console.log(res.data)
      }
    })
    
    requestTask.abort() // 取消请求任务


    3、根据经纬度坐标获取城市信息的接口地址(百度API):

    http://api.map.baidu.com/geocoder/v2/?ak=百度API Key&location=32.12,120.5&output=json


    4、根据城市名称获取天气信息的接口地址:

    http://wthrcdn.etouch.cn/weather_mini?city=合肥



    5、页面js方法调用,在微信API方法内调用另一个方法,要首先获取到当前的页面,如下图所示:

    var page = this;


    6、获取返回的Json值后,可以在页面中直接.出对应节点的值,如下图所示:

    首先创建数组



    7、使用模板API,定义与引用




    创建模板



    8、利用循环获取模板并展示


    展开全文
  • 微信开发:lbs附近的商家,在数据库里记录商家的坐标,lbs设置里管理搜索半径,查询的时候,查询 客户当前坐标的半径内的所有商家列表。个人喜欢不一样,我选择了执行sql ,毕竟效果高点。微信开发必须得将就效率...

    微信开发:lbs附近的商家,在数据库里记录商家的坐标,lbs设置里管理搜索半径,查询的时候,查询 客户当前坐标的半径内的所有商家列表。
    个人喜欢不一样,我选择了执行sql ,毕竟效果高点。微信开发必须得将就效率问题。不然等半天出不来,急死人,半天出不来结果,客户直接走人。
    不多说,直接上代码

    \\返回两个经纬度坐标点的距离(单位:米)
     
    \\C#  方法
     
    ///<summary>返回两个经纬度坐标点的距离(单位:米) by Alex.Y</summary>
            ///<param name="Longtiude">来源坐标经度Y</param>
            ///<param name="Latitude">来源坐标经度X</param>
            ///<param name="Longtiude2">目标坐标经度Y</param>
            ///<param name="Latitude2">目标坐标经度X</param>
            ///<returns>返回距离(米)</returns>
            public double getMapDistance(double Longtiude, double Latitude, double Longtiude2, double Latitude2)
            {
     
                var lat1 = Latitude;
                var lon1 = Longtiude;
                var lat2 = Latitude2;
                var lon2 = Longtiude2;
                var earthRadius = 6371; //appxoximate radius in miles  6378.137
     
                var factor = Math.PI / 180.0;
                var dLat = (lat2 - lat1) * factor;
                var dLon = (lon2 - lon1) * factor;
                var a = Math.Sin(dLat / 2) * Math.Sin(dLat / 2) + Math.Cos(lat1 * factor)
                  * Math.Cos(lat2 * factor) * Math.Sin(dLon / 2) * Math.Sin(dLon / 2);
                var c = 2 * Math.Atan2(Math.Sqrt(a), Math.Sqrt(1 - a));
     
                double d = earthRadius * c * 1000;
     
                return d;
     
            }
     
     
     
    --返回两个经纬度坐标点的距离(单位:千米)
     
    -- =============================================
    -- Author:      alex.Y
    -- Create date: getdate()
    -- Description: 返回两个经纬度坐标点的距离(单位:千米)
    --        ///<param name="@LngBegin">来源坐标经度Y</param>
    --        ///<param name="@LatBegin">来源坐标经度X</param>
    --        ///<param name="@LngEnd">目标坐标经度Y</param>
     --       ///<param name="@LatEnd">目标坐标经度X</param>
    -- =============================================
     
    CREATE FUNCTION [dbo].[ufn_GetMapDistance]
    (@LngBegin  REAL, @LatBegin REAL, @LngEnd REAL, @LatEnd REAL)
           RETURNS FLOAT
           AS
    BEGIN
           --距离(千米)  
           DECLARE @Distance      REAL
           DECLARE @EARTH_RADIUS  REAL
           --SET @EARTH_RADIUS =6378.137
           SET @EARTH_RADIUS =6371 
            
           DECLARE @RadLatBegin  REAL,
                   @RadLatEnd    REAL,
                   @RadLatDiff   REAL,
                   @RadLngDiff   REAL
            
           SET @RadLatBegin = @LatBegin *PI()/ 180.0
           SET @RadLatEnd = @LatEnd *PI()/ 180.0
           SET @RadLatDiff = @RadLatBegin - @RadLatEnd
           SET @RadLngDiff = @LngBegin *PI()/ 180.0 - @LngEnd *PI()/ 180.0
            
           SET @Distance = 2 *ASIN(
                   SQRT(
                       POWER(SIN(@RadLatDiff / 2), 2)+COS(@RadLatBegin)*COS(@RadLatEnd)
                       *POWER(SIN(@RadLngDiff / 2), 2)
                   )
               )
            
           SET @Distance = @Distance * @EARTH_RADIUS
           --SET @Distance = Round(@Distance * 10000) / 10000
            
           RETURN @Distance
            
            -- SELECT [dbo].[ufn_GetMapDistance](116.3130497932434100,39.9804086267150800,116.3731849193573000,39.9110159284269700)
     
    END

      

    展开全文
  • 1.地图偏差值 在腾讯地图与百度、搜狗、谷歌地图之间经纬度有一定的偏差值 ...在老版本的微信小程序开发文档上有 但是新的已经没啦 注意:目前页面路径最多只能十层。 最坑 3.地图定位的key每天只能用1...

    1.地图偏差值

    在腾讯地图与百度、搜狗、谷歌地图之间经纬度有一定的偏差值

    http://wangbaiyuan.cn/baidu-map-api-position-offset-calibration-algorithm.html

    这里好坑

    2.路由栈的问题

    在老版本的微信小程序开发文档上有 但是新的已经没啦

    注意:目前页面路径最多只能十层。

    最坑

    3.地图定位的key每天只能用1万次 这里与第一条应该同属一类问题 但我觉得有必要说

    4.异步的问题 

    这里主要体现在api 一切都是基本都是异步

    比如 用户授权信息 比如用户地理位置 讲到这里 有人会笑 这么简单的问题 咋会出错 

    呵呵 等着吧 你会收到来自微信的惩罚

     

    转载于:https://www.cnblogs.com/bozhiyao/p/9947900.html

    展开全文
  • 使用小程序的picker组件选择省市区,然后根据选择的省市区获的经纬度来设置map的中心点, 类似于滴滴的选择方式。 二、实现 首先引入map组件 <map id="map" scale="14" :latitude='!init&&...
  • C#实现微信企业号签到功能实例

    热门讨论 2015-06-02 14:23:44
    实例源码,签到没实现重复签到,考虑到用于考勤,可以提取第一次签到和最后一次签到做为上班和下班考勤。可根据经纬度和公司的...有完整的业务代码,学习微信开发难得的参考资料。涉及到js-sdk\accesstoken、签名等
  • 出于毕设的要求,本次先制作了一个开题报告的demo程序,由于是第一次接触前端,加上后续的毕设要求,现将今日踩的坑和之后开发考虑到的问题在本文作出记录。动手之前本人跟着视频做过的demo如下: 计算器:主要学习...
  • 背景:本人最近在开发一款天气预报的微信小程序,在调用腾讯地图API进行逆地址解析获取详细地名时,发现其官方文档的描述模棱两可、网络上也没有搜到确实可行的方法。在经过对官方文档的逐句翻译和数次尝试之后,...
  • 微信小程序之区域搜索功能实现

    千次阅读 2019-01-14 15:33:55
    总体来说,这两个功能是比较简单的,只是综合开发可能一开始没有头绪,所以记录一下我的实现方式,希望对看到这篇博客的人有所帮助,共勉 (ง’-̀’́)ง。 大体思路是: 1. 录入信息时,比如我的是机构信息...
  • 微信小程序】位置之重新授权

    千次阅读 2018-02-03 19:26:37
    目前开发的小程序需要应用到一个获取经纬度的功能,授权的部分有点繁琐,记录一下。 1.使用 wx.getLocation() 可以获取用户的位置信息,第一次会弹出微信原生的modal提问用户是否授权,之后不会再次弹出。第一次我的...
  • 背景:本人最近在开发一款天气预报的微信小程序,在调用腾讯地图API进行逆地址解析获取详细地名时,发现其官方文档的描述模棱两可、网络上也没有搜到确实可行的方法。在经过对官方文档的逐句翻译和数次尝试之后,...
  • 根据经纬度计算两地的距离

    千次阅读 2014-04-04 15:14:26
    最近开发微信公众平台,需求是根据用户发送的地理位置信息,将其附近的专家或代售点返回。 算法思路:先算出该点周围的矩形的四个点,然后使用经纬度去直接匹配数据库中的记录。 代码如下: 1、计算四...
  • 前言本人最近在开发一款天气预报的微信小程序,在调用腾讯地图API进行逆地址解析获取详细地名时,发现其官方文档的描述模棱两可、网络上也没有搜到确实可行的方法。在经过对官方文档的逐句翻译和数次尝试之后,终于...
  • 个人总结的前端开发规范 2017.8 一个不打开浏览器工具的调试方法 在iframe中优雅地使用父窗口中的$ 2017.6 几种跨域处理方式 nodejs读取本地文件夹的文件备份文件名 JavaScript中正则表达式常见使用函数 更...
  • 商家后台增加实体店经纬度获取坐标功能 √ 商家填写经纬度获取坐标后,手机端用户可在店铺街查看商家具体坐标。 商家后台PC成交情况 √ 商家后台显示今日和昨日PC客单价、成交额、子订单数 商家账户冻结资金 √ ...
  • 万能后台管理模板javaweb

    热门讨论 2016-10-23 17:32:05
    9. 代码生成:生成完整的模块代码,并保留生成记录模版,可复用 (超强悍开发利器) 正向生成: 生成完整的模块,页面、处理类、service层、myabaits的xml 建表的sql脚本等 反向生成: 任意连接其它数据库(mysql、...
  • 联系方式:QQ:517216493 微信:feiyangqingyun QQ好友满了推荐加微信 视频相关作品体验地址:https://pan.baidu.com/s/1d7TH_GEYl5nOecuNlWJJ7g 提取码:01jf 其他相关作品体验地址:...
  • 命令行程序开发 cement:Python 的命令行程序框架。 click:一个通过组合的方式来创建精美命令行界面的包。 cliff:一个用于创建命令行程序的框架,可以创建具有多层命令的命令行程序。 clint:Python 命令行...

空空如也

空空如也

1 2
收藏数 22
精华内容 8
关键字:

微信开发记录经纬度