《移动端签到》——利用 JavaScript API实现定位

2024-08-27 20:48

本文主要是介绍《移动端签到》——利用 JavaScript API实现定位,希望对大家解决编程问题提供一定的参考价值,需要的开发者们随着小编来一起学习吧!

  小编在做签到项目的时候,定位可是个不可缺少的功能,当我们签到时,我们只能在公司里签到,怎样判断你是否在公司里面哪——定位?定位可以将我们的详细的经纬度找出来,然后根据经纬度我们可以逆解析位置的详细信息,比如说哪个城市啦,街道地址等等。

  手机定位大约分为两种:

  1、GPS定位:通过接收卫星信号,直接得到手机的位置坐标。(不需要联网,可以完全离线定位,但是必须在天空比较开阔的地方,否则接收不到卫星信号。GPS定位,精度较高,可达到10米,但室内不可用,且超级费电。)。

  2、网络定位:网络定位,分为wifi定位和基站定位,都是通过获取wifi或者基站信息,然后查询对应的wifi或者基站位置数据库,得到的定位地点。定位数据库可以不断完善不断补充,所以,越定位越准确。

  2.1、WIFI定位:通过扫描手机周围的WIFI接入点,再把扫描到的接入点信息通过服务器对比,服务器再告诉手机所在的位置(这种定位方式需要互联网支持且WIFI要打开)。    

  2.2、基站定位:手机直接把自己所连接的基站以及能够扫描到的基站信息提供给服务器(比如中国移动的基站,每个基站间隔几百到几千米,每个基站都有自己的代码),再由服务器告知手机所在位置(也需要互联网支持)。

  像浏览器定位、ip定位、经纬度定位、等等,这些都属于网络定位。今天小编给大家介绍一下浏览器定位。

  HTML代码

<html>
<head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><meta name="viewport" content="initial-scale=1.0, user-scalable=no" /><style type="text/css">body, html,#allmap {width: 100%;height: 100%;overflow: hidden;margin:0;font-family:"微软雅黑";}</style><script type="text/javascript" src="http://api.map.baidu.com/api?v=2.0&ak=您的密钥"></script><title>浏览器定位</title>
</head>
<body><div id="allmap"></div>
</body>
</html>

  JS代码

