前端項目在線編譯

A. 不用Blazor WebAssembly，開發在瀏覽器端編譯和運行C#代碼的網站

本文介紹如何使用.NET技術在瀏覽器端編譯和運行C#代碼，核心採用C#編寫WebAssembly及Roslyn技術。主要目標是為編程初學者提供無需安裝配置的在線編程環境，簡化學習門檻。

目前已有在線編譯和運行C#代碼的網站，但存在局限性：一是代碼在後端編譯和運行，限制了復雜輸入輸出及交互；二是僅支持Mono技術編寫的WebAssembly，對最新C#語法不全支持。因此，開發支持瀏覽器端編譯運行C#代碼並兼容最新語法的工具至關重要。

WebAssembly允許使用非JavaScript語言在瀏覽器中運行程序。支持Java、Go、Python等主流語言編譯為WebAssembly。但Blazor WebAssembly作為.NET框架的一部分，過於侵入性，限制了組件的獨立性和輕量級特性。

從.NET 6開始，可以直接使用C#編寫輕量級WebAssembly程序，無需引入完整Blazor技術棧。本文將通過計算兩個數和的簡單示例，演示C#編寫的WebAssembly應用。

首先，創建.NET普通類庫項目，安裝所需組件並修改項目屬性。在Program.cs文件中定義方法並標記為JS可調用。編譯後生成WebAssembly文件夾，將內容復制至前端項目中。前端項目採用HTML+JavaScript編寫，引入WebAssembly文件，使用Blazor.start()啟動運行時環境，DotNet.invokeMethodAsync調用C#方法。配置Web伺服器以支持特定文件類型。

在瀏覽器中訪問項目，通過彈窗驗證方法調用成功。C#編寫的WebAssembly可用於復用.NET組件、調用C/C++軟體、開發復雜前端組件等場景，實現輕量級、跨語言集成。

在WebAssembly中調用JavaScript方法，使用IJSRuntime介面。注意WebAssembly限制，如文件操作受限於瀏覽器安全策略。項目中使用自定義Console類，通過JavaScript實現輸入輸出功能。

項目部署在互聯網上，用戶可訪問鏈接進行使用。開源代碼地址提供給開發者參考。自從.NET 6引入輕量級WebAssembly支持，開發人員可以更高效地集成C#代碼到瀏覽器環境，同時利用JavaScript進行協同開發。

本文分享了使用C#開發瀏覽器端WebAssembly組件的技術，以及一個開源項目實例，為開發者提供在線編譯和運行C#代碼的解決方案。