如何在JavaScript中运行.NET Core代码详情

更新时间：2022年04月26日 08:30:42 作者：My IO

这篇文章主要介绍了在JavaScript中运行.NET Core代码详情，DotNetJS可以将C#项目编译为与任何环境兼容的单文件JavaScript库，变可以在JavaScript中运行.NET Core代码，相关操作分享详情，需要的小伙伴可以参考一下

一、前言

在.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# 操作性层。该库与环境无关 - 它不依赖于特定于平台的API，如浏览器DOM或节点模块，并且可以作为CommonJS或ECMAScript模块导入，也可以通过浏览器中的脚本标记使用。
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方法的具体逻辑如下：

获取网站根路径，使用[JSFunction]指定具体值来源于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/：

如何在JavaScript中运行.NET Core代码_.net_02

weather.json的文件内容如下：

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

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

如何在JavaScript中运行.NET Core代码_json

四、结论

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

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

您可能感兴趣的文章:

js控制的遮罩层实例介绍
把项目里很土的弹窗，改成了遮罩层显示，现在感觉好多了。在这里创建一个div和body一样大小，这样就可以把整个页面全部盖住了，具体实现祥看本文，希望可以帮助到你
2013-05-05
JS实现在线Excel的附件上传与下载
在本地使用Excel时，经常会有需要在Excel中添加一些附件文件的需求，今天小编将为大家介绍如何使用前端HTML+JS+CSS技术通过超链接单元格的形式实现在线Excel附件上传、下载和修改的操作，需要的可以参考下
2023-08-08
数据结构中的各种排序方法小结(JS实现)
下面小编就为大家带来一篇数据结构中的各种排序方法小结(JS实现)。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2016-07-07
在javascript中使用com组件的简单实现方法
下面小编就为大家带来一篇在javascript中使用com组件的简单实现方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧，祝大家游戏愉快哦
2016-08-08
javascript动态创建对象的属性详解
在本篇文章中我们给大家分享了关于javascript动态创建对象的属性的相关知识点以及代码分享，需要的朋友们参考学习下。
2018-11-11
微信小程序数据请求的方式和注意事项详解
这篇文章主要为大家介绍了微信小程序网络数据请求的方式和注意事项讲解，有需要的朋友可以借鉴参考下，希望能够有所帮助，祝大家多多进步，早日升职加薪
2022-11-11
Javascript连接多个数组不用concat来解决
这篇文章主要介绍了不用concat解决Javascript连接多个数组,需要的朋友可以参考下
2014-03-03
js获取时间函数及扩展函数的方法
下面小编就为大家带来一篇js获取时间函数及扩展函数的方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2016-10-10
js 单引号替换成双引号,双引号替换成单引号的实现方法
下面小编就为大家带来一篇js 单引号替换成双引号,双引号替换成单引号的实现方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧
2017-02-02
javascript中indexOf技术详解
indexOf()函数用于查找子字符串在当前字符串中第一次出现的位置。该函数属于String对象，所有主流浏览器均支持该函数。下面我们就来详细探讨下javascript的index0f()函数
2015-05-05