// 百度地图API功能var map = new BMap.Map("allmap");var point = new BMap.Point(116.331398,39.897445);map.centerAndZoom(point,12);var geolocation = new BMap.Geolocation();geolocation.getCurrentPosition(function(r){if(this.getStatus() == BMAP_STATUS_SUCCESS){var mk = new BMap.Marker(r.point);map.addOverlay(mk);map.panTo(r.point);alert('您的位置:'+r.point.lng+','+r.point.lat);}else {alert('failed'+this.getStatus());}        },{enableHighAccuracy: true})//关于状态码//BMAP_STATUS_SUCCESS	检索成功。对应数值“0”。//BMAP_STATUS_CITY_LIST	城市列表。对应数值“1”。//BMAP_STATUS_UNKNOWN_LOCATION	位置结果未知。对应数值“2”。//BMAP_STATUS_UNKNOWN_ROUTE	导航结果未知。对应数值“3”。//BMAP_STATUS_INVALID_KEY	非法密钥。对应数值“4”。//BMAP_STATUS_INVALID_REQUEST	非法请求。对应数值“5”。//BMAP_STATUS_PERMISSION_DENIED	没有权限。对应数值“6”。(自 1.1 新增)//BMAP_STATUS_SERVICE_UNAVAILABLE	服务不可用。对应数值“7”。(自 1.1 新增)//BMAP_STATUS_TIMEOUT	超时。对应数值“8”。(自 1.1 新增)

  我们还可以通过经纬度解析地址,有通过前台JS解析的,还有通过后台C#代码来实现的,不过原理差不多,大家看一下。

  通过后台C#代码来解析地址

 public ActionResult GetAddress(string lat, string lng){string strBuff = "";Uri httpURL = new Uri(string.Format("http://api.map.baidu.com/geocoder/v2/?ak=你的key值f&location={0},{1}&output=json&pois=0&coordtype=wgs84ll", lat, lng));//HttpWebRequest类继承于WebRequest,并没有自己的构造函数,需通过WebRequest的Creat方法 建立,并进行强制的类型转换   HttpWebRequest httpReq = (HttpWebRequest)WebRequest.Create(httpURL);///通过HttpWebRequest的GetResponse()方法建立HttpWebResponse,强制类型转换   HttpWebResponse httpResp = (HttpWebResponse)httpReq.GetResponse();//GetResponseStream()方法获取HTTP响应的数据流,并尝试取得URL中所指定的网页内容   //若成功取得网页的内容,则以System.IO.Stream形式返回,若失败则产生ProtoclViolationException错 误。在此正确的做法应将以下的代码放到一个try块中处理。这里简单处理   Stream respStream = httpResp.GetResponseStream();//返回的内容是Stream形式的,所以可以利用StreamReader类获取GetResponseStream的内容,并以   //StreamReader类的Read方法依次读取网页源程序代码每一行的内容,直至行尾(读取的编码格式:UTF8)   StreamReader respStreamReader = new StreamReader(respStream, Encoding.UTF8);strBuff = respStreamReader.ReadToEnd();return Json(strBuff, JsonRequestBehavior.AllowGet);}

  上面是以Json串的形式返回详细地址的。

  通过JS直接逆解析 

var map = new BMap.Map("allmap");var point = new BMap.Point(116.331398,39.897445);//这里是我们要输入的经纬度map.centerAndZoom(point,12);var geoc = new BMap.Geocoder();    map.addEventListener("click", function(e){        var pt = e.point;geoc.getLocation(pt, function(rs){var addComp = rs.addressComponents;alert(addComp.province + ", " + addComp.city + ", " + addComp.district + ", " + addComp.street + ", " + addComp.streetNumber);});        });
  上面就是具体的浏览器定位实例,还有通过IP定位,城市定位,大家可以去百度API或者高德API上看看,原理大致相同,但是网络定位相比GPS定位来说,确实不如GPS定位准确,要想定位准确,还是需要用GPS定位方式。

这篇关于《移动端签到》——利用 JavaScript API实现定位的文章就介绍到这儿,希望我们推荐的文章对编程师们有所帮助!



http://www.chinasem.cn/article/1112742

相关文章

使用Python实现IP地址和端口状态检测与监控

《使用Python实现IP地址和端口状态检测与监控》在网络运维和服务器管理中,IP地址和端口的可用性监控是保障业务连续性的基础需求,本文将带你用Python从零打造一个高可用IP监控系统,感兴趣的小伙... 目录概述:为什么需要IP监控系统使用步骤说明1. 环境准备2. 系统部署3. 核心功能配置系统效果展

Java 实用工具类Spring 的 AnnotationUtils详解

《Java实用工具类Spring的AnnotationUtils详解》Spring框架提供了一个强大的注解工具类org.springframework.core.annotation.Annot... 目录前言一、AnnotationUtils 的常用方法二、常见应用场景三、与 JDK 原生注解 API 的

Java controller接口出入参时间序列化转换操作方法(两种)

《Javacontroller接口出入参时间序列化转换操作方法(两种)》:本文主要介绍Javacontroller接口出入参时间序列化转换操作方法,本文给大家列举两种简单方法,感兴趣的朋友一起看... 目录方式一、使用注解方式二、统一配置场景:在controller编写的接口,在前后端交互过程中一般都会涉及

Java中的StringBuilder之如何高效构建字符串

《Java中的StringBuilder之如何高效构建字符串》本文将深入浅出地介绍StringBuilder的使用方法、性能优势以及相关字符串处理技术,结合代码示例帮助读者更好地理解和应用,希望对大家... 目录关键点什么是 StringBuilder?为什么需要 StringBuilder?如何使用 St

Python实现微信自动锁定工具

《Python实现微信自动锁定工具》在数字化办公时代,微信已成为职场沟通的重要工具,但临时离开时忘记锁屏可能导致敏感信息泄露,下面我们就来看看如何使用Python打造一个微信自动锁定工具吧... 目录引言:当微信隐私遇到自动化守护效果展示核心功能全景图技术亮点深度解析1. 无操作检测引擎2. 微信路径智能获

使用Java将各种数据写入Excel表格的操作示例

《使用Java将各种数据写入Excel表格的操作示例》在数据处理与管理领域,Excel凭借其强大的功能和广泛的应用,成为了数据存储与展示的重要工具,在Java开发过程中,常常需要将不同类型的数据,本文... 目录前言安装免费Java库1. 写入文本、或数值到 Excel单元格2. 写入数组到 Excel表格

Java并发编程之如何优雅关闭钩子Shutdown Hook

《Java并发编程之如何优雅关闭钩子ShutdownHook》这篇文章主要为大家详细介绍了Java如何实现优雅关闭钩子ShutdownHook,文中的示例代码讲解详细,感兴趣的小伙伴可以跟随小编一起... 目录关闭钩子简介关闭钩子应用场景数据库连接实战演示使用关闭钩子的注意事项开源框架中的关闭钩子机制1.

Python中pywin32 常用窗口操作的实现

《Python中pywin32常用窗口操作的实现》本文主要介绍了Python中pywin32常用窗口操作的实现,pywin32主要的作用是供Python开发者快速调用WindowsAPI的一个... 目录获取窗口句柄获取最前端窗口句柄获取指定坐标处的窗口根据窗口的完整标题匹配获取句柄根据窗口的类别匹配获取句

Maven中引入 springboot 相关依赖的方式(最新推荐)

《Maven中引入springboot相关依赖的方式(最新推荐)》:本文主要介绍Maven中引入springboot相关依赖的方式(最新推荐),本文给大家介绍的非常详细,对大家的学习或工作具有... 目录Maven中引入 springboot 相关依赖的方式1. 不使用版本管理(不推荐)2、使用版本管理(推

Java 中的 @SneakyThrows 注解使用方法(简化异常处理的利与弊)

《Java中的@SneakyThrows注解使用方法(简化异常处理的利与弊)》为了简化异常处理,Lombok提供了一个强大的注解@SneakyThrows,本文将详细介绍@SneakyThro... 目录1. @SneakyThrows 简介 1.1 什么是 Lombok?2. @SneakyThrows