一、前言

在.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内容请搜索Devmax以前的文章或继续浏览下面的相关文章希望大家以后多多支持Devmax!

如何在JavaScript中运行.NET Core代码详情的更多相关文章

  1. 基于JavaScript编写一个图片转PDF转换器

    本文为大家介绍了一个简单的 JavaScript 项目,可以将图片转换为 PDF 文件。你可以从本地选择任何一张图片,只需点击一下即可将其转换为 PDF 文件,感兴趣的可以动手尝试一下

  2. HTML5数字输入仅接受整数的实现代码

    这篇文章主要介绍了HTML5数字输入仅接受整数的实现代码,本文给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  3. amaze ui 的使用详细教程

    这篇文章主要介绍了amaze ui 的使用详细教程,本文通过多种方法给大家介绍的非常详细,对大家的学习或工作具有一定的参考借鉴价值,需要的朋友可以参考下

  4. html5简介_动力节点Java学院整理

    这篇文章主要介绍了html5简介,用于指定构建网页的元素,这些元素中的大多数都用于描述网页内容,有兴趣的可以了解一下

  5. ios 8 Homescreen webapp,关闭和打开iPad停止javascript

    我有一个适用于iPad的全屏HTML5网络应用程序,并且刚刚安装了IOS8来试用它,它一切正常,直到你关闭并重新启动iPad.一旦web应用程序重新启动javascript就会停止并加载新页面不会重新启动它.在iPad上的Safari中打开同一页面时,关闭和打开iPad会继续按预期工作.其他人注意到了这个或想出了一个解决方案吗?解决方法这似乎是我在iOS8.1.1更新中解决的.

  6. iOS 6 javascript与object.defineProperty的间歇性问题

    当访问使用较新的Object.defineProperty语法定义属性的对象的属性时,有没有其他人注意到新iOS6javascript引擎中的间歇性错误/问题?https://developer.mozilla.org/en-US/docs/JavaScript/Reference/Global_Objects/Object/defineProperty我正在看到javascript失败的情况,说

  7. ios – 如何使用JSExport导出内部类的方法

    解决方法似乎没有办法将内部类函数导出到javascript.我将内部类移出并创建了独立的类,它起作用了.

  8. 如何在Xcode 4.4.1中的Core Data Model编辑器中完全删除实体描述

    用户界面中只存在“添加实体”按钮.解决方法>突出显示要删除的实体.>按退格键(删除)键.

  9. xcode – 命令行工具的静态分析器问题

    我们通过使用TeamCity/命令行工具自动化我们当前项目的构建.为了确保尽可能多地捕获潜在的问题,我们已经将项目设置为对每个构建使用静态分析器.几个第三方课程被分析仪标记,所以我们排除了可疑类,标记为:一切都按照预期的方式编译在Xcode中(用4.6.3和5.0.1测试).但是,当在TeamCity服务器上编译时,我们会收到每个排除的第三方文件的以下错误:如果我们删除了-Xanalyzer-an

  10. 静音iOS推送通知与React Native应用程序在后台

    我有一个ReactNative应用程序,我试图获得一个发送到JavaScript处理程序的静默iOS推送通知.我看到的行为是AppDelegate中的didReceiveRemoteNotification函数被调用,但是我的JavaScript中的处理程序不会被调用,除非应用程序在前台,或者最近才被关闭.我很困惑的事情显然是应用程序正在被唤醒,并且它的didReceiveRemoteNotifi

随机推荐

  1. js中‘!.’是什么意思

  2. Vue如何指定不编译的文件夹和favicon.ico

    这篇文章主要介绍了Vue如何指定不编译的文件夹和favicon.ico,具有很好的参考价值,希望对大家有所帮助。如有错误或未考虑完全的地方,望不吝赐教

  3. 基于JavaScript编写一个图片转PDF转换器

    本文为大家介绍了一个简单的 JavaScript 项目,可以将图片转换为 PDF 文件。你可以从本地选择任何一张图片,只需点击一下即可将其转换为 PDF 文件,感兴趣的可以动手尝试一下

  4. jquery点赞功能实现代码 点个赞吧!

    点赞功能很多地方都会出现,如何实现爱心点赞功能,这篇文章主要为大家详细介绍了jquery点赞功能实现代码,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  5. AngularJs上传前预览图片的实例代码

    使用AngularJs进行开发,在项目中,经常会遇到上传图片后,需在一旁预览图片内容,怎么实现这样的功能呢?今天小编给大家分享AugularJs上传前预览图片的实现代码,需要的朋友参考下吧

  6. JavaScript面向对象编程入门教程

    这篇文章主要介绍了JavaScript面向对象编程的相关概念,例如类、对象、属性、方法等面向对象的术语,并以实例讲解各种术语的使用,非常好的一篇面向对象入门教程,其它语言也可以参考哦

  7. jQuery中的通配符选择器使用总结

    通配符在控制input标签时相当好用,这里简单进行了jQuery中的通配符选择器使用总结,需要的朋友可以参考下

  8. javascript 动态调整图片尺寸实现代码

    在自己的网站上更新文章时一个比较常见的问题是:文章插图太宽,使整个网页都变形了。如果对每个插图都先进行缩放再插入的话,太麻烦了。

  9. jquery ajaxfileupload异步上传插件

    这篇文章主要为大家详细介绍了jquery ajaxfileupload异步上传插件,具有一定的参考价值,感兴趣的小伙伴们可以参考一下

  10. React学习之受控组件与数据共享实例分析

    这篇文章主要介绍了React学习之受控组件与数据共享,结合实例形式分析了React受控组件与组件间数据共享相关原理与使用技巧,需要的朋友可以参考下

返回
顶部