/Razor-Document-Library

A Razor Class Library built using the Dynamsoft Document Normalizer SDK.

Primary LanguageHTMLMIT LicenseMIT

Razor Document Library

A Razor Class Library built using the Dynamsoft Document Normalizer SDK, which provides APIs for document edge detection and document rectification.

Demo Video

razor-document-library-blazor-document-scan.mp4

Online Demo

https://yushulx.me/Razor-Document-Library/

Prerequisites

Quick Usage

  • Import and initialize the Razor Document Library.

    @using RazorDocumentLibrary

@code {
    private DocumentJsInterop? documentJsInterop;
    
    protected override async Task OnInitializedAsync()
    {
        documentJsInterop = new DocumentJsInterop(JSRuntime);
        await documentJsInterop.LoadJS();
    }
}

  • Set the license key and load the wasm module.

    await documentJsInterop.SetLicense(licenseKey);
await documentJsInterop.LoadWasm();

  • Createa a document normalizer instance.

    DocumentNormalizer normalizer = await documentJsInterop.CreateDocumentNormalizer();

  • Detect document edges.

    Quadrilateral? result = await normalizer.DetectCanvas(canvas);

  • Rectify the document based on the detected edges.

    IJSObjectReference rectifiedDocument = await normalizer.RectifyCanvas(canvas, result.location);

API

Quadrilateral Class

Represents the coordinates of the four corners of a quadrilateral.

DocumentNormalizer Class

  • Task<Quadrilateral?> DetectCanvas(IJSObjectReference canvas): Detects document edges from a canvas.
  • Task<IJSObjectReference> RectifyCanvas(IJSObjectReference canvas, string location): Rectifies a document based on the detected edges.
  • Task SetFilter(string filter): Sets the filter for document edge detection.
  • Task ShowDocumentEditor(string elementId, IJSObjectReference imageCanvas, string location): Shows the document edge editor.
  • RegisterCallback(ICallback callback): Registers a callback function for receiving the coordinates of the four corners of a document.
  • Task ShowRectifiedDocument(string elementId, IJSObjectReference rectifiedDocument): Displays the rectified document within a specified HTML element.

DocumentJsInterop Class

  • Task LoadJS(): Loads the Dynamsoft Document Normalizer JavaScript library.
  • Task SetLicense(string license): Sets the license key.
  • Task LoadWasm(): Loads the Dynamsoft Document Normalizer WebAssembly module.
  • Task<MrzRecognizer> CreateDocumentNormalizer(): Creates a Document Normalizer instance.

Example

Build

cd RazorDocumentLibrary
dotnet build --configuration Release