Feng - 2019年4月
type: channel
link: http://www.fengyitong.name/index.php/2019/04/
description: 半山腰的风采
items: 实现地图指定显示范围在指定区域内
items: fiddler 抓取https 设置步骤

实现地图指定显示范围在指定区域内
type: item
date: 2019-04-17T12:52:08+08:00
description: 大部分地图框架的地图对象都会有一个方法是设置地图当前显示范围如高德地图:setBounds(bound:Bounds) // 指定当前地图显示范围，参数bounds为指定的范围我们只需要传入希望地图显示的范围区域,地图框架自动计算合适的center 中心点 和zoom 层级但是有时候我们做地图展示页面,而为了美观我们会把地图设置为整个屏幕,对应的窗体浮动显示在地图上层.如图地图的实际有效范围只在中间这部分.通过有效范围在实际地图容器中的位置,宽高比值,我们根据希望实际显示容器中的范围计算得到修正后的真实显示范围,然后调用地图显示范围时传入真实显示范围后,在实际显示区域中则会刚好是我们希望地图显示的范围区域.这里记录一下核心代码:/** * 返回修正后的Bounds范围: * 地图区域有遮挡或者其他内容时,传入目标返回以及偏移值,返回修正后的范围 * 主要和map.setBounds方法配合使用. * @param {AMap.Bounds} sourceBound * @param {Number} left 地图显示有效区域距离实际地图容器左侧比例 * @param {Number} top 地图显示有效区域距离实际地图容器上方比例 * @param {Number} width 地图显示有效宽度与实际地图容器宽度比值 * @param {Number} height 地图显示有效高度与实际地图容器高度比值 */ export function getFixMapBound(sourceBound, left, top, width, height) { let minPoint = sourceBound.getSouthWest() let maxPoint = sourceBound.getNorthEast() // 计算出原区域的经纬度差值 let subX = maxPoint.getLng() - minPoint.getLng() let subY = maxPoint.getLat() - minPoint.getLat() let addX = subX / width - subX // 总共需要增加的经度值 let addY = subY / height - subY // 总共需要增加的维度值 let topY = subY * top / height // 头部维度差值 let leftX = subX * left / width // 左边经度差值 let rightX = addX - leftX let bottomY = addY - topY let minXY = [minPoint.getLng() - leftX, minPoint.getLat() - bottomY] let maxXY = [maxPoint.getLng() + rightX, maxPoint.getLat() + topY] return new AMap.Bounds(minXY, maxXY) }以上是高德的修复Bounds范围的代码,改成其他地图框架只要根据其他地图框架的实际对象,微调AMapBounds,maxPoint和minPoint即可.以下是调用代码的简易代码. var bounds = xxxx // 希望地图显示的范围区域 // 根据希望显示的范围区域,拿到实际地图应该传入的修正区域 var fixBounds = getFixMapBound( bounds, 0.25, // 有效区域距离地图容器左边是25%距离 0.1, // 有效区域距离地图容器上方是10%距离 0.5, // 有效区域的宽度与实际地图容器的宽度比值为0.5 : 1 0.9 // 有效区域的高度与实际地图容器的高度比值为0.9 : 1 ) map.setBounds(fixBounds) // 让地图根据修正后的区域设置显示范围,则地图的有效范围刚好是显示bounds的范围区域getFixMapBound方法也支持负数.

fiddler 抓取https 设置步骤
type: item
date: 2019-04-03T16:42:35+08:00
description: 之前fiddler一直没法抓https的包,导致很长一段时间都是直接用chrome开发者工具看网络请求,但是chrome没法在程序中设置代理查看自己发送的数据包和对方的差异,以及一些拦截/修改报文的功能无法实现.导致使用上肯定比不上fiddler方便. 看了https://www.cnblogs.com/joshua317/p/8670923.html的文章,总算是可以抓https的包了,在此表示感谢,记录一下以便后面自己查阅.1.清除C:\Users\Administrator\AppData\Roaming\Microsoft\Crypto\RSA 目录下所有文件没什么好说的,删了就是了,注意Administrator根据自己用户的名字进行修改.2.清除电脑上的根证书，WIN+R快捷键，输入：certmgr.msc，查找所有fiddler证书，然后删除没什么好说的,全部删就是了, 打开证书管理器后 找到菜单里的操作 -> 查找所有证书, 包含输入fiddler后点击立即查找3.清楚浏览器上的证书文件一般来说第2步完成后,浏览器上就不存在fiddler的文件了,为了确保没有问题.可以在浏览器的设置里找到证书管理的选项,删除所有包含fiddlerRoot的证书.4.打开fiddler tools->options,允许https连接打上勾,(忽略服务器错误可以打勾)然后点击actions,最后一项重置证书.reset all certificates,然后关闭到这步浏览器的受信任根证书颁发机构里应该就会自动生成fiddler的证书了,如果还是抓不了https的包,那么点actions手动导出证书到桌面,然后手动导入到浏览器中试试.注意了,还是抓不到包的话,请查看一下自己浏览器或者操作系统是否有挂载什么代理.比方说因为众所周知的原因不能访问谷歌搜索而不得不安装的什么东西,记得要查一下谷歌里面的关于proxy的插件哦.可能你不小心装的.听说还有一个叫证书生成器的东西,我已经解决了,就没有继续折腾了.放个链接已被不时之需http://www.telerik.com/docs/default-source/fiddler/addons/fiddlercertmaker.exe?sfvrsn=2