Blazor WebAssemblyでサイトを作成するサンプルプログラムはいろいろなサイトで紹介されていますが、実際にWeb上に公開するにはどうすればいいのでしょうか? 意外に説明してくれているサイトが存在しません。そこでその方法を紹介します。

まず新しいプロジェクトを作成します。

プロジェクトフォルダのなかにあるPagesフォルダのなかにあるIndex.razorを少しだけ変更します。

コンパイルして実行してみると以下のようになります。ボタンをクリックすると値が増え、今日の運勢もかわります。

さて、これを公開する方法ですが、ソリューションエクスプローラーの[発行]をクリックします。

いきなりサーバーに公開してもいいのですが、ここでは[フォルダ]を選択します。

最後に[発行]をクリックします。

処理が終わってからプロジェクトフォルダ内のbin\Release\netstandard2.1\publishをみてみるとwwwrootというフォルダが生成されています。この中身をアップロードすればよいのですが、その前にすることがあります。

wwwrootフォルダのなかにあるindex.htmlですが、<base href=”/” />の行を削除します。そして

それからwwwroot\_frameworkフォルダのなかにblazor.boot.jsonという名前のファイルがあるのですが、

“cacheBootResources”: true,

“cacheBootResources”: false,に変更します。

追記

実は変更しなくてもかまいません。エラーが出るのはアップロードのときにWindows スタイルの改行コードが Unix スタイルの改行コードに変換されてしまうのが原因です。ファイルの改行コードを変更すると、SHA-256 ハッシュが変更されてしまうのです。この問題を回避するには、binary ファイルとして扱うことを検討してください。それができないときだけ上記の処理をしてください。

そしてアップロードしたい場所へアップします。

/lets-csharp.com/public_html/wp-content/uploads/2021/01のなかにsiteというディレクトリを作成してそこにアップしました。

こちらから確認どうぞ。https://lets-csharp.com/wp-content/uploads/2021/01/site/