2. 程式人生 > >介面除錯神器Reveal

介面除錯神器Reveal

阿新 • • 發佈：2018-12-23

Reveal是iOS開發工具中的神器之一，它能夠在應用程式執行過程中除錯應用程式介面。 通過Reveal我們可以連線到應用程式，並允許開發者編輯各種使用者介面引數，結果會馬上在使用者介面上呈現。就像Web開發人員用瀏覽器提供的開發人員工具除錯頁面一樣，Reveal允許開發者在不修改程式碼、不重新構建專案、不重新部署應用程式的情況下就能夠除錯iOS應用的使用者介面。

安裝Reveal

整合指南

整合Reveal無需新增任何程式碼，無需引入任何標頭檔案。庫將會在應用啟動時自動載入，並在您的應用內部啟動必要的Reveal服務。

三種整合方式

靜態連線

將Reveal的靜態庫檔案連線入應用，是最簡單快捷地啟用Reveal檢視的方式。

警告: 不要將Reveal庫檔案隨著正式應用一起釋出。 下面的步驟將會展示如何通過構建配置，而把Reveal靜態庫檔案，僅連線到除錯構建的流程中。

  1. 在Xcode中開啟您的iOS工程。

  2. 啟動Reveal並選擇Help → Show Reveal Library in Finder，這將會開啟Finder視窗，並顯示一個名為iOS-Libraries的資料夾。

  3. 將 Reveal.framework 檔案拖入Xcode中的Project Navigator面板。

  4. 在下圖所顯示的Add to targets對話方塊中，選擇所有您希望與Reveal整合的target。可選步驟：選中Copy items if needed

    ，將會把 Reveal.framework 拷貝到工程中——如果您這麼做了， 請記住，當更新Reveal至新版本時，也依照上述步驟再次更新此庫檔案。

  5. 點選Finish。

  6. 選擇Build Settings標籤，在Other Linker Flags的Debug配置項中加入如下配置。

    -ObjC -lz -framework Reveal

  7. 如果您使用的是Xcode 7, 請確認 Reveal.framework 所在的目錄在您的工程配置項 “Framework Search Paths” 中。具體的內容看起來會像這樣。

    FRAMEWORK_SEARCH_PATHS = $(inherited)
     
     "$(SYSTEM_APPS_DIR)/Reveal.app/Contents/SharedSupport/iOS-Libraries"

  8. 在Xcode中，構建並執行您的應用。如果應用運行於真實裝置之上，請確保此裝置與正在執行Reveal的Mac機器，處於同一Wi-Fi網路中。

    如果一切正常執行，請切換到Reveal應用，此時您的應用應會出現在應用選擇器的下拉列表當中。選中您的應用，確認可以看到此時正在模擬器（或裝置）中執行的應用介面截圖。

動態載入

動態載入允許iOS應用在執行時，可以按需地載入第三方庫。採用這種方式，庫檔案無需連線入應用的可執行檔案，而是被加入到了應用Bundle中去，從而在執行時能按需載入。這種方式使得開發者可以在個人應用中，完全自由地控制Reveal庫的載入，以及其服務的啟動與停止。

將Reveal加入您的Xcode工程，使得您團隊中的其他成員無需任何額外的配置，就可以使用Reveal。

警告: 永遠不要將包含Reveal動態庫檔案的應用正式釋出。Apple不允許將含有動態載入庫檔案的iOS應用釋出到Apple商店中。

  1. 在Xcode中開啟您的iOS工程。

  2. 啟動Reveal並選擇Help → Show Reveal Library in Finder，這將會開啟Finder視窗，並顯示一個名為iOS-Libraries的資料夾。

  3. 將 libReveal.dylib 檔案拖入Xcode中的Project Navigator面板。

  4. 在下圖所顯示的Add to targets對話方塊中，反選所有的target。這確保了Xcode不會在編譯時連線動態庫檔案。可選步驟：選中Copy items if needed，將會把 libReveal.dylib 拷貝到工程中——如果您這麼做了， 請記住，當更新Reveal至新版本時，也依照上述步驟再次更新此庫檔案。

  5. 點選Finish。

  6. 在Copy Bundle Resources配置區域中，加入libReveal.dylib。

  7. 在Link Binary With Libraries配置項中：

    • ​如果已有libReveal.dylib，請將其移除——不應在編譯時連線dylib檔案。
    • 如果下列系統框架與庫檔案還不存在，請將他們加入：
      • libz.tdb
      • CFNetwork.framework
      • QuartzCore.framework
      • CoreGraphics.framework - Xcode一般預設會在工程中包含此框架檔案。

  8. 為了能在debugger之外，將庫檔案動態地載入裝置上的應用，您需要在構建過程中加入對libReveal.dylib檔案的code sign。

    進入target的Build Phases標籤頁，選擇Editor → Add Build Phase → Add Run Script選單。在Run Script階段中加入以下內容:

    set -e

