1.起源
作者本人吊丝码农，坐标苏州，一把年纪了上下班还要挤公交，每次出门之前，都习惯性的查询一下目前公交距离自己还有多少站路，以确定走路的步伐快慢[捂脸哭]。
在苏州的朋友可能会知道，查询各路公交有个专门的微信公众号，所以每天出门时要查公交的时候，还得
1.先打开微信；
2.找到公众号；
3.点击公众号第二个tab“公交查询”呼出菜单；
4.再点开“公交实时查询”的菜单按钮，才能打开查询的网页；
5.输入要查询的公交线路；
6.点击搜索出的结果；
经历这繁琐的6步，才能查询到运行情况。Emmmm到这里是不是觉得每天出门第一句，先说一声xxx。
WTF.png
其实说白了，我们要解决的问题，或者说需求就是用最简单的步骤，获知最近一班你想要乘坐的公交，距离自己还有多少站路？
2.分析
2.1获取数据
经过前几步复杂的步骤，无非就是打开了一个专门的网页，查询相应的接口。打开强大的Charles，设置手机代理抓包，抓到如下几个接口：
1.网页地址
苏州公交110南线示例
请求方式：GET
http://app.2500.tv/bus/lineInfo.php?lineID=10000522&roLine=10000570
一个get请求后面接了俩参数，但是只能在微信内嵌浏览器内打开（可能是为了获取用户openId，用于统计）。
2.查询接口
http://app.2500.tv/bus/api_line_status.php
请求方式：POST
入参数：lineID
返回：
{
"status":1,
"data":[
{
"BusInfo":"",
"Code":"ADU",
"ID":10003883,
"InTime":"",
"OutTime":"",
"StationCName":"星塘公交中心"
},]
}
其实有了第二个接口，就能做很多事情了。
2.2处理数据
我们已经能有办法获取到数据了,但是我们想要在手机上处理数据，就必须得有一个容器来获取数据，再处理数据。这个时候就轮到主角JSBox登场了。
2.2.1 JSBox
JSBox 是由知名的 PIN (iOS 剪贴板增强工具) 的作者@StackOverflowError推出的一款可让你在 iOS 上编写与运行 JavaScript 脚本的工具。
这个app是收费的，貌似还不便宜，没记错的话是50软妹币。不过本人刚好某次转发微博抽奖抽到一个兑换码😜😜😜😜
点击这里了解更多关于JSBox
个人推荐使用VSCode来编辑脚本，毕竟在手机上码代码太难受了，而且JSBox还提供了VSCode插件，能够在线编辑调试，非常方便。
利用JSBox封装好的$http，去调接口，然后再对返回的json，做下一步的处理（遍历，循环，判断，计算），计算出当前最近的一般公交，距离你有几站路。
2.2.1 为什么不直接用捷径
有人也许会说，iOS的捷径app，也能实现。确实不可否认，本人只对捷径研究了一两个小时，里面也有高级的api，来调接口。但是不用捷径直接处理的原因如下：
捷径截图.png
如上图所示，用程序猿的眼光来看:
捷径本质就是把某一个功能，不用代码，而是用图形化（GUI）的界面来实现。
所以，对于一般大众用户，编程小白来说，用捷径去完成一些不复杂的工作流，还是可以的。比方说，相应一条指令，打开某个app，或者拨打某个电话等等。
但是，想对于发送post请求，json数据解析，业务需求处理，这种相对高级的操作，用图形化界面来弄，会变的非常的复杂。
总结一下就是：
1.GUI操作界面，不太适合复杂度高，定制化高的工作流,而且是在手机上操作 ；
2.还是因为GUI的原因，不方便调试（debug），工作效率就显得很低下；
2.3展示数据
UI展示，直接利用了JSBox提供的控件label 和 list。
将第2.2中处理好的数据展示出来，展示出:
1.还剩余多少站路
2.还剩余那些站。
直接照着文档一步一步敲，而且Masonry似的布局方式对iOS开发者很友好，就可以轻轻松松搭UI界面。
3.最终效果
3.1 在JSBox中使用
直接运行脚本，来看效果:
JSBox内效果.gif
可以看出能达到查询公交的效果，最后来实现如何实现一键查询
3.2 通过iOS锁屏widget（推荐）
废话不说上图
widget.gif
锁屏widget里一键点一下即可，都不需要解锁，很方便。
3.3 通过Siri唤起（推荐）
通过Siri，也能实现一键查询。不过通过Siri实现的方式有两种。
3.3.1 Siri唤起JSBox执行脚本
在JSBox App里，添加方式有如下两种：
脚本设置页面 -> 添加为 -> 添加为 Siri
系统设置页面 -> Siri 与搜索 -> 在捷径中找到相应的脚本
效果图：
siri_run_jsbox.gif
3.3.2 Siri唤起捷径执行JSBox
当然需要你先创建一个捷径,并且你要在捷径里，添加一个JSBox提供的组件。然后再设置Siri指令。
捷径设置.png
效果图：
siri.gif
使用Siri的唤起的好处就是，你都不需要动手点亮屏幕，直接一句“嘿，Siri，我要下班”就能够实现查询。
当然，前提是手机要先设置好Siri唤起，以及手机不处于低电量模式。
3.3.3 通过桌面图标唤起（比较推荐）
首先，你还是要先创建一个捷径App，导入JSBox提供的组件。然后再设置“添加到主屏幕”
image.png
如图，本人添加了俩个捷径。
效果图：
图标唤起jsbox.gif
如果你所在的环境比较嘈杂，不方便使用Siri唤醒，除了widget之外，使用桌面icon一键唤醒，也是比较推荐的方案。
4.扩展
整个脚本，我都是把线路参数，公交站参数等等直接写在脚本里的，直接做成二维码分享出去意义不大，毕竟每个人的查询需求是不同的。有需要的，可以下载脚本，根据公众号的网页抓包，得到你想要的线路和站台参数，修改完后再执行。
附上Demo，走过路过的朋友不妨可以star或者fork一下。
万变不离其宗，对于非苏州的朋友，可以各自查找所在城市相关的微信微博网站等等，找到相应的查询接口，JSON数据结构修改一下，就可以了。
5.总结
本人前后花了不到一天的时间，从0开始学习JSBox和捷径，直至做出最终效果。可以说上手难度还是很低的。整个过程也学习了很多，感受到了JSBox这个app很强大，值得深入研究。
完结，鼓掌散花！👏👏🌹🌹
网友评论