2. 程式人生 > >如何從 Xcode 控制檯輸出 JavaScript 的 log？

如何從 Xcode 控制檯輸出 JavaScript 的 log？

阿新 • • 發佈：2019-01-18

除錯 UIWebView 中的 JavaScript 一直以來都是很痛苦的一件事。通常我們會通過下面的方法除錯 HTML 和 JavaScript。

1、第一種，使用桌面瀏覽器除錯。大多數現代瀏覽器都有功能強大的偵錯程式，可以通過 console.log() 方法進行除錯。

2、如果桌面瀏覽器不能追蹤到這些 log，我們可以從 Xcode 啟動 iOS 模擬器，執行我們的 app。然後，啟動 Safari 選擇 Develop > iPhone Simulator > tieba.baidu.com

3.如果你不能在 iOS 模擬器上覆現問題，也不能從執行在 iPhone 真機上的 APP 獲得 console.log()，要除錯 HTML 或者 JavaScript 是非常困難的。這篇文章就教你怎麼用 NSLog 輸出 JavaScript 中的 log。

把 JavaScript Log 轉化成 Application Log

最基本的思路是這樣的：為了把 JavaScript 的 log 現實出來，我們需要給debugger 發出一個 XMLHttpRequest，發起一個特殊的請求，把 Log 資訊當做請求的路徑，debugger 當做 host 名，例如: http://debugger/myError。我們可以通過 Apple 提供給我們的黑科技 NSURLProtocl 截獲所有從 UIWebView 發起的請求。如果請求裡有 「debugger」，就是用 NSURLProtocol 呼叫 NSLog 列印這些 log。
假設你的工程裡有一個檔案叫做 Sample.html

<html>
<head>
<script>
function log(msg) {
  var xhr = new XMLHttpRequest();
  xhr.open('GET', "http://debugger/" +
    encodeURIComponent(msg));
  xhr.send(null);
}

function test() {
  log("Button was clicked");
  log("We are done");

  return false;
}
</script>
</head>

<body>
<button onclick="return test();">Click Me</button>
</body>

</html>
接下來，建立一個 NSURLProtocol 的子類 WebConsole 
/WebConsole.h
@interface WebConsole : NSURLProtocol
+ (void) enable;
@end

//WebConsole.m
@implementation WebConsole
+ (void) enable {
  [NSURLProtocol registerClass:[WebConsole class]];
}

+ (BOOL) canInitWithRequest:(NSURLRequest *)request {
  if ([[[request URL] host] isEqualToString:@"debugger"]){
    NSLog(@"%@", [[[request URL] path] substringFromIndex: 1]);
  }

  return FALSE;
}
@end

通過 canInitWithRequest 檢查截獲的請求，如果請求的 host 是「debugger」就用 NSLog 把這個請求的 「path」（也就是 JavaScript 的 log）輸出。
最後我們只需要在 UIWebView 載入請求之前呼叫 enable，註冊這個類，就能夠通過攔截 UIWebView 發起的請求列印 JavaScript 的 log 了。 
- (void)viewDidLoad {
  [super viewDidLoad];

  [WebConsole enable];

  NSError *error = nil;
  NSString *htmlStr = [NSString stringWithContentsOfFile:
    [[NSBundle mainBundle]
      pathForResource:@"Sample" ofType:@"html"]
      encoding:NSUTF8StringEncoding
      error:&error];

  [self.webView loadHTMLString:htmlStr baseURL:nil];
}



相關推薦

如何從 Xcode 控制檯輸出 JavaScript 的 log？

除錯 UIWebView 中的 JavaScript 一直以來都是很痛苦的一件事。通常我們會通過下面的方法除錯 HTML 和 JavaScript。 1、第一種，使用桌面瀏覽器除錯。大多數現代瀏覽器都有功能強大的偵錯程式，可以通過 console.log() 方法進行除

Xcode控制檯輸出中文

建立一個.m檔案，然後將一下程式碼加入.m檔案中即可實現控制檯輸出中文，具體程式碼如下： #ifndef Release @implementation NSSet(Log) - (NSString *)descriptionWithLocale:(id)locale indent:(NSUInt

Windows伺服器啟動Tomcat時，設定編碼和將控制檯輸出到log檔案

1.修改CMD控制編碼：CHCP 65001 設定編碼為UTF-8； 2.開啟TOMCAT目錄下bin下的startup.bat中的 call "%EXECUTABLE%" start %CMD_LINE_ARGS%     改為call "%EXECUTABLE%" ru

iOS開發之如何關閉Xcode控制檯的所有輸出

