摘要：目前埋點分為兩種方式，有碼與無碼埋點。本文主要介紹無碼埋點的技術實現。無碼埋點的實現流程可視化視圖圈選，在頁面上會出現浮動的圓圈，拖動圓圈至想配置事件的控件上，將會彈出輸入事件的彈框。

隨著大數據時代的到來，數據采集也已經變的越來越重要。前端埋點作為一個比較成熟的數據接入手段被廣泛應用著。目前埋點分為兩種方式，有碼與無碼埋點。有碼埋點比較容易理解，即調用SDK的API，在代碼中插入埋點的相關代碼，實現用戶行為采集。由于我們在開發項目的時候，埋點都是手動的，每次業務需求的改變都要到處埋點，而無碼埋點，即不需要手動插入代碼，只需要前期進行相關配置，SDK自動采集用戶行為，極大程度避免了因需求變更、埋點錯誤等原因導致的重新埋點繁復工作。本文主要介紹無碼埋點的技術實現。

無碼埋點的實現流程

1.可視化視圖圈選，在頁面上會出現浮動的圓圈，拖動圓圈至想配置事件的控件上，將會彈出輸入事件的彈框。
2.在上一步的彈框中輸入自定義的事件名稱，名稱將會和視圖的viewPath綁定起來。viewPath是視圖的唯一標識，在下文中將詳細講解。
3.用戶點擊了控件，判斷控件是否綁定過事件，如綁定則進行事件上傳。

實現流程中的技術點

可視化視圖圈選實現

自定義UIWindow的子類，當做懸浮小圓圈，添加UIPanGestureRecognizer手勢，根據手勢的位移，設置懸浮框的位移。手勢停止時獲取懸浮窗中心點的坐標。
遍歷主window上的子視圖，找到包含上述懸浮窗中心點且能響應用戶交互的最里層視圖，即為用戶可以圈選的視圖。
參考iOS控件的消息傳遞鏈，有個核心方法。UIView hitTest:(CGPoint)point withEvent:(UIEvent *)event。此API自動遍歷子視圖，找到包含point的視圖，event傳nil。由于event參數是nil,最終找到的視圖并不一定是能響應用戶手勢的視圖，如果不能響應則遍歷其父視圖，直到找到能響應用戶行為的視圖。

圈選視圖綁定事件

視圖唯一標識viewPath生成，上述步驟已經拿到了圈選的視圖。如何確定視圖的viewPath也是重點。viewPath需要整個應用唯一，才可以區別不同的事件。由于是無碼，所以只能從視圖本身的屬性去分析。我們可以把App的視圖結構理解成樹的概念，樹的根節點是UIWindow，樹的枝干由UIViewController和UIView組成，葉子節點都是UIView。那么從根節點到葉子節點的路徑可以看做是唯一的。也就是視圖的viewPath。下面介紹下實現的邏輯，viewPath由兩部分組成，第一部分是節點路徑，另一部分是與之對應的節點index。節點路徑是由每個節點的Class拼接而成，節點index，就是節點在父節點中的下標，比如子視圖在父視圖的subviews數組中的下標。下圖是遍歷節點的邏輯圖。

計算節點的index,這個步驟，有種特殊的視圖需要注意，可復用視圖的index是跟數據源相關的，比如UITableViewCell，此類視圖的index不能使用父視圖的subviews的下標代替，應該使用數據源的下標代表，比如cell的indexPath.section:indexPath.row。下面給出一個簡單視圖和可復用視圖的viewPath的例子。TestViewController-UIView-UIButton&0-0-0和TableViewController-UITableView-UITableViewCell&0-0-1:0。
如何檢測用戶觸發了綁定了事件ID的視圖也是重點，此處運用的核心技術是runtime中Method Swizzle。下面介紹一下針對不同類型的控件，如何hook相應的方法。

UIControl類型的控件hook – (void)sendAction:(SEL) to:(id)target forEvent:(UIEvent *)event

UIScrollView,UITextView,UITableView,UICollectionView 類型的控件，先hook -（void）setDelegate:(id)delegate 方法，然后再hook想要采集事件的代理方法，例如 textViewDidBeginEditing 、tableview:(UITableView )tableview didSelectRowAtIndexPath:(NSIndexPath )indexPath 等。

帶手勢事件的視圖 hook -(void)addGestureRecognizer方法，并在方法實現中給手勢對象添加新的target和action ，- (void)addTarget:(id)target action:(SEL)action。

總結

無碼埋點的關鍵技術，就是以上分析的幾點，首先通過可視化圈選拿到需要綁定事件視圖，并生成唯一標識viewPath，通過hook系統控件的方法，拿到用戶觸發的視圖，生成視圖的viewPath與本地的事件列表比對，比對成功則上傳viewPath對應的事件。

本文原創首發于Cobub官網博客，轉載請注明出處！