如何使Chrome Dev Tools显示JavaScript源代码
How to make Chrome Dev Tools show the JavaScript source
我稍微修改了hello-world.cc
示例,从d8
导入了一些代码。然后,使用 websocketpp 和 asio,我在程序中添加了 WebSocket 服务器。 此外,我从嵌入器的角度使用 V8 检查器为检查器协议后端添加一个简单的实现。
现在,当我启动程序,然后使用 Chrome 导航到chrome-devtools://devtools/bundled/inspector.html?experiments=true&v8only=true&ws=127.0.0.1:9002
时,我收到来自 CDT 的以下消息:
{"id":1,"method":"Profiler.enable"}
对于女巫,回应是:
{"id":1,"result":{}}
然后
{"id":2,"method":"Runtime.enable"}
为此,将发送通知和响应:
{"method":"Runtime.executionContextCreated",
"params":{"context":{"id":1,"origin":"","name":"MyApplication"}}}
{"id":2,"result":{}}
然后:
{"id":3,"method":"Debugger.enable"}
同样,通知和响应发送回前端:
{"method":"Debugger.scriptParsed",
"params":{
"scriptId":"4","url":"func_add.js","startLine":0,
"startColumn":0,"endLine":0,"endColumn":35,
"executionContextId":1,"hash":"365568ee6245be1376631dbf20e7de9d42c9adf1",
"isLiveEdit":false,"sourceMapURL":"","hasSourceURL":false,
"isModule":false,"length":35
}
}
{"id":3,"result":{"debuggerId":"(DC239109305DBEF825A955524584A826)"}}
目前,我不会在这个问题中添加从前端收到的其他消息以及发送的响应。 最后一次交流是:
{"id":7,"method":"Runtime.runIfWaitingForDebugger"}
{"id":7,"result":{}}
我的问题:在 CDT 中,Sources
选项卡为空(因此,我无法尝试放置断点)。
我在 V8 中注入 JS 的代码:
const char * pszScript = "function add( a, b) { return a+b; }";
v8::Local<v8::String> source =
v8::String::NewFromUtf8(isolate, pszScript, v8::NewStringType::kNormal).ToLocalChecked();
v8::Local<v8::String> name =
v8::String::NewFromUtf8(isolate, "func_add.js", v8::NewStringType::kNormal).ToLocalChecked();
ExecuteString( isolate, source, name );
我的ExecuteString
功能:
bool ExecuteString(v8::Isolate* isolate, v8::Local<v8::String> source,
v8::Local<v8::Value> name) {
v8::HandleScope handle_scope(isolate);
v8::Local<v8::Context> context = isolate->GetCurrentContext();
v8::Context::Scope context_scope(context);
v8::TryCatch try_catch(isolate);
try_catch.SetVerbose(true);
v8::MaybeLocal<v8::Value> maybe_result;
bool success = true;
v8::ScriptOrigin origin(name);
v8::ScriptCompiler::Source script_source(source, origin);
v8::MaybeLocal<v8::Script> maybe_script;
maybe_script = v8::ScriptCompiler::Compile(context, &script_source);
v8::Local<v8::Script> script;
if (!maybe_script.ToLocal(&script)) {
// Print errors that happened during compilation.
ReportException(isolate, &try_catch);
return false;
}
maybe_result = script->Run(context);
v8::Local<v8::Value> result;
if (!maybe_result.ToLocal(&result)) {
// Print errors that happened during execution.
ReportException(isolate, &try_catch);
return false;
}
if (!result->IsUndefined()) {
// If all went well and the result wasn't undefined then print
// the returned value.
v8::String::Utf8Value str(isolate, result);
fwrite(*str, sizeof(**str), str.length(), stdout);
printf("n");
} else {
printf("undefinedn");
}
return success;
}
我认为我做错了什么,因为我应该能够在 CDT 中看到一些func_add.js
来源的内容function add( a, b) { return a+b; }
完全没有检查源代码,我记得在这个确切的用例中遇到了一些糟糕的时光。
尝试向源参数添加协议。 CDT 需要任何协议文件 http、https 来创建源树。 它还将使用此 uri 来请求映射或任何其他与源代码相关的东西。
v8::Local<v8::String> name =
v8::String::NewFromUtf8(isolate, "file://func_add.js", v8::NewStringType::kNormal).ToLocalChecked();
ExecuteString( isolate, source, name );
有时也会发生的情况,根据您的 v8 实现,官方 chrome 无法显示源代码、调试等。 如果是这种情况,请尝试使用铬金丝雀。
协议实现正如我在你引用的帖子中所描述的。 希望这有帮助。
在您的代码中,我没有看到您在哪里发现检查器对象的上下文,但这样的事情必须发生在代码中的某个地方:
inspector_->contextCreated(
v8_inspector::V8ContextInfo(context, 1, v8_inspector::StringView(
reinterpret_cast<const uint8_t *>("ABCD"), 4)));
我在创建上下文并设置其全局对象后立即执行此操作。
CDT 将使用以下形式的消息查询脚本内容:
{"id":8,"method":"Debugger.getScriptSource","params":{"scriptId":"7"}}
虽然实现非常简单,但有很多原因导致您的代码根本不会显示。 希望有帮助。
- 比较并显示使用最小值(a,b)和最大值(a、b)升序排列的4个数字
- C++,OpenCV,尝试显示图像时"OpenCV(4.3.0) Error: Assertion failed (size.width>0 && size.height>0)"此错误
- 字符串-C++后显示的随机字符
- 继承期间显示未知行为的子类
- 仅使用绝对值对数组进行排序,并在C++中显示实际值
- 程序崩溃并显示"std::out_of_range"错误
- 如何在本地机器上运行c++和javascript客户端代码(hackerbank风格)
- 如何在C++中用std::cout正确显示带十六进制的字符串文本
- 为什么在C的循环中使用printf的Rust代码不显示输出,而在C++的循环中显示std::cout
- 从数据库实时显示QT c++中的数据
- 当使用比格式支持的精度更高的精度来显示数字时,会写出什么数据
- 显示错误输出的简单数组排序程序
- 如何将C++闭包与变量参数同时重用——类似于JavaScript
- Qt自定义QPush按钮未显示在布局上
- QWebEngineView仅在javascript脚本完成后显示页面
- 如何使Chrome Dev Tools显示JavaScript源代码
- 从QT调用JavaScript函数,并未显示输出
- 希望开发我自己的小C++浏览器,基本上可以显示HTML,Javascript和Flash,从哪里开始
- QWebView 无法显示通过 javascript 设置的外部图像内容 $( "#<node_name>" ).html(<html_content>)
- Dlib HTTP服务器显示网站为纯HTML,没有javascript/css