if [ -n "${CODE_SIGN_IDENTITY}" ]; then
    codesign -fs "${CODE_SIGN_IDENTITY}" "${BUILT_PRODUCTS_DIR}/${FULL_PRODUCT_NAME}/libReveal.dylib"
fi

  9. 將下面的程式碼加入到專案中合適的類檔案中(例如您的UIApplicationDelegate)，適當修改使之滿足您的需要：

    Swift:

    // MARK: - Reveal

func loadReveal() {
    if NSClassFromString("IBARevealLoader") == nil {
        let revealLibName = "libReveal" // or "libReveal-tvOS" for tvOS targets
        let revealLibExtension = "dylib"
        var error: String?

        if let dylibPath = NSBundle.mainBundle().pathForResource(revealLibName, ofType: revealLibExtension) {
            print("Loading dynamic library \(dylibPath)")

            let revealLib = dlopen(dylibPath, RTLD_NOW)
            if revealLib == nil {
                error = String(UTF8String: dlerror())
            }
        } else {
            error = "File not found."
        }

        if error != nil {
            let alert = UIAlertController(title: "Reveal library could not be loaded",
                                        message: "\(revealLibName).\(revealLibExtension) failed to load with error: \(error!)",
                                 preferredStyle: .Alert)
            alert.addAction(UIAlertAction(title: "OK", style: .Default, handler: nil))
            UIApplication.sharedApplication().windows.first?.rootViewController?.presentViewController(alert, animated: true, completion: nil)
        }
    }
}

    Objective-C:

    
#pragma mark - Reveal


- (void)loadReveal
{
    if (NSClassFromString(@"IBARevealLoader") == nil)
    {
        NSString *revealLibName = @"libReveal"; // or @"libReveal-tvOS" for tvOS targets
        NSString *revealLibExtension = @"dylib";
        NSString *error;
        NSString *dyLibPath = [[NSBundle mainBundle] pathForResource:revealLibName ofType:revealLibExtension];

        if (dyLibPath != nil)
        {
            NSLog(@"Loading dynamic library: %@", dyLibPath);
            void *revealLib = dlopen([dyLibPath cStringUsingEncoding:NSUTF8StringEncoding], RTLD_NOW);

            if (revealLib == NULL)
            {
                error = [NSString stringWithUTF8String:dlerror()];
            }
        }
        else
        {
            error = @"File not found.";
        }

        if (error != nil)
        {
            NSString *message = [NSString stringWithFormat:@"%@.%@ failed to load with error: %@", revealLibName, revealLibExtension, error];
            UIAlertController *alert = [UIAlertController alertControllerWithTitle:@"Reveal library could not be loaded"
                                                                           message:message
                                                                    preferredStyle:UIAlertControllerStyleAlert];
            [alert addAction:[UIAlertAction actionWithTitle:@"OK" style:UIAlertActionStyleDefault handler:nil]];
            [[[[[UIApplication sharedApplication] windows] firstObject] rootViewController] presentViewController:alert animated:YES completion:nil];
        }
    }
}

    警告: 不要在釋出（release）構建中呼叫此方法，確保僅是在應用的除錯（debug）構建中載入libReveal.dylib。

  10. 一個簡單的整合方式是，在-[UIApplicationDelegate applicationDidBecomeActive:]方法中呼叫上面宣告的- (void)loadReveal方法，以確保Reveal庫儘早地被載入進來。
    Swift:

    1. func applicationDidBecomeActive:(application: UIApplication) {
 self.loadReveal()
}

    Objective-C:

    (void)applicationDidBecomeActive:(UIApplication *)application
{
[self loadReveal];
}

    提示: 在-[UIApplicationDelegate applicationDidBecomeActive:]方法返回之前載入庫的一個好處是，將會讓Reveal服務在應用啟動的同時也自動啟動。

    如果您不希望如上述步驟自動啟動Reveal服務，也可以以手動的方式來啟動，例如通過一個Debug按鈕。在應用啟動後，自己呼叫loadReveal方法，然後再分發一個名為IBARevealRequestStart的NSNotification:
    Swift:

    func startReveal() {
    NSNotificationCenter.defaultCenter().postNotificationName("IBARevealRequestStart", object: nil)
}

    Objective-C:

    - (void)startReveal
{
    [[NSNotificationCenter defaultCenter] postNotificationName:@"IBARevealRequestStart" object:nil];
}

  11. 在Xcode中，構建並執行您的應用。如果一切正常執行，請切換到Reveal應用，此時您的應用應會出現在應用選擇器的下拉列表當中。選中您的應用，確認可以看到此時正在模擬器（或裝置）中執行的應用介面截圖。

