机器学习在移动端的使用,Tensorflow + BroadCast Extension(iOS原生录屏插件) 移动端爬虫解决方案

前言

传统的移动端爬虫一般是基于webView,通过注入JS的方式,获取登录后的cookie让服务端使用无头浏览器模拟登录状态爬取数据。

这种方式简单有效,但是对于有做反爬(IP限制,是否模拟器,是否处于异常环境)的网站,爬取难度大,甚至无法爬取。

业务驱动技术,在移动端爬虫的演进过程中经历了四个阶段

  • cookie爬取(早期网站都没有反爬的机制)
  • cookie + 本地爬取(部分网站出现反爬,无法通过服务端爬取,则本地获取HTML解析)
  • cookie + 本地爬取 + 截图认证(针对反爬严重,无法通过webView登录采集的业务采用跳转APP,截图OCR的方式爬取)
  • Tensorflow + BroadCast Extension(通过录屏获取实时界面内容,Tensorflow做图像识别获取关键页面内容,无视反爬机制)

什么是BroadCast Upload Extension?

BroadCast Upload Extension在iOS10的时候推出,当时只能in-APP BroadCast,即录制当前APP。

在WWDC2018中,苹果发布的ReplayKit2中升级了这个扩展,做到了iOS System BroadCast,即录制iOS系统界面,不限制与某个APP,但此时需要从控制中心唤起录屏,任然有些麻烦。

image-20191118182045340.png

在iOS12中,iOS又推出了RPSystemBroadcastPickerView类,可以在APP内通过按钮唤起控制中心的录屏选择界面。

image-20191118182105865.png

客户端流程:

image-20191118165847233.png

架构:

image-20191118151036879.png
  • 录屏插件:iOS原生录屏插件,获取最新的录屏帧,传递给中间件。
  • 中间件:保存插件传递的最新一帧内容,负责对帧对象的处理,消息的发送(心跳请求,帧请求)。
  • APP端:负责对收到的图片对象进行classify,根据结果进行步骤匹配(是否需要服务端OCR,下一个关键页面是什么)。

​ 插件端不停的将最新视频帧给到中间件,中间件在上一次post请求完毕后获取最新的一帧转换成图片对象并发送,配置文件中设置字段控制上一次post请求完毕到下一次图片转换之间的dealy时间。

​ 将帧处理成图片后做一次图片压缩(TensorFlow对图片进行检测前也会做一次压缩,这里提前做掉),保证post请求的大小和速度。

​ 为了尽量低的内存占用(录屏插件最大可使用的内存50MB,超过就会崩),控制图片转换的频率,压缩图片请求,将图片转换放到autoreleasepool中。

录屏插件端

录屏插件使用的是iOS系统自带的BroadCast Upload Extension,可以在project - target + Application Extension中添加。

image-20191118173254281.png

添加后项目中会多一个BroadCast的target,自带一个SampleHandler类,用于接收系统录屏插件的回调。

#import "SampleHandler.h"

@interface SampleHandler()
@end

@implementation SampleHandler

//开始录屏
- (void)broadcastStartedWithSetupInfo:(NSDictionary<NSString *,NSObject *> *)setupInfo {
    NSLog(@"APP录屏开始");
}

//录屏中切换APP iOS > 11.2
- (void)broadcastAnnotatedWithApplicationInfo:(NSDictionary *)applicationInfo {
    NSLog(@"录屏中切换APP");
}

//录屏结束
- (void)broadcastFinished {
    NSLog(@"APP录屏结束");
}

//获取录屏帧信息
- (void)processSampleBuffer:(CMSampleBufferRef)sampleBuffer withType:(RPSampleBufferType)sampleBufferType {
    switch (sampleBufferType) {
        case RPSampleBufferTypeVideo://录屏图像信息回调
            //在这里将获取到的图像信息传递给中间类处理
            break;
            
        case RPSampleBufferTypeAudioApp://录屏音频信息回调
            // Handle audio sample buffer for app audio
            break;
        case RPSampleBufferTypeAudioMic://录屏声音输入信息回调
            // Handle audio sample buffer for mic audio
            break;
            
        default:
            break;
    }
}

@end

这一块做的事非常少,只是单纯的将获取到的视频帧信息传递给中间类,刷新中间类保存的最后一帧信息。

中间件

中间件负责做的事情比较多,状态同步,图片转换还要考虑内存占用问题。

  • CMSampleBufferRef转UIImage对象
  • 控制buffer转image的频率
  • 通过HTTP请求的方式将图片发送到主APP
  • 发送心跳包告知APP插件存活
//
//  MXSampleBufferManager.m
//  
//  buffer转UIImage对象
//  Created by joker on 2018/9/18.
//  Copyright © 2018 Scorpion. All rights reserved.
//

#import "MXSampleBufferManager.h"
#import <VideoToolbox/VideoToolbox.h>

#define clamp(a)                        (a>255?255:(a<0?0:a))

@implementation MXSampleBufferManager

