QRコードは、認証や非接触決済、URL・連絡先情報の共有など、現代のWebアプリケーションに欠かせない要素となっています。 ASP.NET を使った開発においても、C#でQRコードを生成する機能は、実用的かつ頻繁に求められる機能の一つです。 本記事では、Spire.Barcode for .NET を用いて、ASP.NET（Razor Pagesベース）でQRコードを生成する方法を、実際のコードを交えながら丁寧に解説します。紹介する手法は、MVCやWeb API、Web Formsといった他のASP.NETプロジェクトにも応用可能です。 目次 1. プロジェクトの準備と依存関係 2. ASP.NETでQRコードを生成（C#） 3. QRコードの出力をカスタマイズする 4. MVC、Web API、Web Formsでの応用 5. まとめ よくある質問（FAQ） 1. プロジェクトの準備と依存関係 必要な環境： 以下の環境が必要です： Visual Studio 2019 以降 .NET 6 以降 ASP.NET Core Web アプリ（Razor Pages テンプレート） NuGetパッケージ：Spire.Barcode for .NET ライブラリのインストール： NuGet パッケージマネージャーコンソールから以下のコマンドでインストールします： Install-Package Spire.Barcode Spire.Barcode は、外部APIを使用せずにQRコードをメモリ上で生成できる、完全な.NET向けバーコードライブラリです。小規模なプロジェクトであれば、Free Spire.Barcode for .NET の利用も可能です。 2. ASP.NETでQRコードを生成（C#） このセクションでは、ASP.NET Core Razor Pages プロジェクトを使って、QRコード生成機能を実装する方法を解説します。 ステップ1：PageModelにQRコード生成ロジックを追加 以下は、Index.cshtml.cs ファイルに記述するC#コードです。ユーザーの入力を受け取り、Spire.Barcodeを使ってQRコードを生成し、それをBase64文字列としてフロントエンドに返します。 using Microsoft.AspNetCore.Mvc; using Microsoft.AspNetCore.Mvc.RazorPages; using Spire.Barcode; public class IndexModel : PageModel { [BindProperty] public string InputData { get; set; } public string QrCodeBase64 { get; set; } public void OnPost() { if (!string.IsNullOrWhiteSpace(InputData)) { QrCodeBase64 = GenerateQrCodeBase64(InputData); } } private string GenerateQrCodeBase64(string input) { var settings = new BarcodeSettings { Type = BarCodeType.QRCode, // QRコードの種類 Data = input, // エンコードするメインデータ Data2D = input, // 2次元バーコード用に必要（通常は Data と同じ） QRCodeDataMode = QRCodeDataMode.Byte, // バイトモード（多言語コンテンツに対応） QRCodeECL = QRCodeECL.M, // 中レベルの誤り訂正（15%） X = 3, // モジュールサイズ（画像の寸法に影響） ShowText = false, // デフォルトのバーコードテキストを非表示 ShowBottomText = true, // カスタムの下部テキストを表示 BottomText = input // QRコードの下に表示するテキスト }; var generator = new BarCodeGenerator(settings); using var ms = new MemoryStream(); var qrImage = generator.GenerateImage(); qrImage.Save(ms, System.Drawing.Imaging.ImageFormat.Png); return Convert.ToBase64String(ms.ToArray()); } } ポイント： BarcodeSettings でQRコードの設定（内容、誤り訂正レベル、表示文字など）を定義 GenerateImage() でQRコード画像を生成 Base64文字列に変換することで、ファイル保存せずにHTML上に直接表示が可能 ステップ2：QRコード表示用のRazorページを作成 以下は、Index.cshtml のマークアップです。入力フォーム、QRコードの表示、画像のダウンロードリンクを含みます。 @page @model IndexModel @{ ViewData["Title"] = "QRコードジェネレーター"; } <h2>QRコードジェネレーター</h2> <form method="post"> <label for="InputData">テキストまたはURLを入力してください：</label> <input type="text" id="InputData" name="InputData" style="width:300px;" required /> <button type="submit">QRコードを生成</button> </form> @if (!string.IsNullOrEmpty(Model.QrCodeBase64)) { <div style="margin-top:20px"> <img src="data:image/png;base64,@Model.QrCodeBase64" alt="QRコード" /> <br /> <a href="data:image/png;base64,@Model.QrCodeBase64" download="qrcode.png" style=" display: inline-block; margin-top: 10px; padding: 8px 16px; background-color: #0078D7; color: white; text-decoration: none; border-radius: 4px; font-weight: 600; cursor: pointer; "> QRコードをダウンロード </a> </div> } QRコードは Base64 形式の data: URI を使ってブラウザに直接表示され、ダウンロードも可能です。 実行例は以下の通りです： QRコードのスキャン機能が必要な場合は、C#でQRコードを読み取る方法をご参照ください。 3. QRコードの出力をカスタマイズする BarcodeSettings クラスを使って、QRコードの見た目や動作を柔軟に調整できます： プロパティ 機能説明 例 QRCodeDataMode テキストのエンコードモード QRCodeDataMode.Byte QRCodeECL 誤り訂正レベル QRCodeECL.H X モジュールのサイズ（解像度） settings.X = 6 ImageWidth/Height 画像の幅・高さを指定 settings.ImageWidth = 300 ForeColor 色を変更 settings.ForeColor = Color.Blue ShowText バーコードの文字を表示/非表示 settings.ShowText = false BottomText カスタムテキストを下部に表示 settings.BottomText = "スキャン" ShowBottomText 下部テキストの表示切り替え settings.ShowBottomText = true QRCodeLogoImage ロゴ画像を中央に挿入 settings.QRCodeLogoImage = Image.FromFile("logo.png") 詳細な仕様については BarcodeSettings APIドキュメント をご覧ください。 4. MVC・Web API・Web Formsへの応用 このQRコード生成ロジックは、Razor Pages以外のASP.NETプロジェクトにも簡単に応用できます。 MVCの場合： コントローラーに以下のようなアクションを追加します： public class QrController : Controller { public ActionResult Generate(string data) { var settings = new BarcodeSettings { Type = BarCodeType.QRCode, Data = data, QRCodeDataMode = QRCodeDataMode.Byte, QRCodeECL = QRCodeECL.M, X = 5 }; var generator = new BarCodeGenerator(settings); using var ms = new MemoryStream(); generator.GenerateImage().Save(ms, System.Drawing.Imaging.ImageFormat.Png); return File(ms.ToArray(), "image/png"); } } Web APIの場合： 以下のように GET エンドポイントを作成できます： [ApiController] [Route("api/[controller]")] public class QrApiController : ControllerBase { [HttpGet("generate")] public IActionResult GetQr(string data) { var settings = new BarcodeSettings { Type = BarCodeType.QRCode, Data = data }; var generator = new BarCodeGenerator(settings); using var ms = new MemoryStream(); generator.GenerateImage().Save(ms, System.Drawing.Imaging.ImageFormat.Png); return File(ms.ToArray(), "image/png"); } } React や Vue などのフロントエンドからAPIとして呼び出すのに最適です。 Web Formsの場合： コードビハインドで以下のように処理可能です： protected void btnGenerate_Click(object sender, EventArgs e) { var settings = new BarcodeSettings { Type = BarCodeType.QRCode, Data = txtInput.Text }; var generator = new BarCodeGenerator(settings); using var ms = new MemoryStream(); generator.GenerateImage().Save(ms, System.Drawing.Imaging.ImageFormat.Png); imgQR.ImageUrl = "data:image/png;base64," + Convert.ToBase64String(ms.ToArray()); } QRコード画像を <asp:Image> コントロールに埋め込んで表示します。 5. まとめ Spire.Barcode for .NET を使えば、Razor Pages、MVC、Web API、Web Forms など、すべての ASP.NET プロジェクトにおいて、QRコードの生成とカスタマイズが簡単に実装できます。 画像をBase64文字列で扱うことで、ファイル保存や管理が不要になり、展開や保守もシンプルになります。 認証システム、チケット発行、連絡先共有といったさまざまな用途に対応できる、信頼性の高いアプローチです。 よくある質問（FAQ） Q: 日本語やアラビア語などの文字に対応していますか？ A: はい。QRCodeDataMode.Byte を使用すればUnicode対応可能です。 Q: QRコードのサイズや色は変更できますか？ A: 可能です。X や ForeColor、ImageWidth などのプロパティを使って調整できます。 Q: このソリューションは完全にオフラインで動作しますか？ A: はい。外部APIへの接続なしでローカルで完結します。 Q: Web API経由でQRコード生成機能を提供できますか？ A: はい。ASP.NET Web API を使って他のアプリに画像を提供できます。