CocoaPods

CocoaPods 是一款針對iOS與OSX專案的依賴管理系統。它大大簡化了以往Xcode工程裡，對第三方庫的依賴管理與配置工作。

CocoaPods提供了Podspec用於將Reveal整合入您的專案。

警告: 不要將連線了Reveal庫檔案的應用用於正式釋出。下面的指南描述了一種使用構建配置來使Reveal靜態庫檔案僅在除錯構建中連線的方式。

此說明要求您在之前已經在專案中配置好了CocoaPods，若不然，請先行配置Cocoapods。

  1. 將下面內容加入你的Podfile中：

    pod 'Reveal-iOS-SDK', :configurations => ['Debug']
  2. 在專案的根目錄下執行 pod install 命令（如果之前已經在專案中使用了Cocoapods，請執行 pod update 命令）。

從您的Xcode專案中移除Reveal

根據您實際所選擇的Reveal整合方式，請根據下述相關步驟來移除Reveal。

一旦庫檔案成功的移除後，下面的內容將不再會在您的應用啟動時出現在Xcode控制檯:

INFO: Reveal Server started (Protocol Version X).

靜態連線

  1. 開啟您的Xcode工程。
  2. 從 Project Navigator 中刪除 Reveal.framework 的引用。
  3. 在Xcode的 Project Navigator中選中您的工程，對於每一個集成了Reveal得target，請選擇 Build Settings 標籤頁，將下面內容從 Debug 配置中的 Other Linked Flags 設定中移除：
    • -framework Reveal
    • -ObjC and -lz (刪除前請確認此配置內容僅是用於Reveal)。
  4. 搞定 - 執行應用，確認Reveal沒有和應用連線上。

動態連線

  1. 開啟您的Xcode工程。
  2. 從 Project Navigator 中刪除 libReveal.dylib 的引用。
  3. 在Xcode的 Project Navigator中選中您的工程，對於每一個集成了Reveal得target，選擇 Build Phases 標籤頁，如果下列庫檔案僅供Reveal使用的話，請將它們從 Link Binary With Libraries 配置中移除：
    • libz.dylib
    • CFNetwork.framework
    • QuartzCore.framework
    • CoreGraphics.framework
  4. 將自定義的codesign內容從 Build Phases 下的 Run Script 中刪除。
  5. 將 loadReveal / startReveal 方法從您的程式碼中刪除。
  6. 搞定 - 執行應用，確認Reveal沒有和應用連線上。

CocoaPods

  1. 在您的Podfile檔案中刪除下面這行內容：

    pod 'Reveal-iOS-SDK', :configurations => ['Debug']

  2. 在專案的根目錄下執行 pod update 命令。

  3. 如果您的 Podfile 中只有 Reveal-iOS-SDK 一個pod依賴，請根據此說明，將CocoaPods從專案中完全移除。

  4. 搞定 - 執行應用，確認Reveal沒有和應用連線上。

顯示效果

上圖是Reveal的執行介面，其介面主要分成3部分：

  • 左邊部分是整個介面的層級關係，在這裡可以以樹形級層的方式來檢視整個介面元素。

  • 中間部分是一個視覺化的檢視區域，使用者可以在這裡切換2D或3D的檢視方式，這裡看到的也是程式執行的實時介面。

  • 右邊部邊是控制元件的詳細引數檢視區域，當我們選中某一個具體的控制元件時，右邊就可以顯示出該控制元件的具體的引數列表。我們除了可以檢視這些引數值是否正確外，還可以嘗試修改這些值。所有的修改都可以實時反應到中間的實時預覽區域。

重要提示

  1. 不要將連線了Reveal庫檔案的應用正式釋出。 Reveal的檢視機制，會將您應用的許多內部資訊暴露出來，而這將很可能導致您的應用被Apple審查團隊拒絕釋出。Reveal的目的僅用於內部開發與應用除錯。
  2. 當iOS應用進入後臺後，Reveal服務將會自動停止。 當應用重新開啟時，它又會自動啟動。
  3. Reveal支援基於iOS 7及更新版本而編譯的應用。 構建配置中的iOS Deployment Target也必須是’iOS 7.0’或更新版本。 如果iOS版本太舊，您有可能會在構建應用過程中遇到連線錯誤。
  4. Reveal使用Bonjour協議來連線執行時的iOS應用。 如果您的iOS應用是執行在真實的裝置之上，那麼此裝置也需要處在同一個網路之內，以便電腦上的Reveal應用能夠與之連線。如果您在連線應用時仍遇到問題，請先檢查防火牆和代理設定，以確保它們沒有阻礙通訊。

用Reveal除錯其它應用介面

如果你的裝置越獄了，那麼還可以用Reveal來”除錯“其它應用介面，什麼時候會有這種奇怪的需求呢？——當我們想學習別人是如何實現介面效果的時候。iOS裝置的目錄/Library/MobileSubstrate/DynamicLibraries 下存放著所有在系統啟動時就需要載入的動態連結庫，所以我們只需要將Reveal的動態連結庫上傳到該目錄即可。

對於越獄的裝置，我們可以在安裝OpenSSH之後，用scp來上傳該檔案。具體步驟如下：

將libReveal.dylib 上傳到 /Library/MobileSubstrate/DynamicLibraries
如果libReveal.dylib沒有執行許可權，用chmod +x libReveal.dylib命令，給其增加執行許可權
執行 killall SpringBoard 重啟桌面

相關推薦

介面除錯神器Reveal

Reveal是iOS開發工具中的神器之一，它能夠在應用程式執行過程中除錯應用程式介面。 通過Reveal我們可以連線到應用程式，並允許開發者編輯各種使用者介面引數，結果會馬上在使用者介面上呈現。就像Web開發人員用瀏覽器提供的開發人員工具除錯頁面一樣，Revea

除錯大叔V2.0.2(2018.11.18)|http/s介面除錯、資料分析程式設計師輔助開發神器

2018.11.18 - 除錯大叔 V2.0.2*支援http/https協議的get/post除錯與反饋；*可儲存請求協議的記錄；*內建一批動態引數，可應用於Referer、URL、引數；支援自定義常量引數；支援自定義UA資訊(解決模擬不同網站或手機請求)； *可自由管理cookie；*支援請求的代理與模擬

iOS 以優雅的方式跟後臺聊3840 之 介面除錯“搖一搖”

背景 3840是除錯介面時，經常遇到的問題 每次除錯，都只能在 Xcode 的控制檯檢視日誌 這意味著，每次都要先執行程式，才能檢視具體原因 有沒有一種方式 不用每次都在控制檯看日誌看資料 就能找具體的原因呢？ 產生 經後臺同事的提醒 想寫一個除

eruda.js 移動端除錯神器使用教程（eruda）

在日常的移動端開發時，一般都是試用chrome瀏覽器的移動端模式進行開發和除錯，只有在chrome除錯完成，沒有問題了才會上到真機測試，移動端開發的一大問題就在於此， 各種品牌各種型號手機，手機中各種型別的瀏覽器APP........還好移動端的相對一致點，但是往往都會有一些各種各

微信公眾號介面除錯流程

微信公眾號開發追重要的就是要把微信與雲連線起來。 1.進入測試 2.申請好雲： 3.開始配置： 1.不管怎麼樣，先在雲空間里根目錄下放置了一個token/index.php檔案，這個檔案的內容為（另存檔案index.php) index.php裡的token值，這個

[後端開發]支付寶支付介面除錯 （Python v3.6）

寫在前面：     講真，一開始接到這個任務我是拒絕的。因為支付寶官方沒有提供Python的SDK環境，只有JAVA/PHP/.NET三種語言的SDK，這意味著簽名&驗籤、HTTP介面請求等操作全都要自己手動實現，就算支付寶提供了簽名、驗籤的演算法說明，但僅靠它的

TensorFlow之deeplab語義分割API介面除錯

在之前的文章中，對tensorflow目標檢測API進行了詳細的測試，成功應用其模型做簡單的檢測任務。本文對另一模組DeepLab的API進行測試，實現語義分割。 經過了好幾天的吐血折騰，終於將該模組調通，其中的bug真是數不勝數…… 1 檔案結構 首先在research/deepl

玩轉介面測試神器：Postman

