使用 DotNetJS 在 JavaScript 环境中运行 .NET Core 代码

作者:拾光时间:2026-10-25 09:33:02浏览:73

本文介绍 DotNetJS 工具,它可将 C# 项目编译为单文件 JavaScript 库,支持在浏览器、Node.js 等环境中运行 .NET Core 代码。通过示例演示如何配置项目、编写 C# 逻辑及调用 JS 接口,并分析生成的代码体积与使用限制。

一、前言

目前已有多种方案实现在 .NET Core 中执行 JavaScript 代码。

然而,若需求相反,即希望在纯 JavaScript 环境下执行 .NET Core 代码,该如何实现?

此时,DotNetJS 工具或许能解决这一需求。

二、DotNetJS

DotNetJS 能够将 C# 项目编译为兼容各种环境的单文件 JavaScript 库。无论是 Web 浏览器、Node.js,还是 VS Code Web 扩展等受限空间,均可正常使用该库。

该方案主要依赖两个核心组件:

  • JavaScript/dotnet-runtime(npm 包):利用已编译的 C# 程序集和 .NET 运行时 WebAssembly 模块,在 JavaScript 中提供 C# 操作层。该库与环境无关,不依赖浏览器 DOM 或 Node 模块等特定平台 API,支持以 CommonJS 或 ECMAScript 模块形式导入,也可通过浏览器中的 script 标签使用。
  • DotNet/dotNetJS(NuGet 包):在 C# 中提供 JavaScript 互操作性层,并通过 MSBuild 任务将项目输出打包为单文件 JavaScript 库。生成的库包含使用项目程序集初始化的 dotnet 运行时,可作为打包后的 C# 项目的互操作性层使用。

三、Demo

1. 创建项目

使用 VS2022 创建一个控制台项目,并修改项目文件,内容如下:

<Project Sdk="Microsoft.NET.Sdk.BlazorWebAssembly">
<PropertyGroup>
<TargetFramework>net6.0</TargetFramework>
<EmitSourceMap>true</EmitSourceMap>
<EmitTypes>true</EmitTypes>
</PropertyGroup>
<ItemGroup>
<PackageReference Include="DotNetJS" Version="0.4.0" />
</ItemGroup>
</Project>
  • 指定 SDK 为 Microsoft.NET.Sdk.BlazorWebAssembly
  • 引用 DotNetJS Nuget 包

2. 实现 C# 代码

实现 Program.cs,代码如下:

using DotNetJS;
using Microsoft.JSInterop;
using System;
using System.Threading.Tasks;
namespace HelloDotnetJS;
public partial class Program
{
public static void Main()
{
Console.WriteLine($"HelloDotnetJS 初始化!");
}
[JSFunction]
public static partial string GetBaseAddress();
[JSInvokable]
public async static Task<WeatherForecast[]> Demo()
{
var uri = new Uri(GetBaseAddress());
Console.WriteLine(uri);
var json = await new System.Net.Http.HttpClient { BaseAddress = uri }
.GetStringAsync("weather.json");
var forecasts = Newtonsoft.Json.JsonConvert.DeserializeObject<WeatherForecast[]>(json);
return forecasts;
}
}

Demo 方法的具体逻辑如下:

  • 获取网站根路径,使用 指定具体值来源于 JS 传入;
  • 访问网站根路径下的 weather.json 文件
  • 反序列化 json,调用 Newtonsoft 验证第三方库能否正常使用;
  • 返回 WeatherForecast 集合

在终端窗口执行 ​dotnet publish​,上述代码将会编译成 JS 代码文件 ​dotnet.js​。

3. 实现 JS 代码

创建 demo.html,代码如下:

<meta charset="UTF-8">
<script src="dotnet.js"></script>
<script>
//定义GetBaseAddress实现
dotnet.HelloDotnetJS.GetBaseAddress = () => window.location.protocol + "//" + window.location.host;
window.onload = async function () {
//初始化
await dotnet.boot();
console.log("开始执行Demo");
const str = await dotnet.HelloDotnetJS.Demo();
console.log(str);
};
</script>

4. 运行效果

将所有文件部署到网站上,例如 http://localhost:5678/:

一、前言

weather.json 的文件内容如下:

[
{
"date": "2018-05-06",
"temperatureC": 1,
"summary": "My IO"
},
{
"date": "2018-05-07",
"temperatureC": 14,
"summary": "Bracing"
}
]

用浏览器访问 ​http://localhost:5678/demo.html​,在控制台窗口可以看到代码运行正常:

一、前言

四、结论

DotNetJS 目前尚不完善,生成的 JS 代码文件 ​dotnet.js​ 尺寸较大,demo 代码就有 11M。

到此这篇关于如何在JavaScript中运行.NET Core代码详情的文章就介绍到这了,更多相关JavaScript中运行.NET Core内容请搜索本站以前的文章或继续浏览下面的相关文章希望大家以后多多支持本站!

作者最新文章