AngularJS 应用程序在桌面上运行良好,但在移动设备上无法正确呈现(显示实际代码)。这是在安卓手机上。
我想看看控制台中显示了哪些错误。
是否可以在移动设备上的 chrome 应用程序上打开 JS 控制台(就像在桌面上一样)?
您可以使用远程调试来完成,这里是 official documentation。基本流程:
连接您的 android 设备 选择您的设备:更多工具 > 从 pc/mac 上的开发工具检查设备*。在您的手机上进行授权。调试愉快!!
*
现在是“远程设备”。
当您手头没有 PC 时,您可以使用 Eruda,它是用于移动浏览器的开发工具 https://github.com/liriliri/eruda
它作为可嵌入的 javascript 和书签提供(在 chrome 中粘贴书签会删除 javascript: 前缀,因此你必须自己输入)
eruda-webpack-plugin
集成到一个项目中:npm i eruba-webpack-plugin --save-optional
。
在 android 中使用远程调试第一个活动开发者模式
1-in android>setting>search bulid number->然后点击几次激活开发者模式
2-安卓>设置>开发者选项>启用usb调试
3-用usb线连接电脑
英寸 chrome pc 类型 chrome://inspect > enter
5- 在移动打开 url 然后在 pc chrome://inspect/#devices 中监控
请帮自己一个忙,然后点击简单的按钮:
从 Play 商店下载 Web Inspector (Open Source)。
警告:ATTOW,控制台输出不接受其余参数!即,如果你有这样的事情:
console.log('one', 'two', 'three');
你只会看到
一
登录到控制台。您需要手动将参数包装在一个数组中并加入,如下所示:
console.log([ 'one', 'two', 'three' ].join(' '));
查看预期的输出。
但应用程序是 open source!补丁may be imminent!修补程序甚至可能是你!
原来的答案似乎不再有效。从当前的 Chrome developer docs 开始,您需要完成以下基本步骤:
在您的 Android 上打开开发人员选项屏幕。请参阅配置设备上开发人员选项。选择启用 USB 调试。在您的开发机器上,打开 Chrome。转到 chrome://inspect#devices。确保启用了发现 USB 设备复选框。
之后,在您的 Android 设备上打开 Chrome(并确认 USB 调试提示以防弹出)。切换回您的 PC,您应该会看到当前打开的浏览器选项卡:
https://i.stack.imgur.com/W2n6j.png
如果您的设备选项卡未出现,您可能需要通过激活移动设备上的文件传输来触发 USB 调试提示。
chrome://inspect#devices
页面的 Chrome,例如:$ chrome 'chrome://inspect#devices'
?!
Kiwi 浏览器是移动 Chromium,允许安装扩展。安装 Kiwi,然后安装“Mini JS 控制台”Chrome 扩展(只需在 Google 中搜索并从 Chrome 扩展网站安装,uBlock 也可以;)。它将在底部的 Kiwi 菜单中可用,并将显示当前页面的控制台输出。
我只想查看控制台中打印的内容,您可以简单地将“打印”部分添加到 HTML 中的某处,这样它就会出现在网页上。您可以自己做,但有一个 javascript 文件可以为您做这件事。你可以在这里读到它:
http://www.hnldesign.nl/work/code/mobileconsole-javascript-console-for-mobile-devices/
The code is available from Github;您可以下载它并将其粘贴到 javascipt 文件中,然后将其添加到您的 HTML
mobileConsole.init()
它。这个技巧对我有帮助。 YMMV。
if (!mobileConsole.status.initialized) { mobileConsole.init(); }
"
使用 Kiwi 浏览器应用程序
允许您安装所有 chrome 扩展以及访问开发工具(控制台,...)
或者
要访问和测试不同移动浏览器的所有控制台,您可以使用以下类似网站: