在實際環境中測試
在生產環境中測試無浮水印。
在任何需要的地方都能運作。
QR 碼在我們的數字世界中變得無處不在,經常用於廣告、零售、活動管理等領域。對於在 ASP.NET 框架中工作的開發人員來說,將 QR 碼掃描功能整合到 web 應用中可以提升用戶體驗和功能性。本文探討如何在 ASP.NET 應用中實現 QR 碼掃描器的過程,涵蓋所需的工具、庫以及逐步的實施方法。我們將使用 IronQR,一個強大的 QR 碼生成庫 Iron Software 讀取 QR 碼。
使用 Visual Studio 創建 ASP.NET 專案
安裝 IronQR 從包管理器中加入程式庫
上傳 QR 圖片並讀取 QR。
QR (快速反應) 二維條碼可以存儲從 URL 到聯絡資訊等各種信息,通常使用智能手機或專用掃描設備掃描。在網絡應用程序中,QR 碼可以用於各種目的,例如:
IronQR 是一個專為QR碼生成和掃描而設計的強大.NET庫,提供強大的功能且易於使用。這個多功能庫不僅能處理QR碼,還能管理其他類型的條碼,這使得它成為.NET生態系統內開發人員的首選。在這裡,我們將探討如何將IronQR庫整合到ASP.NET應用程式中,以便進行QR碼掃描。
讀取QR碼: IronQR 可以從各種圖像格式中讀取 QR 碼,包括 jpg、png、svg、bmp、gif、tif、tiff 等等。它還支援多頁圖像和自定義 QR 檢測模型。輸出數據格式包括文本、URL、坐標等等。
寫入 QR 碼:您可以生成 QR 碼並將它們保存為圖像 (jpg, png, gif, tiff, bmp), 流,甚至将它们加盖到现有的PDF上。编码数据如文字、URL、字节和数字,并生成二维码。通过调整大小、调节边距、重新着色和添加标志来定制二维码样式。
錯誤處理和校正: IronQR 提供詳細的錯誤訊息和自訂的QR錯誤校正。它確保容錯並支援空檢查和檢查碼。
先進的機器學習模型: IronQR 使用先進的機器學習模型進行 QR 碼識別。此模型確保在各種平台(包括移動、桌面和雲環境)上的 QR 碼讀取準確且可靠。
跨平台兼容性: IronQR 設計用於 C#、F# 和 VB.NET,運行於各種 .NET 版本,如 .NET Core (8, 7, 6, 5, 和 3.1+).NET Standard (2.0+).NET 框架 (4.6.2+)
它支援不同的專案類型,包括網頁 (Blazor 和 WebForms),手機 (Xamarin & MAUI),桌面 (WPF & MAUI)和控制台應用程序。
IronQR 包括各種辦公文件工具、PDF 編輯、OCR 等在內的 .NET API 產品。
首先,建立一個新專案並選擇如下所示的 MVC 樣板
接下來,您應該為該項目提供一個項目名稱和位置。
選擇 .NET 版本。
按下建立按鈕將會建立以下程式碼和專案。
安裝 IronQR 從 Visual Studio 套件管理員中安裝此程式庫,如下所示
現在,讓我們建立一個 QR 碼應用程式。
QrCode
模型using System.ComponentModel.DataAnnotations;
namespace IronQRScannerAsp.Models
{
public class QRCodeModel
{
[Display(Name = "Select QR Image")]
public IFormFile QRCodeImage
{
get;
set;
}
}
}
using System.ComponentModel.DataAnnotations;
namespace IronQRScannerAsp.Models
{
public class QRCodeModel
{
[Display(Name = "Select QR Image")]
public IFormFile QRCodeImage
{
get;
set;
}
}
}
Imports System.ComponentModel.DataAnnotations
Namespace IronQRScannerAsp.Models
Public Class QRCodeModel
<Display(Name := "Select QR Image")>
Public Property QRCodeImage() As IFormFile
End Class
End Namespace
在控制器資料夾上點擊右鍵並提供如下所示的名稱,以新增控制器:
選擇空控制器。
提供控制器名稱。
現在將以下代碼添加到控制器。
using IronQr;
using IronQRScannerAsp.Models;
using IronSoftware.Drawing;
using Microsoft.AspNetCore.Mvc;
namespace IronQRScannerAsp.Controllers
{
public class QrCodeController : Controller
{
private readonly IWebHostEnvironment _environment;
public QrCodeController(IWebHostEnvironment environment)
{
_environment = environment;
}
public IActionResult Index()
{
ViewBag.QrCodeText = "Text";
return View();
}
[HttpPost]
public IActionResult ScanQRCode(QRCodeModel qrImage)
{
string path = Path.Combine(_environment.WebRootPath, "ScanQRCode");
if (!Directory.Exists(path))
{
Directory.CreateDirectory(path);
}
string filePath = Path.Combine(_environment.WebRootPath, "ScanQRCode/qrcode.png");
using (var stream = System.IO.File.Create(filePath))
{
qrImage.QRCodeImage.CopyTo(stream);
}
// Open the asset to read a QR Code from
var bitmap = AnyBitmap.FromFile(filePath);
// Load the asset into QrImageInput
QrImageInput imageInput = new QrImageInput(bitmap);
// Create a QR Reader object
QrReader reader = new QrReader();
// Read the Input an get all embedded QR Codes
IEnumerable<QrResult> results = reader.Read(imageInput);
ViewBag.QrCodeText = results.First().Value;
string imageUrl = $"{this.Request.Scheme}://{this.Request.Host}{this.Request.PathBase}" + "/ScanQRCode/qrcode.png";
ViewBag.QrCodeUri = imageUrl;
return View();
}
}
}
using IronQr;
using IronQRScannerAsp.Models;
using IronSoftware.Drawing;
using Microsoft.AspNetCore.Mvc;
namespace IronQRScannerAsp.Controllers
{
public class QrCodeController : Controller
{
private readonly IWebHostEnvironment _environment;
public QrCodeController(IWebHostEnvironment environment)
{
_environment = environment;
}
public IActionResult Index()
{
ViewBag.QrCodeText = "Text";
return View();
}
[HttpPost]
public IActionResult ScanQRCode(QRCodeModel qrImage)
{
string path = Path.Combine(_environment.WebRootPath, "ScanQRCode");
if (!Directory.Exists(path))
{
Directory.CreateDirectory(path);
}
string filePath = Path.Combine(_environment.WebRootPath, "ScanQRCode/qrcode.png");
using (var stream = System.IO.File.Create(filePath))
{
qrImage.QRCodeImage.CopyTo(stream);
}
// Open the asset to read a QR Code from
var bitmap = AnyBitmap.FromFile(filePath);
// Load the asset into QrImageInput
QrImageInput imageInput = new QrImageInput(bitmap);
// Create a QR Reader object
QrReader reader = new QrReader();
// Read the Input an get all embedded QR Codes
IEnumerable<QrResult> results = reader.Read(imageInput);
ViewBag.QrCodeText = results.First().Value;
string imageUrl = $"{this.Request.Scheme}://{this.Request.Host}{this.Request.PathBase}" + "/ScanQRCode/qrcode.png";
ViewBag.QrCodeUri = imageUrl;
return View();
}
}
}
Imports IronQr
Imports IronQRScannerAsp.Models
Imports IronSoftware.Drawing
Imports Microsoft.AspNetCore.Mvc
Namespace IronQRScannerAsp.Controllers
Public Class QrCodeController
Inherits Controller
Private ReadOnly _environment As IWebHostEnvironment
Public Sub New(ByVal environment As IWebHostEnvironment)
_environment = environment
End Sub
Public Function Index() As IActionResult
ViewBag.QrCodeText = "Text"
Return View()
End Function
<HttpPost>
Public Function ScanQRCode(ByVal qrImage As QRCodeModel) As IActionResult
Dim path As String = System.IO.Path.Combine(_environment.WebRootPath, "ScanQRCode")
If Not Directory.Exists(path) Then
Directory.CreateDirectory(path)
End If
Dim filePath As String = System.IO.Path.Combine(_environment.WebRootPath, "ScanQRCode/qrcode.png")
Using stream = System.IO.File.Create(filePath)
qrImage.QRCodeImage.CopyTo(stream)
End Using
' Open the asset to read a QR Code from
Dim bitmap = AnyBitmap.FromFile(filePath)
' Load the asset into QrImageInput
Dim imageInput As New QrImageInput(bitmap)
' Create a QR Reader object
Dim reader As New QrReader()
' Read the Input an get all embedded QR Codes
Dim results As IEnumerable(Of QrResult) = reader.Read(imageInput)
ViewBag.QrCodeText = results.First().Value
Dim imageUrl As String = $"{Me.Request.Scheme}://{Me.Request.Host}{Me.Request.PathBase}" & "/ScanQRCode/qrcode.png"
ViewBag.QrCodeUri = imageUrl
Return View()
End Function
End Class
End Namespace
提供的代碼片段是用於 ASP.NET Core MVC 控制器,名為 QrCodeController,設計來使用 IronQR 庫處理 QR 碼掃描功能。以下是該代碼執行的簡要描述:
它構建一個檔案路徑 (路径) 在應用程式的 Web 根目錄中特別用於保存 QR 碼影像 (「ScanQRCode」目錄)它檢查此目錄是否存在,如果不存在,則創建它以避免在保存文件時出現找不到文件的錯誤。
它構建完整的檔案路徑 (filePath
) 上傳的 QR 碼圖片將儲存的位置 ("ScanQRCode/qrcode.png")這將覆蓋任何同名的現有文件,有效處理新掃描而不累積文件。
它打開文件流並複製上傳圖像的內容 (qrImage.QRCodeImage
,可能是一個表單文件) 到伺服器上的指定位置。
使用 AnyBitmap.FromFile
(文件路徑)將已保存的圖像文件加載到適合 QR 代碼掃描的格式中。 AnyBitmap
可能用作輔助類,以將圖像文件轉換為 QR 讀取器可以處理的位圖對象。
將加載的位圖封裝到 QrImageInput
中,該類特別設計為 QR 碼讀取過程的輸入。實例化一個 QrReader
,這是 IronQR 庫中的一個組件,用於檢測和解碼 QR 碼。
呼叫 reader.Read
(圖像輸入)掃描圖像中的QR碼。此方法返回 IEnumerable
。, 每個
QrResult包含圖像中檢測到的 QR 碼數據。使用
results.First提取第一個結果的值()將此解碼信息存儲在
ViewBag.QrCodeText中的
.Value`。這假設圖像至少包含一個 QR 碼,並且不處理沒有檢測到 QR 碼的潛在錯誤。
構建 URL (imageUrl
) 指向伺服器上儲存的 QR 碼圖像。此 URL 是使用當前 HTTP 請求的模式、主機和路徑基礎構建的,確保用戶可以存取以供查看。構建的 URL 被保存到 ViewBag.QrCodeUri
中。
返回相同的視圖 (檢視()``` ```),該程式將顯示 QR 碼圖像和解碼文本給使用者。
ViewBag` 用來將 QR 碼的解碼文本和圖像的 URL 傳遞到視圖中以供渲染。
在 QrCodeController
類別中的 CreateQRCode
動作方法上右鍵點擊,新增一個新的視圖。
選擇「添加視圖」選項,然後選擇「Razor 視圖」。點擊「添加」。
然後選擇上一次生成的 "Create" 範本和模型類別。
現在將視圖類中的程式碼替換為下面顯示的程式碼。
@model IronQRScannerAsp.Models.QRCodeModel
@{
ViewData["Title"] = "ScanQRCode";
}
<h1>ScanQRCode</h1>
<h4>QRCodeModel</h4>
<hr />
<div class="row">
<div class="col-md-14">
<form asp-action="ScanQRCode" enctype="multipart/form-data">
<div asp-validation-summary="ModelOnly" class="text-danger"></div>
<div class="form-group">
</div>
<div class="form-group">
<h3>Scanned Text:</h3>
<h4>@ViewBag.QrCodeText</h4>
</div>
<div class="form-group">
<img src="@ViewBag.QrCodeUri" class="img-thumbnail" />
</div>
</form>
</div>
</div>
<div>
<a asp-action="Index">Clear</a>
</div>
@section Scripts {
@{
await Html.RenderPartialAsync("_ValidationScriptsPartial");
}
}
@model IronQRScannerAsp.Models.QRCodeModel
@{
ViewData["Title"] = "ScanQRCode";
}
<h1>ScanQRCode</h1>
<h4>QRCodeModel</h4>
<hr />
<div class="row">
<div class="col-md-14">
<form asp-action="ScanQRCode" enctype="multipart/form-data">
<div asp-validation-summary="ModelOnly" class="text-danger"></div>
<div class="form-group">
</div>
<div class="form-group">
<h3>Scanned Text:</h3>
<h4>@ViewBag.QrCodeText</h4>
</div>
<div class="form-group">
<img src="@ViewBag.QrCodeUri" class="img-thumbnail" />
</div>
</form>
</div>
</div>
<div>
<a asp-action="Index">Clear</a>
</div>
@section Scripts {
@{
await Html.RenderPartialAsync("_ValidationScriptsPartial");
}
}
model ReadOnly Property () As IronQRScannerAsp.Models.QRCodeModel
ViewData("Title") = "ScanQRCode"
End Property
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: <h1> ScanQRCode</h1> <h4> QRCodeModel</h4> <hr /> <div class="row"> <div class="col-md-14"> <form asp-action="ScanQRCode" enctype="multipart/form-data"> <div asp-validation-summary="ModelOnly" class="text-danger"></div> <div class="form-group"> </div> <div class="form-group"> <h3> Scanned Text:</h3> <h4> @ViewBag.QrCodeText</h4> </div> <div class="form-group"> <img src="@ViewBag.QrCodeUri" class="img-thumbnail" /> </div> </form> </div> </div> <div> <a asp-action="Index"> Clear</a> </div> @section Scripts
"form-group"> </div> <div class="form-group"> (Of h3) Scanned Text
Inherits </h3>(Of h4) ViewBag.QrCodeText</h4> </div> <div class="form-group"> <img src="@ViewBag.QrCodeUri" class="img-thumbnail" /> </div> </form> </div> </div> (Of div) <a asp-action="Index"> Clear</a> </div> section Scripts
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: Friend <h1> ScanQRCode</h1> <h4> QRCodeModel</h4> <hr /> <div Class="row"> <div class="col-md-14"> <form asp-action="ScanQRCode" enctype="multipart/form-data"> <div asp-validation-summary="ModelOnly" class="text-danger"></div> <div class="form-group"> </div> <div class
"text-danger"></div> <div class="form-group"> </div> <div class
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: Private Friend <h1> ScanQRCode</h1> <h4> QRCodeModel</h4> <hr /> <div Class="row"> <div class="col-md-14"> <form asp-action="ScanQRCode" enctype="multipart/form-data"> <div asp-validation-summary="ModelOnly" class="text-danger"></div> <div class
"ModelOnly" class="text-danger"></div> <div class
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: Private Private Friend <h1> ScanQRCode</h1> <h4> QRCodeModel</h4> <hr /> <div Class="row"> <div class="col-md-14"> <form asp-action="ScanQRCode" enctype="multipart/form-data"> <div asp-validation-summary="ModelOnly" class
"multipart/form-data"> <div asp-validation-summary="ModelOnly" class
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: Private Private Private Friend <h1> ScanQRCode</h1> <h4> QRCodeModel</h4> <hr /> <div Class="row"> <div class="col-md-14"> <form asp-action="ScanQRCode" enctype="multipart/form-data"> <div asp-validation-summary
"ScanQRCode" enctype="multipart/form-data"> <div asp-validation-summary
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: Private Private Private Private Friend <h1> ScanQRCode</h1> <h4> QRCodeModel</h4> <hr /> <div Class="row"> <div class="col-md-14"> <form asp-action="ScanQRCode" enctype
"col-md-14"> <form asp-action="ScanQRCode" enctype
'INSTANT VB WARNING: An assignment within expression was extracted from the following statement:
'ORIGINAL LINE: Private Private Private Private Private Friend <h1> ScanQRCode</h1> <h4> QRCodeModel</h4> <hr /> <div Class="row"> <div class="col-md-14"> <form asp-action
"row"> <div class="col-md-14"> <form asp-action
'INSTANT VB WARNING: Instant VB cannot determine whether both operands of this division are integer types - if they are then you should use the VB integer division operator:
Private Private Private Private Private Private Private Friend (Of h1) ScanQRCode</h1> (Of h4) QRCodeModel</h4> <hr /> <div Class="row"> <div class
@
If True Then
Await Html.RenderPartialAsync("_ValidationScriptsPartial")
End If
End Class
現在在 program.cs 中更改以下代碼,以使上述視圖為預設路由
app.MapControllerRoute(
name: "default",
pattern: "{controller=QrCode}/{action=Index}");
app.MapControllerRoute(
name: "default",
pattern: "{controller=QrCode}/{action=Index}");
app.MapControllerRoute(name:= "default", pattern:= "{controller=QrCode}/{action=Index}")
這將默認路由從 HomeController
更改為我們的 QrCode
控制器。
輸入圖像 URL:https://ironsoftware.com/csharp/qr。
在頁面上,選擇一個 QR 碼圖片並點擊上傳以解碼 QR 碼。此應用程式還可以修改為從視頻源讀取並顯示結果。
要讀取高級QR碼,IronQR 提供以下設置。
using IronQr;
using IronSoftware.Drawing;
using IronQr.Enum;
using System.Collections.Generic;
var inputBmp = AnyBitmap.FromFile("QrImage.png");
// Use Auto => Machine Learning Scan
// Careful Scan => Useful for scanning documents slowly and carefully
QrImageInput scan_ML_and_normal = new QrImageInput(inputBmp, QrScanMode.OnlyDetectionModel);
IEnumerable<QrResult> results1 = new QrReader().Read(scan_ML_and_normal);
// Use Machine Learning Scan
// High Speed => For scanning frames from a camera
QrImageInput scan_ML_only = new QrImageInput(inputBmp, QrScanMode.OnlyDetectionModel);
IEnumerable<QrResult> results2 = new QrReader().Read(scan_ML_only);
// Use Scan without Machine Learning
QrImageInput scan_normal_only = new QrImageInput(inputBmp, QrScanMode.OnlyBasicScan);
IEnumerable<QrResult> results3 = new QrReader().Read(scan_normal_only);
using IronQr;
using IronSoftware.Drawing;
using IronQr.Enum;
using System.Collections.Generic;
var inputBmp = AnyBitmap.FromFile("QrImage.png");
// Use Auto => Machine Learning Scan
// Careful Scan => Useful for scanning documents slowly and carefully
QrImageInput scan_ML_and_normal = new QrImageInput(inputBmp, QrScanMode.OnlyDetectionModel);
IEnumerable<QrResult> results1 = new QrReader().Read(scan_ML_and_normal);
// Use Machine Learning Scan
// High Speed => For scanning frames from a camera
QrImageInput scan_ML_only = new QrImageInput(inputBmp, QrScanMode.OnlyDetectionModel);
IEnumerable<QrResult> results2 = new QrReader().Read(scan_ML_only);
// Use Scan without Machine Learning
QrImageInput scan_normal_only = new QrImageInput(inputBmp, QrScanMode.OnlyBasicScan);
IEnumerable<QrResult> results3 = new QrReader().Read(scan_normal_only);
Imports IronQr
Imports IronSoftware.Drawing
Imports IronQr.Enum
Imports System.Collections.Generic
Private inputBmp = AnyBitmap.FromFile("QrImage.png")
' Use Auto => Machine Learning Scan
' Careful Scan => Useful for scanning documents slowly and carefully
Private scan_ML_and_normal As New QrImageInput(inputBmp, QrScanMode.OnlyDetectionModel)
Private results1 As IEnumerable(Of QrResult) = (New QrReader()).Read(scan_ML_and_normal)
' Use Machine Learning Scan
' High Speed => For scanning frames from a camera
Private scan_ML_only As New QrImageInput(inputBmp, QrScanMode.OnlyDetectionModel)
Private results2 As IEnumerable(Of QrResult) = (New QrReader()).Read(scan_ML_only)
' Use Scan without Machine Learning
Private scan_normal_only As New QrImageInput(inputBmp, QrScanMode.OnlyBasicScan)
Private results3 As IEnumerable(Of QrResult) = (New QrReader()).Read(scan_normal_only)
利用最新的機器學習技術,我們將QR碼讀取器提升到新的高度。這個先進的機器學習模型提高了應用程式在解碼QR碼時的準確性和效率,即使在複雜的條件下也是如此。無論是從靜態影像、視頻流還是即時攝像頭饋送中讀取QR碼,這款機器學習驅動的解決方案都能快速可靠地提供所需信息。這項創新簡化了數據檢索,並通過識別真實的QR碼和標記潛在威脅來增強安全性。使用我們的機器學習技術,您可以自信地相信您的QR碼掃描能力處於最前端,為用戶提供流暢且安全的體驗。
開發者可以從這裡獲取試用版的IronQR授權 這裡. 必須將 Key 放置在 appSettings.json 中。
{
"IronQR.License.LicenseKey": "My key"
}
在本文中,我們探討了如何在 ASP.NET Core 中掃描 QR 碼 IronQR集成 IronQR 將 QR 碼掃描整合到 ASP.NET 應用程式中是一個簡單的過程,可以增強網頁應用程式的功能,讓它們更具互動性和使用者友好性。 IronQR強大的功能和易用性使其成為尋找實現條碼相關功能的開發人員的絕佳選擇。