Question

上下文

我试图了解JsInterop javascript端的实现方式和实现方式。

在我的Blazor Server项目中给出以下示例代码：

public static ValueTask<string> Prompt(IJSRuntime jsRuntime, string message)
{
    // Implemented in exampleJsInterop.js
    return jsRuntime.InvokeAsync<string>(
    "exampleJsFunctions.showPrompt",
    message);
}

及其对应的javascript：

window.exampleJsFunctions = {
  showPrompt: function (message) {
    return prompt(message, 'Type anything here');
  }
};

（我理解 SignalR及其在电路概念中的用途，我确实理解电路在Blazor Server项目中用于双向客户端服务器通信。）

问题

该项目使用的唯一客户端脚本是：<script src="_framework/blazor.server.js"></script>据了解，所有javascript执行调度功能都应该存在。我认为从服务器端完成javascript调用的唯一方法是某些javascript eval（）功能。我试图找到源代码_framework / blazor.server.js，我想它位于here in github，因为它在/ dist文件夹中的生成输出包含文件blazor.server.js

我试图在打字稿源中找到这部分（执行来自服务器的javascript函数的名称），但没有成功。谁能指出我正确的方向？我是在错误的位置看还是没有eval（）？

***编辑：同时我了解到，不仅eval（）在这里播放，实际上这是最后一次机会，还有window["functionName"](arguments);及其变体。仍在寻找相关的源代码行...

Answer 1

我试图了解JsInterop javascript方面的实现方式和实现方式。

在应用程序主页中，通常是_Host.cshtml或{的结尾，wwwroot/index.html（或_index.cshtml或<head>等，取决于您的服务器代码结构） {1}}标签。您可以在其中放置<body>或在<script src="path/to/exampleJsFunctions.js"></script>标签内立即定义函数。

仅供参考，<script>脚本是负责浏览器和服务器之间的websocket连接的脚本。当您在应用中调用blazor.server.js方法时，服务器询问浏览器（通过 Websocket）运行一个名为Prompt(...)的js函数，该函数在exampleJsFunctions.showPrompt，以及给定的参数window。如果在message中定义了js函数，则浏览器将运行它（如果使用浏览器devtool在该函数上设置断点，它将被命中）。否则，将引发错误。没有window。

（实际上，如何为浏览器定义功能并不重要。唯一重要的是何时服务器要求浏览器调用该功能，浏览器可以在eval对象下面找到该函数。）

如果您非常想查看源代码，则应该在jsinterop sources中找到它。

Answer 2

您可以在blazor.js文件下添加自定义JS文件。在其中，您可以声明函数，然后通过JsRuntime从剃刀组件中调用它。

我找到的最简单的方法是将IJSRuntime注入组件。

@inject IJSRuntime JSRuntime;

Blazor服务器应用程序中JsInterop javascript端的实现方式和位置？

2 个答案: