大家好，我是沙漠尽头的狼。
我从美国巨头那里复制了一款意大利小魔方游戏，同时还提取了在线工具和在线游戏组件到Razor共享库中，可以被Dotnet9[1]网站和Dotnet Toolbox[2]网站复用。 本文分享游戏的转接。 以及Razor共享库的迁移过程，以及这几天开发部署过程中遇到的一些问题和解决方案记录。
目录：
添加了日本魔方游戏
组件复用
遇到的问题及解决方案
总结
1.添加日式小方块游戏1.1。 游戏参考：BlazorGames
BlazorGames 项目信息
仓库截图如下：
网站截图：
这个网站有一系列文章教你如何使用 Blazor 开发 7 或 8 在线游戏。 课程比较详细，如上图所示。 游戏包括纸牌、俄罗斯方块、扫雷等，其中美国小魔方系列文章截图如下：
课程列表地址：
1.2. 添加到您自己的项目中
首先，请克隆存储库：
作者的代码组织结构非常清晰。 首先了解一下代码结构：
对于每个游戏页面，例如Tetris.razor，我们可以直接将此文件复制到我们自己的项目中，只需删除页面底部的文章链接即可。
它是每个游戏的子组件，比如/Pages/Partials/TetrisGridCell.razor就是一个带有日本小方块背景的单元格组件。
例如/Models/Tetris/下有日本小方块的背景表格（Grid.cs）、单元格（Cell.cs）、块（Block.cs）等定义类。
使用到的Js库、CSS样式、图片、声音文件等都放在这里。 通过调试程序网页游戏界面源码，阅读代码，你就会知道，如果你想在自己的项目中正常运行美式游戏，需要这样的文件：
Cookie读写Js库网页游戏界面源码，用于应用程序样式（css/app.cs）、游戏部分样式（css/games.css）、俄罗斯方块图像（images/tetrix）、游戏音乐播放和游戏分数（js/utilities.js）、游戏背景音乐文件（sounds/tetris-theme.ogg）等
当你熟悉了上述文件后，就可以将它们复制到自己的项目中，同时进行调试。 以下是上述文件的部分屏幕截图。
日本小方块背景的单元格组件：
日本小方块Model类的定义：
资源文件截图：
2. 组件复用
本来Dotnet9网站和Dotnet Toolbox网站的在线工具和在线游戏代码是重复的，分开维护，但90%的代码是相同的，这是无法容忍的代码冗余。
站长考虑删除原来的Dotnet工具箱仓库，将代码合并到Dotnet9仓库中，将共享组件提取到Razor共享库中。 重建后的共享库的目录结构现在是：
3个主项目：1是Razor共享库，2是Dotnet9网站主项目，3是Dotnet工具箱主项目，2和3都添加1作为项目引用。
Razor共享库代码组织结构、目前可用的在线工具和在线游戏组件：
组件代码已经在上面的文章中贴出来了，这里就略过，不过这里提到游戏页面的路由：Dotnet9网站和Dotnet工具箱的网页布局不同，同样是上面的内容，所以每个工具和游戏在两个项目中都添加了对应的页面路由，比如下面的日文小方块页面在两个项目中的位置：
Dotnet9中的日文小方块页面：
Dotnet 工具箱日语多维数据集页面：
两个页面的内容几乎相同。 差异可能在于页面标题。 相信还可以进一步优化。
优化并不容易用几百个字就能解释清楚。 如果你有兴趣，可以看看Dotnet9源代码[3]。
三、遇到的问题及解决方案
在Dotnet9网站和Dotnet工具箱的开发过程中，我们遇到了一些问题，包括部署。 几乎都是通过查阅资料、请教技术组的一些专家来解决的。 这里列出一些你可能也会遇到的问题，分享一下，总结一下。
3.1. 服务器访问链接过多
在下一篇文章中，站长对服务器访问链接过多进行了截图。 他认为这是服务器的问题。 技术群里的朋友立即指责。 站长nginx配置有问题，没有有效配置Socket，导致连接频繁。 原文截图。 如下：
解决Nginx参考配置如下：
关注的主要节点配置是proxy_http_version1.1，但站长原来配置了它。 今天，他只是将 proxy_set_headerConnectionkeep-alive 更改为 proxy_set_headerConnection “升级”。 请确认一下。 截图的问题似乎已经解决了。 您也可以打开它。 在 Dotnet9 网站上进行验证。
3.2.Wasm直接打开子页面404
通过Dotnet工具项网站首页访问其他子页面是正常的。 但如果打开浏览器地址栏直接粘贴子页面访问，网站会响应404。解决办法是更改nginx配置：
location / {
try_files $uri $uri/ @router;
index index.html index.htm;
}
location @router {
rewrite ^.*$ /index.html last;
}
最主要的是try_files。 至于意思可以自行百度。
3.3. 工程编译正常，界面显示黑块。
本来明天站长已经放出了美国小魔方Dotnet工具箱的功能，但是游戏的后台界面（蓝色背景）始终显示不出来。 工作了很长时间后，组件中的组件没有正常加载，即子组件没有加载。 命名空间加上@usingDotnetools.Share.Components.Partials。
原代码如下：
通过F12调试网页源码发现了这个问题。 发现子组件对应的html代码并没有编译成html原生代码，仍然是组件代码，直接编译成字符串，显示如下：
添加命令空间引用后，源代码正常显示，并且也显示白色背景：
这个问题是由于不小心造成的。 提取共享库后，我没有检查HTML中对razor组件的引用是否正常。 对于这个问题VS不会给出异常提示。 。 。
4. 总结
明天我会在这里分享。 如果您有任何工具需求，请在下面的问题链接中留言。 非常感谢您的阅读。
参考
[1]
点网9：
[2]
点网工具箱：
[3]
Dotnet9源代码：
[4]
.NET8.0.0-预览版.5.23280.8：
