钉钉内部应用开发之手机本地域名访问

背景

由于工作需要,需要在钉钉平台上开发内部应用,钉钉自定义工作台。

钉钉内部应用开发之手机本地域名访问

局限

  1. 这种方式在开发阶段只能通过配置ip+port地址的形式进行访问,如果要配置域名的话,需要配置合法的域名,即非自定义域名。
  2. 但是当后端需要配置一些代理。如: nginx等这样代理转发服务器时,则无法很好的实现。

解决方案

在移动端钉钉访问的时候,首页访问的地址其实是访问的下面配置这个地址:
钉钉内部应用开发之手机本地域名访问
这里我们进入首页没问题,问题在于如果需要转发的访问的时候就存在下面的问题:
ip+port的形式转发受限制
如何解决呢?

首先我们想到的是,能不能在手机端模拟类似pc端那样配置hosts映射。

移动端代理工具
  1. 我们可以使用Charles这个抓包工具来实现代理功能。
  2. 配置一些配置信息,无外乎就是配置手机以及Charles的一些东西。

这里就展开叙述了, 盗链接 ????????

规则转发+Cookie重写

配置上述配置后,我们基本上可以满足我们从手机端映射到本地电脑上的请求链路了。
现在关键的在于,需要Charles帮助我们做两个功能:

  1. ip+port形式的请求路径映射到域名的请求路径
  2. 重写请求信息+Cookie信息,防止跨域请求丢失Cookie

转发

  1. Map Remote配置
    钉钉内部应用开发之手机本地域名访问
    钉钉内部应用开发之手机本地域名访问
    Map From表示从手机终端的原始请求
    Map To 表示你需要转换的请求.

比如:我们想从本地的localhost:8080访问,然后将所有请求都转到baidu.com。则可以使用如下配置
钉钉内部应用开发之手机本地域名访问
钉钉内部应用开发之手机本地域名访问

重写Rewrite
rewrite 属性玩过nginx的想必大家都不陌生,这个nginx的重写是一样的。
同理,找到tool->rewrite
钉钉内部应用开发之手机本地域名访问
可以像下面这样配置
钉钉内部应用开发之手机本地域名访问
上面的location表示我们需要访问的地址,也就是经过上一步转发后的地址。下面的是一个规则配置:
我们可以有多种选择钉钉内部应用开发之手机本地域名访问
钉钉内部应用开发之手机本地域名访问
在这里我们可以选择是新增请求头,还是修改都支持。
这里我们选择新增cookie,这个cookie是我们在pc端登陆后获取的,直接填充进去
钉钉内部应用开发之手机本地域名访问
至此,我们就可以完整的在通过手机来模拟hostsmapping配置了。

缺点

cookie信息的获取依赖手动填写,有插件或者脚本自动从转发之前的请求获取将更完美。当然如果是基于请求Header的jwt形式的验证方式则没必要这么麻烦。

Reference

1. charles本地调试之map和rewrite功能
2. 抓包工具charles的使用