說到介面測試，必然會叫人聯想到 Postman。但是或許你使用的只是 Postman 的皮毛，本場 Chat 將帶你學習使用 Postman 的高階用法。 主要內容包括如下方面： 如何用 Postman 做介面自動化，包括引數迭代、指定執行介面順序，以及常用的 JS 指令碼； 如何用

Vue除錯神器vue-devtools

手動安裝方法： 1.找到vue-devtools的github專案，並將其clone到本地. vue-devtools git clone https://github.com/vuejs/vue-devtools.git 2.安裝專案所需要的npm包 $ npm ins

Vue除錯神器之Vue.js devTools

Vue專案中使用Vue.js devTools這款除錯神器，可以極大程度的提高我們的開發效率。 安裝 1、開啟Chrome網上應用商店安裝外掛（自牆）,直接搜尋devTools安裝即可。貴賓傳送陣，請戳這裡→Chrome網上應用商店 2、從github上下載到本地。貴賓傳送陣，請戳這裡→vue-devt

vue中使用vconsole--移動端除錯神器

Vue中使用vconsole除錯手機移動端的點選事件 先使用npm install vconsole下載安裝依賴包 在Vue專案中新建 vconsole.js 檔案 ,在檔案中寫入 import Vconsole from 'vconsole' const vConsole = ne

Postman 介面測試神器

Postman 是一個介面測試和 http 請求的神器，非常好用。 Postman 的優點： 支援各種的請求型別: get、post、put、patch、delete 等 支援線上儲存資料，通過賬號就可以進行遷移資料 很方便的支援請求 header 和請求引數的設

Arduino與Vrep的ROS介面除錯

系統環境：Ubuntu18.04、Arduino UNO、ROS Melodic、V-rep 3.5.0 最近專案需要做個機械臂，於是就想借此機會用ROS把這個東西做出來，介於樹莓派對於舵機的控制性能實在有些尷尬，最後還是用了Arduino作為一個ROS結點。 1、Ard

Eruda 一個被人遺忘的除錯神器

引言   日常工作中再牛逼的大佬都不敢說自己的程式碼是完全沒有問題的，既然有問題，那就也就有除錯，說到除錯工具，大家可能對於 fiddler、Charles、chrome devtools、Firebug、還有Safari遠端除錯等比較熟悉，甚至有些是我可能也沒有用過的；   這裡噴一句吧，誰都別給我提I

Eruda——手機網頁前端除錯面板 移動端除錯神器（eruda）

移動端除錯神器（eruda）   在日常的移動端開發時，一般都是試用chrome瀏覽器的移動端模式進行開發和除錯，只有在chrome除錯完成，沒有問題了才會上到真機測試，移動端開發的一大問題就在於此， 各種品牌各種型號手機，手機中各種型別的瀏覽器APP........還

Vue除錯神器vue-devtools安裝

vue-devtools是一款基於chrome遊覽器的外掛，用於除錯vue應用，這可以極大地提高我們的除錯效率。接下來我們就介紹一下vue-devtools的安裝。 chrome商店直接安裝 vue-devtools可以從chrome商店直接下載安裝，非常簡單，這裡就

Eruda 一個被人遺忘的移動端除錯神器

引言 ​　　日常工作中再牛逼的大佬都不敢說自己的程式碼是完全沒有問題的，既然有問題，那就也就有除錯，說到除錯工具，大家可能對於fiddler、Charles、chrome devtools、Firebug、還有Safari遠端除錯等比較熟悉，甚至有些是我可能也沒有用過的； 　　這裡噴一句吧，誰都別給我

LLDB除錯神器之Chisel的安裝

最近看到好多人在安裝chisel的時候遇到各種問題安裝不上，按照github的提示，查看了一些資料還是不行。 因此寫一下自己當時安裝chisel時遇到的問題。希望對大家有所幫助。關於chisel命令的

Eruda 一個小而美的除錯神器

引言 ​　　日常工作中再牛逼的大佬都不敢說自己的程式碼是完全沒有問題的，既然有問題，那就也就有除錯，說到除錯工具，大家可能對於fiddler、Charles、chrome devtools、Firebug、還有Safari遠端除錯等比較熟悉，甚至有些是我可能也沒有用過的； 　　這裡噴一句吧，誰都別給我

記一次http介面除錯問題

在開發工程中，在開發工程中，我們經常會遇到和其它第三方廠家有介面資料來往的情況。這是一次我們作為客戶端去獲取另一個廠家推流的直播地址的介面，這個介面情況有些不一樣，我們需要在一個介面中封裝兩次http請求，大概場景是這樣的： 第一次呼叫方式是POST，第二次是Get，第