現在、多くの業務アプリケーションでは ASP.NET 環境で QR コードやバーコードをスキャン するニーズが高まっています。チケット認証や決済、在庫管理などで、ASP.NET の QR コードスキャナーやバーコード読み取り機能を導入すると、Web／エンタープライズシステムの効率と精度が大きく向上します。
本チュートリアルでは、Spire.Barcode for .NET を使用し、C# で ASP.NET にバーコードスキャン機能を実装する手順を解説します。画像アップロードから QR／各種バーコードの読み取りまでをカバーし、高い認識精度と既存プロジェクトへの容易な統合を実現します。
ガイド構成
1. プロジェクトの準備
ステップ 1：プロジェクトの作成
スキャン機能の土台となる ASP.NET Core Razor Pages プロジェクトを作成します。以下のコマンド（または Visual Studio での作成）を使用します。
dotnet new webapp -n QrBarcodeScanner
cd QrBarcodeScanner
ステップ 2：Spire.Barcode for .NET のインストール
幅広いバーコード形式をデコードできる Spire.Barcode for .NET の NuGet パッケージをインストールします。NuGet パッケージ マネージャーから検索するか、次のコマンドを実行します。
dotnet add package Spire.Barcode
Spire.Barcode for .NET は、QR コードに加え Code128、EAN-13、Code39 など多数の形式をサポートします。追加の画像処理ライブラリは不要で、ASP.NET Core へ簡単に組み込めます。対応形式の一覧は BarcodeType API リファレンス を参照してください。
小規模用途には Free Spire.Barcode for .NET も利用できます。
2. ASP.NETでC#によるQRコード・バーコードスキャン機能の実装
信頼性の高いスキャン機能は、次の 2 要素で構成します。
- アップロード画像を処理・デコードする バックエンドロジック
- ユーザーが画像をアップロードできる シンプルな Web インターフェイス
まずバックエンド実装でスキャン処理を確実に動かし、その後最小構成の Razor Pages フロントエンドに接続します。
バックエンド：Spire.Barcode によるスキャン処理
アップロードファイルをメモリに読み込み、Spire.Barcode で処理します（MemoryStream またはファイルパスのいずれも可）。スキャン結果は配列で返却されます。形式ごとの分岐は不要で、QR／各種バーコードを一括認識できます。
Index.cshtml.cs
using Microsoft.AspNetCore.Mvc;
using Microsoft.AspNetCore.Mvc.RazorPages;
using Spire.Barcode;
public class IndexModel : PageModel
{
[BindProperty]
public IFormFile Upload { get; set; } // アップロードされたファイル
public string Result { get; set; } // スキャン結果
public string UploadedImageBase64 { get; set; } // プレビュー用 Base64 文字列
public void OnPost()
{
if (Upload != null && Upload.Length > 0)
{
using (var ms = new MemoryStream())
{
// ファイルをメモリに読み込む
Upload.CopyTo(ms);
// HTML <img> 表示用に Base64 へ変換
UploadedImageBase64 = "data:" + Upload.ContentType + ";base64," +
Convert.ToBase64String(ms.ToArray());
// ストリーム位置を先頭に戻す
ms.Position = 0;
// バーコード／QR コードをスキャン
try
{
string[] scanned = BarcodeScanner.Scan(ms);
Result = scanned != null && scanned.Length > 0
? string.Join(", ", scanned)
: "コードが検出されませんでした。";
}
catch (Exception ex)
{
Result = "スキャン中にエラーが発生しました: " + ex.Message;
}
}
}
}
}
主なクラスとメソッド
BarcodeScanner：QR／バーコードをデコードする静的クラス
BarcodeScanner.Scan(Stream imageStream)：ストリームから直接スキャンし、検出文字列の配列を返します（1 枚の画像内に複数コードがある場合も対応）。
補助メソッド（任意）
- BarcodeScanner.Scan(string imagePath)：ファイルパスでスキャンします。
- BarcodeScanner.ScanInfo(string imagePath)：種類・位置・データなど追加情報を含む結果を取得します。
要件に応じて使い分けできます。
フロントエンド：アップロード＆結果表示 UI
以下は、画像をアップロードしてスキャン結果を表示する簡易 UI です。アップロード後にプレビューと認識結果を表示し、ワンクリックでコピーできます。検証を素早く行えるよう、最低限のスタイルにしています。
Index.cshtml
@page
@model IndexModel
@{
ViewData["Title"] = "QR & バーコードスキャナー";
}
<div style="max-width:420px;margin:40px auto;padding:20px;border:1px solid #ccc;border-radius:8px;background:#f9f9f9;">
<h2 style="font-size:1.5rem;">QR & バーコードスキャナー</h2>
<form method="post" enctype="multipart/form-data" id="uploadForm">
<input type="file" name="upload" accept="image/*" required onchange="this.form.submit()" style="margin:10px 0;" />
</form>
@if (!string.IsNullOrEmpty(Model.UploadedImageBase64))
{
<div style="margin-top:15px;text-align:center;">
<img src="@Model.UploadedImageBase64" style="width:300px;height:300px;object-fit:contain;border:1px solid #ddd;background:#fff;" />
</div>
}
@if (!string.IsNullOrEmpty(Model.Result))
{
<div style="margin-top:15px;padding:10px;background:#e8f5e9;border-radius:6px;">
<b>スキャン結果:</b>
<p id="scanText">@Model.Result</p>
<button type="button" onclick="navigator.clipboard.writeText(scanText.innerText)" style="background:#28a745;color:#fff;padding:6px 10px;border:none;border-radius:4px;">コピー</button>
</div>
}
</div>
以下は、QR コードと Code128 バーコードの両方を認識した後の画面イメージです。結果表示とワンクリックコピーが利用できます。
この ASP.NET Core アプリは、アップロード画像から QR コードおよび各種バーコードをスキャンできます。コード生成が必要な場合は、ASP.NET Core で QR コードを生成する方法 も参照してください。
3. テストとトラブルシューティング
アプリを実行したら、次のような画像で動作確認を行います。
- URL またはプレーンテキストを含む QR コード画像
- Code128 や EAN-13 などの バーコード画像
認識がうまくいかない場合のチェックポイント：
- コントラストが高く、歪みの少ない画像を使用します。
- 解像度は極端に大きすぎ／小さすぎないものにします。
- JPG / PNG / BMP など複数形式で試します。
- 反射・映り込み・暗所などを避けます。
- 1 枚の画像に複数コードがある場合は、各コードの間隔を十分に空けて認識精度を高めます。
回帰テスト向けに、サンプルの QR／バーコード画像ライブラリを小規模に用意しておくと便利です。
4. 他の .NET アプリケーションへの応用
本チュートリアルのスキャンロジックは アプリ種別に依存しません。画像の受け渡し方法だけを変えれば、以下のような環境でも同じ BarcodeScanner.Scan() を再利用できます。
- ASP.NET Core MVC コントローラー／Web API エンドポイント
- WinForms / WPF などのデスクトップアプリ
- コンソールユーティリティ（バッチ処理）
例：最小構成の ASP.NET Core Web API HTTP POST で画像ファイルを受け取り、JSON で結果を返します。
[ApiController]
[Route("api/[controller]")]
public class ScanController : ControllerBase
{
[HttpPost]
public IActionResult Scan(IFormFile file)
{
if (file == null) return BadRequest("No file uploaded");
using var ms = new MemoryStream();
file.CopyTo(ms);
ms.Position = 0;
string[] results = BarcodeScanner.Scan(ms);
return Ok(results);
}
}
例：コンソールアプリ ローカル画像をスキャンして結果を出力します。
string[] result = BarcodeScanner.Scan(@"C:\path\to\image.png");
Console.WriteLine(string.Join(", ", result));
この柔軟性により、既存／新規の .NET プロジェクトへ QR／バーコードスキャンを素早く追加できます。
5. まとめ
本記事では、Spire.Barcode for .NET を用いて ASP.NET Core に QR／バーコードスキャン機能を実装する手順 を解説しました。画像を受け取り、デコードし、結果を表示するまでの流れをシンプルに構築でき、EC、チケット、ドキュメント認証など多様な業務シナリオに応用できます。
高度な要件に対しては、認識処理のカスタマイズや複数画像形式・バーコード種類への詳細対応など、追加機能も利用可能です。すべての高度機能を解放するには、無償評価ライセンスの申請 を行ってください。
今すぐ Spire.Barcode for .NET をダウンロード して、ASP.NET 向けのバーコードスキャン機能を実装しましょう。
