前端项目在线编译

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#代码的解决方案。