• 移动端调试利器 JSConsole 介绍


    先看这篇文章 Web应用调试:现在是Weinre和JSConsole,最终会是WebKit的远程调试协议

    我们先不看未来,从此文可见,当下的移动端调试还是 Weinre 和 JSConsole 的天下。Weinre 我们在前面已经有所了解(详见 移动端页面(css)调试之“weinre大法”),它主要是为了移动端 css 的调试,能兼容各种浏览器,支持 css 修改,且不用刷新就能在移动端看到效果。今天我们来了解下另一种利器 —— JSConsole。

    移动端的调试最蛋疼的恐怕就是想打印些东西了,alert 太简单粗暴,为此,有人写了 debug.js 插件,但是对于 JSConsole 来说,完全是鸡肋!

    JSConsole 是一个风格和 Weinre 类似的工具,它更多地关注于控制台输出和代码求值。在访问JSConsole 的网站的时候,用户输入 “:listen” 来获得带有 GUID 的一段 JavaScript 代码。这段代码需要被加入到待调试的网页中。于是,在加载网页的时候,代码将会连接到 JSConsole 服务器,并且根据 GUID 将此会话和用户的会话关联起来,于是用户浏览器中的控制台现在便已经处于待调试网页的 JavaScript 运行时环境中了。

    JSConsole 使用方法真的很简单。

    首先打开 JSConsole

    接着在打开的网页输入 :listen,将会得到一串 GUID 以及一对带有 src 属性的 Javascript 标签,如下图:

    将这个 Javascript 脚本插入到需要调试的 html 页面中,比如这样:

    复制代码<script src="http://jsconsole.com/remote.js?BDA15940-A201-4EAB-9482-941CD41742EC"></script>
    <script>
        var a = 1
          , b = 2;
    
        console.log(a + b);
    </script>

    然后刷新你本地需要调试的页面(PC端或者移动端),如果是第一次打开的话,会弹出下图内容,大概意思就是告诉你现在引入了 JSConsole 的一段 js 进行调试,记得在上线时将它移除。

    在打开 JSConsole 的页面便会输出 console 的内容;如果页面 JS 报错,一般情况下也能在 JSConsole 中进行定位。

    这里需要提醒的是,刷新的是本地页面,而并不是 JSConsole 的页面,一旦刷新 JSConsole 的页面,便会生成一个新的 GUID,这样之前生成的就没用了,调试也就失效了。

  • 相关阅读:
    C#中的取整函数
    java代码(8) ---guava字符串工具
    java代码(7) ---guava之Bimap
    java代码(6) ---guava之multimap
    java代码(5) ---guava之Multiset
    java代码(4)---guava之Immutable(不可变)集合
    java代码(2)---Java8 Stream
    java代码(3)----guava复写Object常用方法
    java代码(1)---Java8 Lambda
    看完这篇HTTP,跟面试官扯皮就没问题了(转)
  • 原文地址:https://www.cnblogs.com/zhangyuhang3/p/6873320.html
Copyright © 2020-2023  润新知