使用Chrome DevTools在Android应用程序中调试嵌入式JavaScript

使用Chrome DevTools在Android应用程序中调试嵌入式JavaScript (Debugging embedded JavaScript in an Android app using Chrome DevTools)

A good debugger is as essential to programmers as a towel is to folks in the universe of Douglas Adams’s Hitchhiker’s Guide to the Galaxy. Our journey to understanding V8 debugging begins with a project that runs JavaScript in an embedded V8 engine in an Android app. When it works, it’s great. But when there’s a problem with the JavaScript, it’s not so much fun. Before we could commit to using this architecture, we knew we’d have to be able to debug the JavaScript running inside of the embedded V8 engine, so I began investigating how V8 debugging works, how Chrome DevTools interacts with scripts running, and how to glue this all together. If you want to see and use the final product we developed as a result of these studies, it’s available at https://github.com/AlexTrotsenko/j2v8-debugger.

一个好的调试器对程序员来说至关重要，就像对道格拉斯·亚当斯(Douglas Adams)的《 旅行者指南》 ( Hitchhiker's Galaxy)而言 ，对毛巾一样重要。 我们了解V8调试的过程始于一个在Android应用程序的嵌入式V8引擎中运行JavaScript的项目。 当它起作用时，它很棒。 但是，当JavaScript出现问题时，它并不是那么有趣。 在继续致力于使用此体系结构之前，我们知道我们必须能够调试嵌入式V8引擎内部运行JavaScript，因此我开始研究V8调试的工作原理， Chrome DevTools如何与运行的脚本进行交互以及如何把这一切粘在一起。 如果您想查看和使用我们根据这些研究开发的最终产品，请访问https://github.com/AlexTrotsenko/j2v8-debugger 。

Our project uses J2V8, a Java wrapper for the V8 Engine. It’s essentially a headless Chrome that you inject scripts into, and the equivalent of JSCore on iOS. J2V8 provides hooks to inject methods into the JavaScript that can call out to native code, so doing something simple like logging can be done without much work. But debugging beyond that, with breakpoints, call stacks, and variable inspections, for example, is not implemented in J2V8. The hooks to support this were added in a recent release and this blog post explains how it works and how we implemented it.

我们的项目使用J2V8 ，这是V8引擎的Java包装器。 从本质上讲，这是一个无头的Chrome，您可以将脚本注入其中，相当于iOS上的JSCore 。 J2V8提供了将方法注入JavaScript的钩子，这些方法可以调用本机代码，因此无需太多工作即可完成诸如日志记录之类的简单操作。 但是，例如，使用断点，调用堆栈和变量检查进行的调试超出了J2V8中的实现。 在最近的发行版中添加了支持此功能的挂钩，并且该博客文章介绍了它的工作方式以及我们的实现方式。

// inside the kotlin code
v8.registerJavaMethod({ _, parameters ->
    Log.d(parameters.getString(0))
}, "nativeLog")// inside the javascript code
nativeLog("Something to log");

Registering and using a simple logging method in J2V8

在J2V8中注册和使用简单的日志记录方法

Chrome DevTools调试说明 (Chrome DevTools Debugging Explained)

The way that Chrome’s DevTools interact with its own V8 engine is pretty simple and powerful. Under the V8 hood is an Inspector API that sends and receives messages with DevTools over a WebSocket to do everything including debugging, profiling, inspecting, and more. Each message can either be a request, a response, or an event.

Chrome的DevTools与自己的V8引擎进行交互的方式非常简单而强大。 在V8引擎盖下是一个Inspector API，该API通过WebSocket通过DevTools发送和接收消息，以完成包括调试，配置文件，检查等在内的所有操作。 每个消息可以是请求，响应或事件。

V8请求和响应 (V8 Requests and Responses)

A request includes an id