ドキュメントを軽くあさってみたら Blazor WebAssembly で、既に構成ファイルの扱いまでサポートしているんですね。
ASP.NET Core Blazor hosting model configuration
ということで試してみました。
Blazor WebAssembly のプロジェクトを作成しておきます。
NuGet のパッケージの管理で Blazor まわりのライブラリが 3.2 の Preview 3 以降であることを確認します。
では、構成ファイルを置いてい置きましょう。Blazor WebAssembly では wwwroot の下に構成ファイルを置くみたいです。こんな感じで。
それぞれの中身はこのようにしてみました。
{"message":"Hello from appsettings.json"}{"envMessage":"Hello from appsettings.Development.json"}{"envMessage":"Hello from appsettings.Production.json"}そして、Program.cs で以下のようにして IConfiguration から適当なクラスにマッピングして DI 出来るように下準備をしてやります。
usingSystem;usingSystem.Collections.Generic;usingSystem.Threading.Tasks;usingSystem.Text;usingMicrosoft.AspNetCore.Components.WebAssembly.Hosting;usingMicrosoft.Extensions.DependencyInjection;usingMicrosoft.Extensions.Configuration;namespaceBlazorApp3{publicclassProgram{publicstaticasyncTaskMain(string[]args){varbuilder=WebAssemblyHostBuilder.CreateDefault(args);builder.RootComponents.Add<App>("app");builder.Services.AddBaseAddressHttpClient();// IConfiguration から AppSettings クラスにして DI できるようにしておくbuilder.Services.AddSingleton(p=>p.GetRequiredService<IConfiguration>().Get<AppSettings>());awaitbuilder.Build().RunAsync();}}// appsettings.json の値を入れるようpublicclassAppSettings{publicstringMessage{get;set;}publicstringEnvMessage{get;set;}}}あとは、普通に DI するなりして使いましょう。こんな感じで
@page "/"
@inject AppSettings _appSettings
<h1>Hello, world!</h1>
Welcome to your new app.
<p>@_appSettings.Message</p><p>@_appSettings.EnvMessage</p>因みに、Program.cs で Configure メソッドで DI コンテナに登録して IOptions<T>で受けるのは出来ませんでした。Configure をするには、IConfiguration のインスタンスが必要で、それをしようとしたら builder.Build().Configurationで取得しないといけないのですが、builder.Build()は 2 回やると appsettings.jsonとかを読み込むための Stream を 2 回読むことになっているっぽくて、そこで例外が出てるように見えます。（深追いはしていない
Blazor のアプリを実行してみると、ちゃんと思った通りのメッセージが出ます。開発者ツールで見てみると appsettings.json と appsettings.Development.json を、サーバーから取得していることがわかります。
Production の方は、何処かにデプロイされると読み込まれるらしいです。試しに、Azure ストレージアカウントの Blob の静的サイトのホスト機能を使って作ったサイトに置いてみました。発行をして発行先フォルダーの wwwroot フォルダーの下を全部 Blob の $web コンテナーにコピーします。
今度はちゃんと Hello from appsettings.Production.json というメッセージが出てますね。
まとめ
ちゃんと動くね。ということで、ドキュメントにも書かれていますが、このような仕組みなので URL に appsettings.json と打ち込むと生 JSON が手に入っちゃうので、間違っても秘密な情報は書かないように気をつけましょう。