console.re 最方便的js log服務

方健發表於2015-03-27

前文提到在手機微信上除錯程式碼很痛苦,看不到日誌。為了看到日誌,得把日誌發到伺服器,再搞個東西看伺服器上的日誌。console.re 就是這麼一個服務。

主要使用步驟如下:

  1. 在html檔案中引入
    <script src="http://console.re/connector.js" data-channel="<your-channel-name>" id="consolerescript"></script>
  2. console.re.log('...');記錄日誌
  3. 開啟 http://console.re/ 看日誌

例子:

<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <title>logtest</title>
     <script src="http://console.re/connector.js" data-channel="trylog" id="consolerescript"></script> 
</head>
<body>
<h1>See the log: <a href="http://console.re/trylog" target="_blank">http://console.re/trylog</a></h1>
<h1><a href="javascript:test()">click me to add log</a></h1>
<script>
    function test(){
        console.re.log('remote log test');
        return false;
    }
</script>
</body>
</html> 

寫了個wrapper。根據是否有console.re來呼叫log。方便除錯。

window.log = function(){
  if(console.re){
     console.re.log.apply(console.re,arguments);
  }else{
    console.log.apply(console,arguments);
  }
};

相關文章