+ (UIImage*)getImageWithSampleBuffer:(CMSampleBufferRef)sampleBuffer{
    CVImageBufferRef imageBuffer = CMSampleBufferGetImageBuffer(sampleBuffer);
    CVPixelBufferLockBaseAddress(imageBuffer,0);

    size_t width = CVPixelBufferGetWidth(imageBuffer);
    size_t height = CVPixelBufferGetHeight(imageBuffer);
    uint8_t *yBuffer = CVPixelBufferGetBaseAddressOfPlane(imageBuffer, 0);
    size_t yPitch = CVPixelBufferGetBytesPerRowOfPlane(imageBuffer, 0);
    uint8_t *cbCrBuffer = CVPixelBufferGetBaseAddressOfPlane(imageBuffer, 1);
    size_t cbCrPitch = CVPixelBufferGetBytesPerRowOfPlane(imageBuffer, 1);

    int bytesPerPixel = 4;
    uint8_t *rgbBuffer = malloc(width * height * bytesPerPixel);

    for(int y = 0; y < height; y++) {
        uint8_t *rgbBufferLine = &rgbBuffer[y * width * bytesPerPixel];
        uint8_t *yBufferLine = &yBuffer[y * yPitch];
        uint8_t *cbCrBufferLine = &cbCrBuffer[(y >> 1) * cbCrPitch];

        for(int x = 0; x < width; x++) {
            int16_t y = yBufferLine[x];
            int16_t cb = cbCrBufferLine[x & ~1] - 128;
            int16_t cr = cbCrBufferLine[x | 1] - 128;

            uint8_t *rgbOutput = &rgbBufferLine[x*bytesPerPixel];

            int16_t r = (int16_t)roundf( y + cr *  1.4 );
            int16_t g = (int16_t)roundf( y + cb * -0.343 + cr * -0.711 );
            int16_t b = (int16_t)roundf( y + cb *  1.765);

            rgbOutput[0] = 0xff;
            rgbOutput[1] = clamp(b);
            rgbOutput[2] = clamp(g);
            rgbOutput[3] = clamp(r);
        }
    }

    CGColorSpaceRef colorSpace = CGColorSpaceCreateDeviceRGB();
    CGContextRef context = CGBitmapContextCreate(rgbBuffer, width, height, 8, width * bytesPerPixel, colorSpace, kCGBitmapByteOrder32Little | kCGImageAlphaNoneSkipLast);
    CGImageRef quartzImage = CGBitmapContextCreateImage(context);
    UIImage *image = [UIImage imageWithCGImage:quartzImage];

    CGContextRelease(context);
    CGColorSpaceRelease(colorSpace);
    CGImageRelease(quartzImage);
    free(rgbBuffer);

    CVPixelBufferUnlockBaseAddress(imageBuffer, 0);

    return image;
    
    
}

@end

主APP端

主APP端更多的是跟业务相关的操作

  • 开启HTTP Serve接收请求(GCDAsyncSocket)
  • 获取到图片进行TensorFlow识别,输出classify的结果。
  • 根据识别结果和获取的配置信息进行match,目标关键帧则上传服务端OCR
  • 录屏插件存活检测

模型怎么训练?

参考链接:https://codelabs.developers.google.com/codelabs/tensorflow-for-poets/index.html#0
可以用官网提供的训练工程来简单的训练模型。
demo工程中会带一个训练过的微信的模型。

使用效果

通讯录页面识别度77%
发现页面识别度97%
我的页面识别度100%

可以看到,在模型训练好的情况下,实时录屏的识别度是非常高的,配合服务端OCR可以获取任何出现在屏幕上的内容。

Demo

https://github.com/yushengchu/broadCastSpider

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 158,425评论 4 361
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 67,058评论 1 291
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 108,186评论 0 243
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 43,848评论 0 204
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 52,249评论 3 286
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 40,554评论 1 216
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 31,830评论 2 312
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 30,536评论 0 197
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 34,239评论 1 241
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 30,505评论 2 244
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 32,004评论 1 258
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 28,346评论 2 253
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 32,999评论 3 235
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 26,060评论 0 8
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 26,821评论 0 194
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 35,574评论 2 271
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 35,480评论 2 267

推荐阅读更多精彩内容

  • 越努力地工作和生活,越发觉意志力像消耗品,而且,渐渐地,我发现意志力很像一个游戏模型:血量/法力值。 这个模型由四...
    猪的梳妝台阅读 296评论 0 2
  • WEB前端导航 http://www.alloyteam.com/nav/ CDN http://www.boot...
    幸运兔脚_f0b5阅读 162评论 0 0
  • 如果说世界上有一种最伟大的爱,那一定是母爱!今天是我们河南省商丘市梁园区谢集镇良浩第四小学第十一次快乐音乐...
    沈丹丹阅读 192评论 0 0
  • 最近在首页看到了CocoaPods的安装方法,其实我也忘记了,就拿了个新电脑试了一下,结果发现搬运的还是比较老的东...
    sixthElement阅读 476评论 0 13
  • 前段时间整理保险柜,看到多年前考取的会计证和会计培训结业证书,思绪一下子回到三十年前…… 八七年,我进入一家小厂做...
    晚霞一阅读 382评论 0 4