知识点
- 使用浏览器调试工具分析网络请求
- 在 Android 中使用 Retrofit 实现上传、下载文件
<blockquote>
关于 waifu2x
https://github.com/nagadomi/waifu2x
http://waifu2x.udp.jp
“本程序使用卷积神经网络对动漫风格的图片进行放大操作（支持照片）。”
通俗地说，一个牛逼的<u>用于放大、降噪动漫类型图</u>的程序。<br />
waifu2x
</blockquote>
关于 Retrofit
http://square.github.io/retrofit
“A type-safe HTTP client for Android and Java”
Android 开发中一个令人爱不释手的强大的网络请求工具库。
首先，笔者须明确要干什么？
waifu2x 提供了一个在线网页工具（见上文截图）。笔者的目的是去分析网页中调用的接口，然后借助 Retrofit 完整模拟这个接口调用过程，在 Android APP 中方便地使用它。
一、分析 waifu2x 接口
笔者使用 Chrome 浏览器自带的开发者工具去探测接口（Edge、火狐等浏览器同样提供开发者工具用于网页调试）。
观察 waifu2x 页面，一个文件选择器、三组单选按钮、一个下载按钮和一个转换按钮。通过查看源码可以发现，两个按钮调用的接口一致。
接下来，选择一个图片文件，点击下载按钮，分析请求过程：
waifu2x API
接口为http://waifu2x.udp.jp/api、请求方式为 POST、图片数据以及三个参数一并传输。参数的传输方式需要特别注意，和一般 POST 不同。
通过查看网页源码，获得所有参数细节：
网页源码
| 参数名 | 参数值 |
|---|---|
风格：type
|
插图：art<br />照片：photo
|
降噪程度：noise
|
不降噪：-1<br />低：0<br />中：1<br />高：2<br />最高：3
|
放大倍数：scale
|
不放大：-1<br />1.6x：1<br />2x：2
|
二 、构造 Retrofit 接口
难点在于对请求数据的准确构造，也就是上文接口截图中 Request Payload 部分。
Retrofit 配置关键代码：
// 为什么需要配置超时？
// waifu2x 接口在处理稍大的图片时十分耗时，默认的 10s 不够用
OkHttpClient client = new OkHttpClient.Builder()
.connectTimeout(60, TimeUnit.SECONDS)
.readTimeout(60, TimeUnit.SECONDS)
.writeTimeout(60, TimeUnit.SECONDS)
.build();
Retrofit retrofit = new Retrofit.Builder()
.baseUrl("http://waifu2x.udp.jp/")
.client(client)
.build();
Retrofit 接口构造关键代码：
@POST("api")
@Multipart
Call<ResponseBody> processPng(@Part("style") RequestBody type,
@Part("noise") RequestBody noise,
@Part("scale") RequestBody scale,
@Part("file\"; filename=\"test.png") RequestBody img);
Retrofit 接口调用关键代码：
// 构造请求数据
RequestBody typeBody = RequestBody.create(MediaType.parse("text/plain"), getType());
RequestBody noiseBody = RequestBody.create(MediaType.parse("text/plain"), getNoise());
RequestBody scaleBody = RequestBody.create(MediaType.parse("text/plain"), getScale());
RequestBody RequestBody.create(MediaType.parse("image/png"), getImgBytes(srcImgUri));
// 发起请求
Call<ResponseBody> call = service.processPng(typeBody, noiseBody, scaleBody, imgBody);
ResponseBody responseBody = call.execute().body();
// 下载处理后的图片
RetrofitHelper.downloadFile(responseBody, tmpFile);
下载关键代码：
public static boolean downloadFile(ResponseBody body, File targetFile) {
...
InputStream inputStream = body.byteStream();
OutputStream outputStream = new FileOutputStream(targetFile);
...
}
在构造过程中可能需要多次尝试，如果测试发现不成功该如何检查哪一部分不对呢？
方法就是抓包。抓包的方式有多种，一般手段比如 PC 端 Fiddler 代理，由 Fiddler 抓包。这里笔者推荐一种更简单的方式，使用 Packet Capture 这款 APP 直接在 Android 设备上抓包。
Packet Capture - waifu2x
可以发现，已经构造成功。
三、总结
此文以分析 waifu2x 接口为例，记录了关键过程。抛砖引玉，您大可尝试去分析其他网站、软件、APP等的接口调用，取己所需，比如分析绿色呼吸拿到指定城市空气质量数据、分析IP地址查询拿到指定IP的所属区域信息、分析音乐站点拿到歌词或下载直链什么的、分析学校教务系统拿到课表数据等。
四、waifu2x 效果展示
动漫图例子
参数设置：
| 参数名 | 参数值 |
|---|---|
| 风格 | 插图 |
| 降噪程度 | 中 |
| 放大倍数 | 2x |
可以看出（看不出？放大看），放大后不仅没有降质，甚至好了些许
文字图例子
参数设置：
| 参数名 | 参数值 |
|---|---|
| 风格 | 插图 |
| 降噪程度 | 高 |
| 放大倍数 | 不放大 |
可以看出（看不出？放大看），处理后画面更加干净
最后安利 waifu2x，它在<u>放大</u>、<u>降噪</u>处理<u>动漫风格</u>图片这两方面均十分优秀。
类似站点：http://bigjpg.com/
网友评论