当前位置: 首页 > ds >正文

微软Wasm学习-创建一个最简单的c#WebAssembly测试工程

要创建一个最简单的微软 WebAssembly(Wasm)测试工程,最直接的方式是使用 Blazor WebAssembly,这是微软官方推荐的 WebAssembly 开发框架。下面是创建和运行最简单 Blazor WebAssembly 项目的步骤:

相关:微软的wasm 和 rust的wasm 方案对比》》

深入:c# WebAssembly,在网页上能运行多线程,异步,锁,原子加,减等代码吗

步骤 1:安装必要工具

确保已安装.NET SDK(5.0 或更高版本),可以从微软官网下载。

步骤 2:创建项目

打开命令行工具,运行以下命令创建一个新的 Blazor WebAssembly 项目:

dotnet new blazorwasm -n WasmTestApp
cd WasmTestApp

步骤 3:项目结构说明

最简单的项目结构包含:

  • Program.cs - 应用入口点
  • App.razor - 根组件
  • Pages 文件夹 - 包含页面组件
  • wwwroot - 静态文件

步骤 4:修改为最简单的测试

我们可以修改Pages/Index.razor文件,创建一个简单的测试页面:

最简单的Blazor WebAssembly测试项目,Index.razor:

@page "/"<h1>微软Wasm测试</h1><p>这是一个最简单的Blazor WebAssembly应用</p><button @onclick="IncrementCount">点击计数</button>
<p>计数: @currentCount</p>@code {private int currentCount = 0;private void IncrementCount(){currentCount++;}
}
//Program.csusing Microsoft.AspNetCore.Components.Web;
using Microsoft.AspNetCore.Components.WebAssembly.Hosting;
using WasmTestApp;var builder = WebAssemblyHostBuilder.CreateDefault(args);
builder.RootComponents.Add<App>("#app");
builder.RootComponents.Add<HeadOutlet>("head::after");builder.Services.AddScoped(sp => new HttpClient { BaseAddress = new Uri(builder.HostEnvironment.BaseAddress) });await builder.Build().RunAsync();

创建时间:

步骤 5:运行项目

在命令行中执行以下命令运行项目:

dotnet run

然后打开浏览器访问 https://localhost:5001(或命令行显示的端口),你将看到一个简单的页面,包含一个按钮和计数器,点击按钮可以增加计数。

工作原理说明

  1. Blazor WebAssembly 将 C# 代码编译为 WebAssembly
  2. 应用在浏览器中运行,无需服务器端参与(除非需要 API 调用)
  3. 上面的示例展示了基本的组件结构和事件处理

这个最简单的测试项目验证了 WebAssembly 环境的正常工作,包括:

  • 页面渲染
  • C# 代码执行
  • 交互事件处理
  • 状态管理

如果需要更深入的测试,可以添加更多组件、调用 JavaScript 或访问 Web API。

http://www.xdnf.cn/news/18112.html

相关文章:

  • ISIS区域内、区域间计算
  • 机器学习——CountVectorizer将文本集合转换为 基于词频的特征矩阵
  • Boost搜索引擎项目(详细思路版)
  • 【3D重建技术】如何基于遥感图像和DEM等数据进行城市级高精度三维重建?
  • 扫地机器人(2025蓝桥杯省A组 H题)
  • AI重构文化基因:从“工具革命”到“生态觉醒”的裂变之路
  • 线性代数之两个宇宙文明关于距离的对话
  • 完整的VOC格式数据增强脚本
  • 狗品种识别数据集:1k+图像,6个类别,yolo标注完整
  • .net印刷线路板进销存PCB材料ERP财务软件库存贸易生产企业管理系统
  • 曲面/线 拟合gnuplot
  • 第四章:大模型(LLM)】06.langchain原理-(5)LangChain Prompt 用法
  • 第七十五章:AI的“思维操控师”:Prompt变动对潜在空间(Latent Space)的影响可视化——看懂AI的“微言大义”!
  • P2169 正则表达式
  • LeetCode 刷题【43. 字符串相乘】
  • 视觉语言模型(VLA)分类方法体系
  • Kotlin-基础语法练习一
  • 代码随想录算法训练营四十三天|图论part01
  • Ubuntu 25.04 安装并使用 MySQL 8.4.5 的步骤
  • MySQL完整重置密码流程(针对 macOS)
  • AI应用安全 - Prompt注入攻击
  • 深入解析Java代理模式:灵活控制对象访问的核心技术
  • 配置国内加速源后仍然无法拉取镜像
  • STC8单片机驱动I2C屏幕:实现时间、日期与温湿度显示
  • Rust 中 i32 与 *i32 的深度解析
  • 解决zabbix图片中文乱码
  • 46.Sentinel规则持久化
  • 8位量化简介(40)
  • 铨林接纸机学习记录1
  • ramdisk内存虚拟盘(一)——前世今生