如何在JavaScript中運行.NET?Core代碼詳情
更新時間：2022年04月26日 08:30:42 作者：My?IO
這篇文章主要介紹了在JavaScript中運行.NET?Core代碼詳情，DotNetJS可以將C#項目編譯為與任何環(huán)境兼容的單文件JavaScript庫，變可以在JavaScript中運行.NET?Core代碼，相關操作分享詳情，需要的小伙伴可以參考一下
一、前言
在.NET Core中運行JavaScript代碼，目前已經有很多實現方案。
但是，如果你希望在純JavaScript環(huán)境中運行.NET Core代碼呢？
那么，DotNetJS可能對你有所幫助。
二、DotNetJS
DotNetJS可以將C#項目編譯為與任何環(huán)境兼容的單文件JavaScript庫，無論是Web瀏覽器，Node.js還是自定義限制空間，如VS Code的Web擴展，都可以正常使用它。
該解決方案基于兩個主要組件：
- JavaScript/dotnet-runtime（npm）使用已編譯的C#程序集和.NET運行時WebAssembly模塊，以在JavaScript中提供C# 操作性層。該庫與環(huán)境無關 - 它不依賴于特定于平臺的API，如瀏覽器DOM或節(jié)點模塊，并且可以作為CommonJS或ECMAScript模塊導入，也可以通過瀏覽器中的腳本標記使用。
- DotNet/dotNetJS（NuGet）在C#中提供JavaScript互操作性層，并通過MSBuild任務將項目輸出打包到單文件JavaScript庫中。生成的庫包含使用項目程序集初始化的dotnet運行時，并準備用作打包的C#項目的互操作性層。
三、Demo
1. 創(chuàng)建項目
使用VS2022創(chuàng)建一個控制臺項目，修改項目文件，文件內容如下：
<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集合
在終端窗口執(zhí)行??dotnet publish???，上述代碼將會編譯成JS代碼文件??dotnet.js??。
3. 實現JS代碼
創(chuàng)建demo.html，代碼如下：
<meta charset="UTF-8">
<script src="dotnet.js"></script>
<script>
//定義GetBaseAddress實現
dotnet.HelloDotnetJS.GetBaseAddress = () => window.location.protocol + "http://" + window.location.host;
window.onload = async function () {
//初始化
await dotnet.boot();
console.log("開始執(zhí)行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內容請搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關文章希望大家以后多多支持腳本之家！
相關文章
之前有一篇博客，實用的焦點圖切換效果，結構行為相分離 解釋的比較詳細，腳本是分離式的，但在易用性和重用性方面并不理想，這里原作者進行了，優(yōu)化。2010-07-07
HTML頁面如何象ASP一樣接受參數...2007-02-02
本文主要介紹了js實現不提示直接關閉網頁窗口的方法。具有很好的參考價值，下面跟著小編一起來看下吧2017-03-03
這篇文章主要介紹了ElementPlus?Tag標簽用法,本文通過示例代碼給大家介紹的非常詳細,對大家的學習或工作具有一定的參考借鑒價值,需要的朋友可以參考下2023-09-09
本文主要給大家簡單介紹了是什么是DOM、動態(tài)操作DOM元素的方法、使用jsjs操作樣式以及Form對象的簡介，是個人對于javascript中的DOM的理解的總結，推薦給小伙伴們。2015-03-03
這篇文章主要為大家介紹了解決input輸入框僅支持輸入數字及兩位小數點的限制技巧示例,有需要的朋友可以借鑒參考下,希望能夠有所幫助,祝大家多多進步,早日升職加薪2023-11-11
淺談addEventListener和attachEvent的區(qū)別
下面小編就為大家?guī)硪黄獪\談addEventListener和attachEvent的區(qū)別。小編覺得挺不錯的，現在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-07-07
JavaScript中的splice主要用來對js中的數組進行操作，包括刪除，添加，替換等。這篇文章主要介紹了JavaScript中的splice方法用法詳解的相關資料,需要的朋友可以參考下2016-07-07
一直以為 && 和 || 這兩個偉大的運算法只能在判斷表達式使用，也就是常在if語句使用，原來錯了，它還可以運用在簡化選擇性執(zhí)行語句的操作，有點拗口，簡單點也就是：操作執(zhí)行某條語句，不執(zhí)行某條語句。2009-11-11
這篇文章主要介紹了webpack4.0打包優(yōu)化策略整理小結，小編覺得挺不錯的，現在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2018-03-03