一執行工程發現控制檯輸出一大堆內容，怎麼把它關掉呢。 1.原始的列印資料包括xcode列印的，第三方庫的，還有自己寫的 2.通過在pch裡，巨集定義把NSLog替換後發現少了很多自己寫的列印 #define NSLog(...) //NSLog(__VA_ARGS_

Storm1.2.2(控制檯輸出指定級別的Log資訊)

寫storm的時候，有的時候控制檯會輸出很多很多的“INFO”資訊，造成自己寫的System.out.println之類的資訊會被沖刷掉，做接下來的配置能夠有效地輸出指定Log資訊。 在class

【C#】從控制檯輸出1-100之間的數

private static void Print(int number) { Console.WriteLine(number); i

Retrofit使用Log攔截器在控制檯輸出Log

一、使用自定義Log攔截器 1、建立自定義Log攔截器類 class LoggingInterceptor implements Interceptor { @Override public Response intercept(Chai

利用javascript在控制檯輸出1到100之間所有的質數

      首先讓j遍歷1到100之間的數，再讓i遍歷2到j之間的數（因為質數定義為智慧被1和自身整除），使得j%i不等於0，第一時間跳出迴圈，質數條件不成立，所以設定flag=1和braek；如果j

接收從鍵盤輸入的字串格式的年齡，分數和入學時間 轉換為整數、浮點數、日期型別，並在控制檯輸出（型別轉換）

package test; import java.text.ParseException; import java.text.SimpleDateFormat; import java.util.Date; import java.util.Scann

第五十八題（從尾到頭輸出鏈表）

urn stream 尾到頭 csdn ext fontsize 方法 name html 58.從尾到頭輸出鏈表。 題目：輸入一個鏈表的頭結點，從尾到頭反過來輸出每一個結點的值。 思路：題不難，提供幾種思路 1.使用棧的先進後出特性實現，遍歷鏈表元素依次入棧，再出棧

鏈表從尾到頭輸出

line import log pac span [] ati nod imp 將一個鏈表從尾到頭輸出。 使用了棧。 1 package OnlineTest; 2 3 /* 4 * 一個鏈表，從尾到頭打印鏈表每個節點的值。 5 * */ 6 7 i

輸入一個任意位數的的整數, 從個位開始輸出每一位的數

display aps span 要求 pan 一位數 去掉 img hid 題目要求: 輸入一個任意位數的的整數, 從個位開始輸出每一位的數, 每次輸出的一位數可以用%10來取，然後通過把數除10去掉已輸出的位 代碼如下 #include <stdio.h&g

Linux c學習--從標準輸入輸出看流和緩沖區

pty 出錯 流的概念 code check 抽象 輸出信息 指針 架構 學習標準輸入輸出，我們都會遇到一個概念，流和緩沖區，但到底什麽是流，什麽是緩沖區呢？ 書《C Primer Plus》上說，C程序處理一個流而不是直接處理文件。後面的解釋十分抽象：『流（s

c windows控制檯輸出顏色文字

#include <windows.h> //設定文字顏色void SetColor(int ForgC){ WORD wColor; //We will need this handle to get the current background attribute HANDLE hStdOu

.net 程式碼呼叫cmd執行.exe程式,獲取控制檯輸出資訊

使用.net core 對老專案升級, .net core 使用TripleDES.Create() 加密眾iv位元組限制 與 framework中的不同, 新專案還需要相容老專案版本,還不想通過webapi 進行資料request和response, 遂想到使用控制檯輸出的形式進行嘗試,  具體程

Python 目錄 匿名函式的相關應用 迭代器 應用 python_控制檯輸出帶顏色的文字方法 time & datetime 模組 random模組 subprocess模組 hashlib模組 json&pickle模組 shelve模組 xml模組 sys模組 os 模組 sh

    匿名函式的相關應用 迭代器 應用 python_控制檯輸出帶顏色的文字方法 collections模組（提供了幾個額外的資料型別：） time & datetime 模組 random模組 subprocess模組（通過Python去執行一條系統命令或指令碼

Java 將控制檯輸出列印 輸出到本地檔案

1.將控制檯列印的資訊輸出到本地檔案 File f=new File("D:\\out.txt"); f.createNewFile(); FileOutputStream fileOutputStream = new FileOutputStream(f);

js楊輝三角控制檯輸出

function Yang(line){ var arr=new Array() for(var i=1;i<=line;i++){ if(arr[i-1]==undefined){arr[i-1]=[];} if(i==1){arr[0]=[i]}else if

logback設定控制檯輸出色彩 不同級別不同色彩

 logback.xml配置： <appender name="STDOUT" class="ch.qos.logback.core.ConsoleAppender"> <encoder class="ch.qos.logback.classic.en

在C#控制檯輸出的愛心圖案

class DrawHeart {     static void Main()     {       &nbs