http://console.re/

https://github.com/kurdin/console-remote

前文提到在手机微信上调试代码很痛苦，看不到日志。为了看到日志，得把日志发到服务器，再搞个东西看服务器上的日志。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/ 看日志

例子：

  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4.     <meta charset="utf-8">
  5.     <meta http-equiv="X-UA-Compatible" content="IE=edge">
  6.     <title>logtest</title>
  7.      <script src="http://console.re/connector.js" data-channel="trylog" id="consolerescript"></script>
  8. </head>
  9. <body>
  10. <h1>See the log: <a href="http://console.re/trylog" target="_blank">http://console.re/trylog</a></h1>
  11. <h1><a href="javascript:test()">click me to add log</a></h1>
  12. <script>
  13.     function test(){
  14.         console.re.log('remote log test');
  15.         return false;
  16.     }
  17. </script>
  18. </body>
  19. </html>

写了个wrapper。根据是否有console.re来调用log。方便调试。

  1. window.log = function(){
  2.   if(console.re){
  3.      console.re.log.apply(console.re,arguments);
  4.   }else{
  5.     console.log.apply(console,arguments);
  6.   }
  7. };

远程log调试工具console.re的更多相关文章

  1. js调试工具Console命令详解

    这篇文章主要介绍了js调试工具Console命令详解,需要的朋友可以参考下   一.显示信息的命令 复制代码 代码如下: < !DOCTYPE html> < html> &l ...

  2. 【F12】谷歌浏览器F12前端调试工具 Console

    谷歌浏览器F12前端调试工具 Console 前言 先上图:不知道有多少人发现,在浏览器开发工具的“Console”上的百度首页的关于百度招聘的信息: 今天要给大家介绍的就是是Web前端调试工具中的C ...

  3. js调试工具console详解

    #console基本输出方法,占位符:字符(%s).整数(%d).浮点数(%f)和对象(%o) console.log('日志'); console.info('信息'); console.error ...

  4. var a = {m:1}; var b = a; a.n = b ={n:1}; console.log(a);console.log(b);

    var a = {m:1}; var b = a; a.n = b ={n:1}; console.log(a); console.log(b); 确定b为{n:1},所以a为 {m:1,n:{n:1 ...

  5. js调试工具Console命令详解——转

    一.显示信息的命令 <!DOCTYPE html> <html> <head> <title>常用console命令</title> < ...

  6. js调试工具console方法详解

    一.显示信息的方法 最常用的console.log(),一般用来调试. console.log('hello'); console.info('信息'); console.error('错误'); c ...

  7. console.log()、console.info()、console.debug()的区别

    onsole.log().console.info().console.debug()的作用都是在浏览器控制台打印信息的. 使用最多的是console.log().console.info()和con ...

  8. 一站式远程页面调试工具spy-debugger 2.0，已支持HTTPS

    项目名称: spy-debugger 项目地址:https://github.com/wuchangming/spy-debugger 关于spy-debugger npm Build Status ...

  9. JS里try...catch...finally详解，以及console日志调试(console.log、console.info等)

    <!DOCTYPE html> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <m ...

随机推荐

  1. Vue 的开始

    1 框架的 MVVM 模式 ViewModel是Vue.js的核心,它是一个Vue实例.Vue实例是作用于某一个HTML元素上的,这个元素可以是HTML的body元素,也可以是指定了id的某个元素. ...

  2. gRPC之Node Quick Start

    在node环境下我们使用一个小例子作为引导: 在开始之前请确认如下: 1.node:版本在0.12以上 下载这个例子 为了更好地开始这个例子,你需要在本地对这个例子代码做一个备份.下载这个例子的代码从 ...

  3. 微信小程序 template添加点击事件

    介绍template是微信小程序提供的模板,可以在模板中定义代码片段,然后在不同的地方调用. 简单使用定义template因为项目中可能会需要到不止一个template,所以最好新建一个文件夹来存放t ...

  4. linux分享四：cron系统

    cron相关文件: /etc/cron.monthly/ /etc/cron.weekly/ /etc/cron.daily/ /etc/cron.hourly/ /etc/cron.d/ /etc/ ...

  5. Shell脚本大量示例

     Shell基础之控制流结构 一.控制结构 几乎所有的脚本里都有某种流控制结构,很少有例外.流控制是什么?假定有一个脚本,包含下列几个命令: #!/bin/sh # make a directory ...

  6. PHP+FastCGI+Nginx配置PHP运行环境方法

    PHP+FastCGI+Nginx配置PHP运行环境 Nginx不支持对外部程序的调用,所以必须通过FastCGI接口实现对外部程序的调用从而实现对客户端动态页面请求的处理. CGI的英文全称为Com ...

  7. git clean 小结

    删除 一些 没有 Git add 的 文件: git clean 参数 -n 显示 将要 删除的 文件 和  目录 -f 删除 文件,-df 删除 文件 和 目录 git clean -n git c ...

  8. lua -- 字体闪烁

    -- 这里是实现控件的闪烁,不能将一个局部的动作变量,赋给两个控件来动作,只能一个控件对应一个动作 function UIBagController:ShowEffect( ) local tGood ...

  9. 调试web api的工具 谷歌插件 Restlet

    介绍 http://chromecj.com/productivity/2017-08/789.html

  10. [SQL Server 2014] SQL Server 2014新特性探秘

    SQL Server 2014新特性探秘(1)-内存数据库   简介 SQL Server 2014提供了众多激动人心的新功能,但其中我想最让人期待的特性之一就要算内存数据库了.去年我再西雅图参加SQ ...