0

    Matrix 首页推荐

    2023.05.05 | admin | 210次围观

    Matrix 是少数派的写作社区,我们主张分享真实的产品体验,有实用价值的经验与思考。我们会不定期挑选 Matrix 最优质的文章,展示来自用户的最真实的体验和观点。

    文章代表作者个人观点,少数派仅对标题和排版略作修改。

    一直以来,很多用户都希望微信的小程序能够支持 URL Scheme。正好 V2EX 网友 @ITisCool 分享了几条相关的 URL Scheme,根据 文章 分享的方法,作者也构造了一些实用的小程序 URL Scheme。接下来就来看看,如何构造微信小程序的 URL Scheme。

    本身依托于文章《URL Scheme 查询指南》,在 iOS 上,URL Scheme 是用于定位应用内某个页面的类似网址的存在,设置妥当后可被用于快速跳转到应用中的某个页面/功能。

    信息展示

    在日常生活中,小程序有很大一部分使用场景都是用于信息的展示。例如出示乘车码、健康码、行程卡等等,尤其疫情当前,进入商场餐厅都必须出示健康码/行程码才能入内。现在的生活里已经离不开了码,所以本次小教程先以信息展示切入,来看看有哪些实际的应用。

    乘车码

    虽然不少城市的地铁与公交都已经支持了各种 Pay,但依旧有不少读者习惯使用微信乘车码。以腾讯乘车码为例,打开微信乘车码小程序,点击右上角的「导航」图标,再点击「乘车码」进入乘车码的信息页面。

    点击「更多资料」,查看小程序的「账号原始ID」,例如乘车码的 gh_3cf62f4f1d52。记下这串 ID,可以说是乘车码这个小程序的「身份证」。这个步骤相当基础,以下每一个例子都会机遇这个步骤来寻找这串原始 ID。

    有了小程序账号的原始 ID 之后,就可以根据固定的 URL Scheme 格式进行构造了。微信打开小程序的 URL Scheme 格式如下:

    weixin://app/wx5aa333606550dfd5/jumpWxa/?userName=账号原始ID

    其中的「wx5aa333606550dfd5」是固定的注册代号,无需更改。依葫芦画瓢,如果各位需要打开某个小程序,只需在 userName 参数后面跟上「原始ID」即可。所以可以构造出乘车码的 URL Scheme,如下所示:

    weixin://app/wx5aa333606550dfd5/jumpWxa/?userName=gh_3cf62f4f1d52

    此处演示使用的是我惯用的 Launch Center Pro 跳转,如果读者习惯使用快捷指令,也可以在快捷指令中新建一个动作。新增一个打开 URL 的动作,将 URL Scheme 复制进去,也可以起到一样的效果。快捷指令还可以在桌面微件、背部轻拍等功能中快速启动,这里就交给各位读者老爷们自行发挥啦。

    车来了

    除了能够直接打开某个小程序,在研究这个 URL Scheme 的过程中,还有一个意外发现:如果使用 URL Scheme 打开小程序,可以跳过开屏广告,直接进入主页面。使用上述的方法,得到车来了的「原始ID」,我们一样可以顺利构造出打开「车来了」小程序的 URL Scheme。

    但如果我们想更进一步,直接一步到位触达某条公交线路详情页面,那该怎么做呢?

    好在微信也提供了一个 path 参数,可以直接打开指定页面。直达某页面的 URL Scheme 格式如下所示:

    weixin://app/wx5aa333606550dfd5/jumpWxa/?userName=账号原始ID&path=页面路径

    但是问题也随之而来,如何获取页面路径?这就有一定的操作门槛了,如果需要获取页面的路径,需要有一个自己的小程序才能查询到其他小程序的页面路径入口。前往 微信公众平台 扫码登录,注册一个小程序。注册好之后,点击右上角的「工具」>「生成小程序码」。

    如果你已经注册过公众号的话,我们会在下一个例子里会介绍公众号获取路径的方法,此处注册小程序的步骤可以跳过。

    输入要查找的小程序名称,例如此处的「车来了精准实时公交」。此处的搜索不支持模糊搜索,需要输入完整的小程序名称。在输入完成后,点击右边的「搜索」图标,出现搜索结果之后,才可以点击「下一步」。

    点击「获取更多页面路径」按钮,在此处输入自己的微信号,再点击「开启」之后,就可以查询页面路径了。如果开启成功,会在顶部弹出通知,显示「开启入口成功」。

    返回车来了小程序,来到需要获取路径的页面,例如此处的 K02 路公交详情页面。

    点击右上角的「更多」按钮,再点击「复制页面路径」,就可以得到 K02 路的页面路径,如下所示:

    pages/linedetail2/linedetail.html?nextStop={}&line={"lineId":"594166803814","lineName":"K02","direction":0,"lineNo":"r02669"}&city={"cityId":"051","cityName":"莆田","cityVersion":2,"isGpsCity":1,"isHot":0,"isNewCity":0,"isSupport":1,"pinyin":"PuTian","supportSubway":0,"wechatFavoriteGray":0,"localCityId":"051"}&targetStop={"couponFlag":0,"distanceToSp":-1,"lat":25.4712269632472,"lng":119.12347092956134,"order":30,"sId":"0594-1425","sn":"涵江区教育局"}

    再通过乘车码中的方法,如法炮制获取打开「车来了」的 URL Scheme,如下所示:

    weixin://app/wx5aa333606550dfd5/jumpWxa/?userName=gh_35bd264ef886

    最后只需要将页面路径拼接到 URL Scheme 后面,即可实现直接打开某个具体页面。页面路径的参数名为 path,复制上述我们获取到的「页面路径」,可构造出如下的 URL Scheme:

    weixin://app/wx5aa333606550dfd5/jumpWxa/?userName=gh_35bd264ef886&path=pages/linedetail2/linedetail.html?nextStop={}&line={"lineId":"594166803814","lineName":"K02","direction":0,"lineNo":"r02669"}&city={"cityId":"051","cityName":"莆田","cityVersion":2,"isGpsCity":1,"isHot":0,"isNewCity":0,"isSupport":1,"pinyin":"PuTian","supportSubway":0,"wechatFavoriteGray":0,"localCityId":"051"}&targetStop={"couponFlag":0,"distanceToSp":-1,"lat":25.4712269632472,"lng":119.12347092956134,"order":30,"sId":"0594-1425","sn":"涵江区教育局"}

    将它做成一个 Launch Center Pro 的 Action,将这段 URL Scheme 复制进去,但是运行该 Action 之后我们又遇到了另一个问题,报错提示:「URL cloud not be opened」

    如果对 LCP 有一定了解,可以猜到这是因为没有编码导致的。而问题就出在 path 上,在 path 参数的前后分别加上 {{ }},这是 LCP 它自带的编码语法,这样括号之后即可正常运行,演示效果如下。

    如果读者需要使用捷径打开这个 URL Scheme,同样需要使用「URL 编码」模块对 path 参数进行单独编码,然后再将 URL Scheme 和 path 进行拼接,否则会导致无法进入指定的页面。

    通信行程卡

    在之前的文章 URL Scheme 查询指南 下面,有读者评论说:是否有通信行程卡的 URL Scheme?当时对该软件进行解包之后发现,该软件没有注册任何 URL Scheme,自然也就不能通过它打开。

    但是现在有了小程序的 URL Scheme,那么接下来让我们一起热心地试着来实现这位读者的需求。使用上面的方法获得通信行程卡的「原始 ID」,经过 LCP 打开之后效果如下所示。这样就能做到一键打开行程卡的效果了,它的 URL Scheme 地址如下:

    weixin://app/wx5aa333606550dfd5/jumpWxa/?userName=gh_0ed5d82fd775

    拍照识别

    讲完了乘车码、车来了、通信行程卡三个例子后,相信读者也能对这类 URL Scheme 有了一个初步的认识,三个小程序它们实现的都是信息的展示,但不少小程序并不只是起到信息展示的作用,也有不少小程序通过调用手机硬件,来部分实现主 App 中的功能,这其中就有不少学生朋友喜爱的小猿搜题等。接下来就以小猿搜题为例,看看另一种形式的小程序 URL Scheme 玩法。

    小猿搜题

    打开小猿搜题小程序,点击「拍照搜题」,这时候可以看到在拍照页面,同样出现了一个「更多」的图标。为了能够一步直达拍照页面,就需要获取拍照页面的路径。

    在「车来了」例子中,介绍了使用小程序后台获取地址的方法,但是如果恰好只有公众号,也是可以获取到页面路径的。登录公众号后台,在首页点击新的创作,选择「图文消息」。

    点击顶部提供的「小程序」插入功能,搜索「小猿搜题」,然后进行下一步操作。

    点击「获取去更多页面路径」,在开启入口处输入自己的微信号,点击开启。成功后会在顶部提示「已开启」。

    此时,打开小猿搜题小程序,点击更多选项。会在下方的分享菜单中看到「复制页面路径」按钮,点击即可复制,获取拍照页面的地址,如下所示:

    pages/camera/camera.html

    将拍照页面的地址和打开「小猿搜题」的 URL Scheme 拼接,得到如下 URL Scheme,可以一键直达拍照界面。URL Scheme 如下所示:

    weixin://app/wx5aa333606550dfd5/jumpWxa/?userName=gh_10ba875ac32b&path=pages/camera/camera.html

    拍照识花

    将「小猿搜题」的方法如法炮制,也可以得到「识花君」的拍照识花页面的 URL Scheme,如下所示:

    weixin://app/wx5aa333606550dfd5/jumpWxa/?userName=gh_60c5387f05e3&path=pages/recogNew/recogNew.html
    

    美团共享单车

    既然可以拍照识别,那么扫描二维码自然不在话下。日常我们扫码的一个高频场景就是路边扫码开启共享单车,炎炎夏日谁不想赶紧开一辆车跑路呢。但在测试美图的单车扫码页面时遇到了一些麻烦:顶部没有了导航图标,无法获取页面路径。

    如果某个小程序,它的扫描或者拍照功能是直接使用微信的拍照接口,它就无法做到一键直达。对比刚才的「小猿搜题」和「拍照识花」的例子,它们是构建了自己的拍照页面,才可以获得拍照页面的地址。

    放弃了小程序这条路,解包美团应用可发现了美团扫一扫的 URL Scheme,如果是安装使用官方 App 的页面倒是可以一键直达,扫码开车。美团扫一扫的 URL Scheme 如下所示:

    imeituan://www.meituan.com/scanQRCode

    小程序搜索

    在传统的 URL Scheme 中,除了打开一个页面或者功能之外微信小程序url在哪找,还有一种很重要的玩法,那就是使用 URL Scheme 进行搜索。而部分的微信小程序也提供了这样的支持,下面以微博小程序为例看看,如何使用小程序进行搜索。

    微博

    打开微博小程序搜索页面,使用上面的方法获取搜索页面的 path,结果如下:

    pages/Discover/Discover.html?searchValue=王毅说各方有必要同塔利班接触

    可以看出,searchValue 的值正是搜索栏推荐的文本微信小程序url在哪找,所以不难想出只要构造如下 URL Scheme,即可一键跳转到微博小程序搜索。

    weixin://app/wx58164a91f1821369/jumpWxa/?userName=gh_5f1a249e0ced&path=pages/Discover/Discover.html?searchValue=[prompt]&needResult=true

    经过测试,该 URL Scheme 可以正常工作,但是美中不足之处在于,无法直接显示搜索结果,需要手动点击回车搜索,演示效果如下。

    其他的部分小程序也支持这个玩法,但是要注意并不是每个小程序的搜索页都有搜索参数,对于部分没有参数的小程序,请读者不要过于纠结,这是小程序的设计不足之处。

    此处一并给出直接打开部分小程序的搜索页面的 URL Scheme:

    京东
    weixin://app/wx58164a91f1821369/jumpWxa/?userName=gh_45b306365c3d&path=pages/search/list/list.html
    小红书
    weixin://app/wx58164a91f1821369/jumpWxa/?userName=gh_52be748ce5b7&path=pages/secondary/search/index.html
    美团外卖
    weixin://app/wxd930ea5d5a258f4f/jumpWxa/?userName=gh_72a4eb2d4324&path=packages/index/search/search.html

    URL Scheme 应用

    有了这些微信 URL Scheme 之后,自然就是如何使用它们,目前常见的一些 URL Scheme 打开方式如下所示:

    具体要使用那种方式,这可以根据使用频率来决定,如果是每天都要用的,可以设置为最简单的双击背面打开。一般频率的使用,捷径或者 LCP 都可以考虑,选择合适自己的就可以了。

    除此之外,还可以将它做成一个 Launch Center Pro action,借助 LCP 的肌肉记忆优势,可以更方便地使用小程序。如果是像小猿搜题和拍照识花这样低频使用软件,将它添加到 LCP 之后,还更方便查找,不必每次都去搜索查找小程序。

    LCP 的软件图标的获取可以参考 提取 Mac OS X / iOS 应用图标的 6 种技巧,建议使用 icoicon.com 获取正方形的图标,而不是圆角的图标,如果使用圆角图标,旁边会有黑边。

    应用场景

    对企业或者商户而言,可以更方便地在 iOS 平台推广自己的产品。以少数派为例,可以直接将 PiStore 商品链接 放在网页上,如果读者想要购买产品的话,可以直接点击链接跳转小程序详情页面,让购买产品的过程更加方便。

    对个人而言,微信小程序 URL Scheme 可以减少点击次数,直达功能页面。对于低频率使用的小程序,可以直接在 LCP 中新建动作使用,而不必专门下载对应的应用。借助捷径,也可以变相达成 Android 端类似的「将小程序放在桌面」的目的。

    再进一步说,带有搜索参数的 URL Scheme,还可以结合 妙用重定向,优化 iOS 的搜索体验 中提到的方法,将两者结合起来使用,相信会有更好的使用体验。

    版权声明

    本文仅代表作者观点。
    本文系作者授权发表,未经许可,不得转载。

    发表评论