ASP.NET MVCでバーコードを動的に生成および表示する方法
ASP.NET MVCは、開発者が堅牢で動的なWebアプリケーションを構築することを可能にする人気のあるWeb開発フレームワークです。 Webアプリケーションの一般的な要件の1つは、バーコード画像を生成し表示する機能です。 バーコード画像は、機械で読み取れる形式でデータを表すために使用され、バーコードスキャナーで読み取ることができます。
ASP.NET MVCで動的にバーコード画像を生成および表示することは、市場をリードするC#ライブラリであるIronBarcodeを使用して達成できます。 このライブラリは、開発者がさまざまな形式のプラットフォームで簡単にバーコード画像を生成できるAPIを提供します。対応形式には、Code 39、Code 128、QRコードなどがあります。 IronBarcodeは、.NET 6からWindows固有の.NET Graphics APIを利用せずに、クロスプラットフォームの機能を提供し、より多くのソース互換性を実現します。
IronBarcode
IronBarcodeは、.NETアプリケーションでバーコード画像を作成、読み取り、操作するための幅広い機能を提供する人気 for .NETバーコードライブラリです。 このライブラリは、.NETコンポーネントとライブラリを専門とするソフトウェア開発会社であるIron Softwareによって開発およびメンテナンスされています。 IronBarcodeは、Code 128、Code 39、QRコード、Data Matrix、PDF417など、幅広いバーコード形式をサポートしています。また、ライブラリにはカスタム寸法、色、フォントでバーコードを生成したり、バーコード画像にテキストやロゴを追加したりする機能も備えています。
バーコード生成に加えて、IronBarcodeにはバーコード画像の読み取りとデコード機能も含まれています。 このライブラリは、画像、PDFドキュメント、ライブカメラフィードからのバーコードの読み取りとデコードが可能です。 1Dと2Dの両方のバーコード形式をサポートしており、部分的に隠れたまたは破損したバーコードでも認識できます。
前提条件
.NETアプリケーションでIronBarcodeを使用する前に、満たす必要のあるいくつかの前提条件があります。
- .NET Frameworkまたは.NET Core: IronBarcodeは、.NET Frameworkと.NET Coreの両方で動作するように設計されています。 開発環境に適切な.NETバージョンがインストールされていることを確認してください。
- Visual Studio: IronBarcodeは、簡単に開発およびテストできるようにVisual Studioに統合できます。 Visual Studio Community、Professional、またはEnterpriseエディションを使用できます。 Visual Studioのウェブサイトからダウンロードできます。
- IronBarcodeライブラリ: Iron SoftwareのウェブサイトまたはNuGetパッケージマネージャーを介してIronBarcodeライブラリをダウンロードしてインストールします。 ライブラリは、NuGetパッケージマネージャーコンソールを使用して次のコマンドを実行することでインストールできます:
Install-Package BarCode。
IronBarcodeは開発用には無料ですが、商用および配布目的で使用するにはライセンスが必要です。 そのすべての機能をテストするために無料トライアルを試すことができます。
新しいASP.NET MVCプロジェクトを作成する
Visual Studioを開き、新しいプロジェクトを作成をクリックします。
動的にバーコードを生成してASP.NET MVCで表示する方法:図1
新しいウィンドウで"ASP.NET MVC(Webアプリ) モデルビュコントローラ"を選択し、次へボタンをクリックします。
動的にバーコードを生成してASP.NET MVCで表示する方法:図2
新しいプロジェクトの名前とその場所を入力して、次へをクリックします。
動的にバーコードを生成してASP.NET MVCで表示する方法:図3
使用したい.NETバージョンを選択し、他のオプションはそのままにして作成をクリックします。
動的にバーコードを生成してASP.NET MVCで表示する方法:図4
.NETプロジェクトが作成されます。
動的にバーコードを生成してASP.NET MVCで表示する方法:図5
IronBarcodeのインストール
1. NuGetパッケージマネージャーを使用する
このオプションはVisual Studio内で利用可能で、IronBarcodeパッケージを直接ソリューションにインストールします。 ツールに移動して、NuGetパッケージマネージャーをクリックします。
動的にバーコードを生成してASP.NET MVCで表示する方法:図6
NuGetパッケージマネージャーの検索ボックスを使用してIronBarcodeライブラリを検索します。 利用可能なパッケージのリストからIronBarcodeを選択します。
動的にバーコードを生成してASP.NET MVCで表示する方法:図7
2. Visual Studioのコマンドラインを使用する
Visual Studioメニューで、ツール > NuGetパッケージマネージャー > パッケージマネージャーコンソールに移動します。
動的にバーコードを生成してASP.NET MVCで表示する方法:図8
パッケージマネージャーコンソールタブに次の行を入力します:Install-Package BarCode。
パッケージは現在のプロジェクトにダウンロード/インストールされ、使用準備が整います。
動的にバーコードを生成してASP.NET MVCで表示する方法:図9
IronBarcodeを使用してバーコード画像を生成し表示する
環境が整ったら、ASP.NET MVCでバーコード画像を動的に生成するためのコードの書き方を始められます。
最初に、モデルフォルダの下にGenerateBarcodeModel.csという名前のクラスを作成します。
using System.ComponentModel.DataAnnotations;
namespace GenerateBarcodeMVCCore6_Demo.Models
{
public class GenerateBarcodeModel
{
[Display(Name = "Enter Barcode Text")]
public string Barcode { get; set; }
}
}Imports System.ComponentModel.DataAnnotations
Namespace GenerateBarcodeMVCCore6_Demo.Models
Public Class GenerateBarcodeModel
<Display(Name := "Enter Barcode Text")>
Public Property Barcode() As String
End Class
End NamespaceImports System.ComponentModel.DataAnnotations
Namespace GenerateBarcodeMVCCore6_Demo.Models
Public Class GenerateBarcodeModel
<Display(Name := "Enter Barcode Text")>
Public Property Barcode() As String
End Class
End Namespace生成されたバーコード画像を保存するために、wwwrootフォルダの下に"GeneratedBarcode"という名前のフォルダを作成します。
動的にバーコードを生成してASP.NET MVCで表示する方法:図10
コントローラーズフォルダのHomeController.csクラスに次のアクションメソッドを追加します。
using Microsoft.AspNetCore.Mvc;
using IronBarCode;
using System;
using System.Drawing;
using System.IO;
namespace YourNamespace.Controllers
{
public class HomeController : Controller
{
private readonly IWebHostEnvironment _environment;
public HomeController(IWebHostEnvironment environment)
{
_environment = environment;
}
public IActionResult CreateBarcode()
{
return View();
}
// Handling POST operation inside this Action method
[HttpPost]
public IActionResult CreateBarcode(GenerateBarcodeModel generateBarcode)
{
try
{
// Create a barcode using the input text
GeneratedBarcode barcode = BarcodeWriter.CreateBarcode(generateBarcode.Barcode, BarcodeWriterEncoding.Code128);
// Adding annotation text to barcode
barcode.AddBarcodeValueTextBelowBarcode();
// Styling the Barcode
barcode.ResizeTo(400, 120);
barcode.ChangeBarCodeColor(Color.Red);
barcode.SetMargins(10);
// Define path to save the barcode image
string path = Path.Combine(_environment.WebRootPath, "GeneratedBarcode");
if (!Directory.Exists(path))
{
Directory.CreateDirectory(path);
}
// Save the generated barcode as a PNG file
string filePath = Path.Combine(_environment.WebRootPath, "GeneratedBarcode/barcode.png");
barcode.SaveAsPng(filePath);
// Get the file name and URL for the generated barcode image
string fileName = Path.GetFileName(filePath);
string imageUrl = $"{this.Request.Scheme}://{this.Request.Host}{this.Request.PathBase}/GeneratedBarcode/{fileName}";
ViewBag.QrCodeUri = imageUrl;
}
catch (Exception)
{
throw;
}
return View();
}
}
}using Microsoft.AspNetCore.Mvc;
using IronBarCode;
using System;
using System.Drawing;
using System.IO;
namespace YourNamespace.Controllers
{
public class HomeController : Controller
{
private readonly IWebHostEnvironment _environment;
public HomeController(IWebHostEnvironment environment)
{
_environment = environment;
}
public IActionResult CreateBarcode()
{
return View();
}
// Handling POST operation inside this Action method
[HttpPost]
public IActionResult CreateBarcode(GenerateBarcodeModel generateBarcode)
{
try
{
// Create a barcode using the input text
GeneratedBarcode barcode = BarcodeWriter.CreateBarcode(generateBarcode.Barcode, BarcodeWriterEncoding.Code128);
// Adding annotation text to barcode
barcode.AddBarcodeValueTextBelowBarcode();
// Styling the Barcode
barcode.ResizeTo(400, 120);
barcode.ChangeBarCodeColor(Color.Red);
barcode.SetMargins(10);
// Define path to save the barcode image
string path = Path.Combine(_environment.WebRootPath, "GeneratedBarcode");
if (!Directory.Exists(path))
{
Directory.CreateDirectory(path);
}
// Save the generated barcode as a PNG file
string filePath = Path.Combine(_environment.WebRootPath, "GeneratedBarcode/barcode.png");
barcode.SaveAsPng(filePath);
// Get the file name and URL for the generated barcode image
string fileName = Path.GetFileName(filePath);
string imageUrl = $"{this.Request.Scheme}://{this.Request.Host}{this.Request.PathBase}/GeneratedBarcode/{fileName}";
ViewBag.QrCodeUri = imageUrl;
}
catch (Exception)
{
throw;
}
return View();
}
}
}Imports Microsoft.AspNetCore.Mvc
Imports IronBarCode
Imports System
Imports System.Drawing
Imports System.IO
Namespace YourNamespace.Controllers
Public Class HomeController
Inherits Controller
Private ReadOnly _environment As IWebHostEnvironment
Public Sub New(ByVal environment As IWebHostEnvironment)
_environment = environment
End Sub
Public Function CreateBarcode() As IActionResult
Return View()
End Function
' Handling POST operation inside this Action method
<HttpPost>
Public Function CreateBarcode(ByVal generateBarcode As GenerateBarcodeModel) As IActionResult
Try
' Create a barcode using the input text
Dim barcode As GeneratedBarcode = BarcodeWriter.CreateBarcode(generateBarcode.Barcode, BarcodeWriterEncoding.Code128)
' Adding annotation text to barcode
barcode.AddBarcodeValueTextBelowBarcode()
' Styling the Barcode
barcode.ResizeTo(400, 120)
barcode.ChangeBarCodeColor(Color.Red)
barcode.SetMargins(10)
' Define path to save the barcode image
Dim path As String = System.IO.Path.Combine(_environment.WebRootPath, "GeneratedBarcode")
If Not Directory.Exists(path) Then
Directory.CreateDirectory(path)
End If
' Save the generated barcode as a PNG file
Dim filePath As String = System.IO.Path.Combine(_environment.WebRootPath, "GeneratedBarcode/barcode.png")
barcode.SaveAsPng(filePath)
' Get the file name and URL for the generated barcode image
Dim fileName As String = System.IO.Path.GetFileName(filePath)
Dim imageUrl As String = $"{Me.Request.Scheme}://{Me.Request.Host}{Me.Request.PathBase}/GeneratedBarcode/{fileName}"
ViewBag.QrCodeUri = imageUrl
Catch e1 As Exception
Throw
End Try
Return View()
End Function
End Class
End NamespaceImports Microsoft.AspNetCore.Mvc
Imports IronBarCode
Imports System
Imports System.Drawing
Imports System.IO
Namespace YourNamespace.Controllers
Public Class HomeController
Inherits Controller
Private ReadOnly _environment As IWebHostEnvironment
Public Sub New(ByVal environment As IWebHostEnvironment)
_environment = environment
End Sub
Public Function CreateBarcode() As IActionResult
Return View()
End Function
' Handling POST operation inside this Action method
<HttpPost>
Public Function CreateBarcode(ByVal generateBarcode As GenerateBarcodeModel) As IActionResult
Try
' Create a barcode using the input text
Dim barcode As GeneratedBarcode = BarcodeWriter.CreateBarcode(generateBarcode.Barcode, BarcodeWriterEncoding.Code128)
' Adding annotation text to barcode
barcode.AddBarcodeValueTextBelowBarcode()
' Styling the Barcode
barcode.ResizeTo(400, 120)
barcode.ChangeBarCodeColor(Color.Red)
barcode.SetMargins(10)
' Define path to save the barcode image
Dim path As String = System.IO.Path.Combine(_environment.WebRootPath, "GeneratedBarcode")
If Not Directory.Exists(path) Then
Directory.CreateDirectory(path)
End If
' Save the generated barcode as a PNG file
Dim filePath As String = System.IO.Path.Combine(_environment.WebRootPath, "GeneratedBarcode/barcode.png")
barcode.SaveAsPng(filePath)
' Get the file name and URL for the generated barcode image
Dim fileName As String = System.IO.Path.GetFileName(filePath)
Dim imageUrl As String = $"{Me.Request.Scheme}://{Me.Request.Host}{Me.Request.PathBase}/GeneratedBarcode/{fileName}"
ViewBag.QrCodeUri = imageUrl
Catch e1 As Exception
Throw
End Try
Return View()
End Function
End Class
End Namespace上記のコード内のアクションメソッドは、後で作成するビューから生成される送信要求を処理します。 IronBarcodeを使用すると、バーコード形式、画像要素、バーコードフォント、HTML画像要素をカスタマイズできます。 IronDrawing など、バーコードフォントのインストールに必要な追加ライブラリが必要になる場合があります。 より詳細なAPIドキュメントはこちらで見つけることができます。
バーコードジェネレーターのメソッド用にビューを作成できます。
CreateBarcodeメソッドを右クリックし、[ビューの追加]を選択します。
動的にバーコードを生成してASP.NET MVCで表示する方法:図11
Razorビューを選択し、追加をクリックします。
動的にバーコードを生成してASP.NET MVCで表示する方法:図12
以下の画像に示すようにパラメーターを選択し、追加をクリックします。 そのメソッド用のビューが自動的に追加されます。
動的にバーコードを生成してASP.NET MVCで表示する方法:図13
生成されたコードを変更して、インターフェースを望む形に変更できます。
@model GenerateBarcodeMVCCore6_Demo.Models.GenerateBarcodeModel
@{
ViewData["Title"] = "CreateBarcode";
}
<h1>CreateBarcode</h1>
<form asp-action="CreateBarcode" method="post">
<div>
<label asp-for="Barcode"></label>
<input asp-for="Barcode" />
<span asp-validation-for="Barcode"></span>
</div>
<button type="submit">Generate Barcode</button>
</form>
@if (ViewBag.QrCodeUri != null)
{
<div>
<img src="@ViewBag.QrCodeUri" alt="Barcode Image" />
</div>
}
@section Scripts {
@{await Html.RenderPartialAsync("_ValidationScriptsPartial");}
}
これで準備完了です。navbarに追加するコードを追加します。
<li class="nav-item">
<a class="nav-link text-dark" asp-controller="Home" asp-action="CreateBarcode">CreateBarcode</a>
</li>
アプリケーションを実行し、テキストフィールドにテキストを書き、バーコード生成ボタンをクリックすると、バーコード画像が動的に生成され表示されます。
5.1. 出力
動的にバーコードを生成してASP.NET MVCで表示する方法:図14
6. 結論
ASP.NET MVCアプリケーションでバーコード画像を動的に生成・表示するには、IronBarcodeライブラリを使用することができます。これは、.NETアプリケーション内でバーコード画像を作成、読み取り、操作するための幅広い機能を提供する強力な.NETバーコードライブラリです。 .NETフレームワーク、Visual Studio、IronBarcodeライブラリのインストールなどの前提条件を満たすことで、開発者は簡単にASP.NET MVCプロジェクトを作成し、Code 39、Code 128、QRコードなどのさまざまな形式でバーコード画像を生成および表示できます。 IronBarcodeライブラリは、開発者にカスタム寸法、色、フォントでバーコードを生成し、バーコード画像にテキストやロゴを追加する機能を提供します。 バーコード生成に加えて、IronBarcodeにはバーコード画像の読み取りとデコード機能も含まれています。 IronBarcodeを使用すると、開発者はビジネスニーズに応える強力で動的なWebアプリケーションを簡単に作成できます。 このトピックに関連するチュートリアルについては、次のリンクを参照してください。 バーコードおよびQRコード生成に関するステップバイステップのチュートリアルについては、次のリンクを参照してください。
Curtis Chauは、カールトン大学でコンピュータサイエンスの学士号を取得し、Node.js、TypeScript、JavaScript、およびReactに精通したフロントエンド開発を専門としています。直感的で美しいユーザーインターフェースを作成することに情熱を持ち、Curtisは現代のフレームワークを用いた開発や、構造の良い視覚的に魅力的なマニュアルの作成を楽しんでいます。