diff --git a/Document-Processing-toc.html b/Document-Processing-toc.html index 2cce492d82..efde45491d 100644 --- a/Document-Processing-toc.html +++ b/Document-Processing-toc.html @@ -192,12 +192,21 @@
  • ASP.NET MVC
  • -
  • - Console +
  • + Blazor
  • WPF
  • +
  • + Windows Forms +
  • +
  • + .NET MAUI +
  • +
  • + Console +
  • diff --git a/Document-Processing/Data-Extraction/NET/Extract-Data-in-ASP-NET-MVC.md b/Document-Processing/Data-Extraction/NET/Extract-Data-in-ASP-NET-MVC.md index 2efa33ead7..bdc267e22d 100644 --- a/Document-Processing/Data-Extraction/NET/Extract-Data-in-ASP-NET-MVC.md +++ b/Document-Processing/Data-Extraction/NET/Extract-Data-in-ASP-NET-MVC.md @@ -10,7 +10,7 @@ keywords: Assemblies # Extracting Data in ASP.NET MVC -The Syncfusion® Smart Data Extractor is a .NET library used to extract structured data and document elements from PDFs and images in ASP.NET Core applications. +The Syncfusion® Smart Data Extractor is a .NET library used to extract structured data and document elements from PDFs and images in ASP.NET MVC applications. ## Steps to Extract data from PDF document in ASP.NET MVC diff --git a/Document-Processing/Data-Extraction/NET/Extract-Data-in-Blazor.md b/Document-Processing/Data-Extraction/NET/Extract-Data-in-Blazor.md new file mode 100644 index 0000000000..2b69c96f5f --- /dev/null +++ b/Document-Processing/Data-Extraction/NET/Extract-Data-in-Blazor.md @@ -0,0 +1,491 @@ +--- +title: Extract Data in Blazor Application | Syncfusion +description: Learn to extract tables, forms, text, and images from PDF documents and scanned images in Blazor using the Syncfusion® Smart Data Extractor .NET library. +platform: document-processing +control: SmartDataExtractor +documentation: UG +keywords: Assemblies + +--- + +# Extract Data from PDF in Blazor Application + +The Syncfusion® Smart Data Extractor is a .NET library used to extract structured data and document elements from PDFs and images in Blazor applications. + +## Steps to Extract Data from PDF in Blazor application + +{% tabcontents %} + +{% tabcontent Visual Studio %} + +**Prerequisites**: + +* Install .NET SDK: Ensure that you have the .NET SDK installed on your system. You can download it from the [.NET Downloads page](https://dotnet.microsoft.com/en-us/download). +* Install Visual Studio: Download and install Visual Studio Code from the [official website](https://code.visualstudio.com/download). + + +Step 1: Create a new C# Blazor Web app project. +* Select "Blazor Web App" from the template and click **Next**. + +![Create Blazor Web App application in Visual Studio](GettingStarted_images/Blazor_ProjectCreation.png) + +* Name the project and click **Next**. + +![Name the Blazor Web App in Visual Studio](GettingStarted_images/Blazor_Project_Name.png) + +* Select the framework and click **Create** button. + +![Select the framework in Blazor Web App Server in Visual Studio](GettingStarted_images/Blazor_Additional_Info.png) + +Step 2: Install the `Syncfusion.SmartDataExtractor.Net.Core` NuGet package. + +To **Extract Data from PDF in a Blazor Web App Server**, install [Syncfusion.SmartDataExtractor.Net.Core](https://www.nuget.org/packages/Syncfusion.SmartDataExtractor.Net.Core) into the Blazor project. + +![Install Syncfusion.SmartDataExtractor.Net.Core NuGet Package](GettingStarted_images/Blazor_Nuget.png) + +Step 3: Create a Razor file named `Home.razor` in the `Pages` folder, which is located inside the `Components` folder. + +Include the following namespaces in the file: + +{% tabs %} +{% highlight c# tabtitle="C#" %} + +@page "/" +@rendermode InteractiveServer +@using Extract_Data_Blazor.Services +@inject ExtractionService extractor +@inject IJSRuntime JS + +{% endhighlight %} +{% endtabs %} + +Step 4: Add a button to `Home.razor`. + +Include the following code snippet to add a button in your Blazor application that triggers the “Extract Data as JSON” conversion: + +{% tabs %} +{% highlight CSHTML %} +

    Run Extraction

    + + + +

    @message

    + + +{% endhighlight %} +{% endtabs %} + +Step 5: Implement the method in `Home.razor`. + +Add the following code snippet to extract data from a PDF and download the file in your Blazor application. + +{% tabs %} +{% highlight c# tabtitle="C#" %} +@code { + string message = "Waiting..."; + + async Task RunExtraction() + { + message = "Processing..."; + StateHasChanged(); // force UI update immediately + + message = await extractor.RunExtraction(); + } +} +{% endhighlight %} +{% endtabs %} + +Step 6: Create a new cs file `ExtractionService.cs` in the `Services` folder. + +Include the following namespaces in the file: + +{% tabs %} + +{% highlight c# tabtitle="C#" %} +using Syncfusion.Pdf.Parsing; +using Syncfusion.SmartDataExtractor; +{% endhighlight %} + +{% endtabs %} + +Step 7: Implement the method in `ExtractionService.cs`. + +Create a new method in the ExtractionService class, and add the following code snippet to extract data as JSON from a PDF in a Blazor Web App Server. + +{% tabs %} + +{% highlight c# tabtitle="C#" %} + +using (FileStream stream = new FileStream(@"wwwroot/Input.pdf", FileMode.Open, FileAccess.Read, FileShare.ReadWrite)) +{ + // Initialize the Smart Data Extractor + DataExtractor extractor = new DataExtractor(); + + // Extract data as JSON string + string data = extractor.ExtractDataAsJson(stream); + + // Return the JSON string + return data; +} + +{% endhighlight %} + +{% endtabs %} + +Step 8: Add the service in Program.cs. + +Include the following namespaces in the Program.cs file: + +{% tabs %} +{% highlight c# tabtitle="C#" %} + +using Extract_Data_Blazor.Components; +using Extract_Data_Blazor.Services; + +{% endhighlight %} +{% endtabs %} + +Add the following line to the `Program.cs` file to register `ExtractionService` as a scoped service in the Blazor application. + +{% tabs %} +{% highlight c# tabtitle="C#" %} + +builder.Services.AddScoped(); + +{% endhighlight %} +{% endtabs %} + +Step 9: Create `FileUtils.cs` for JavaScript interoperability. + +Create a new class file named `FileUtils` in the project and add the following code to invoke the JavaScript action for file download in the browser. + +{% tabs %} + +{% highlight c# tabtitle="C#" %} + +public static class FileUtils +{ + public static ValueTask SaveAs(this IJSRuntime js, string filename, byte[] data) + => js.InvokeAsync( + "saveAsFile", + filename, + Convert.ToBase64String(data)); +} + +{% endhighlight %} + +{% endtabs %} + +Step 10: Add JavaScript function to `App.razor`. + +Add the following JavaScript function in the `App.razor` file located in the `Pages` folder. + +{% tabs %} + +{% highlight HTML %} + + + +{% endhighlight %} + +{% endtabs %} + +Step 11: Add navigation link. + +Add the following code snippet to the Navigation menu's Razor file in the `Layout` folder. + +{% tabs %} + +{% highlight HTML %} + + + +{% endhighlight %} + +{% endtabs %} + +Step 12: Build the project. + +Click on **Build** → **Build Solution** or press Ctrl+Shift+B to build the project. + +Step 13: Run the project. + +Click the Start button (green arrow) or press F5 to run the application. + +Upon executing the program, the output will be generated as follows. + +![Data Extraction in Blazor Web App Server](GettingStarted_images/JSON_Output.png) + +{% endtabcontent %} + +{% tabcontent Visual Studio Code %} + +**Prerequisites:** + +* Visual Studio Code. +* Install [.NET 8 SDK](https://dotnet.microsoft.com/en-us/download/dotnet/8.0) or later. +* Open Visual Studio Code and install the [C# for Visual Studio Code extension](https://marketplace.visualstudio.com/items?itemName=ms-dotnettools.csharp) from the Extensions Marketplace. + + +Step 1: Create a new C# Blazor Web app project. +* Open the command palette by pressing Ctrl+Shift+P and type **.NET:New Project** and enter. +* Choose the **Blazor Web App** template. + +![Choose Blazor Web App Server from template](GettingStarted_images/Blazor-Web-app-template.png) + +* Select the project location, type the project name and press enter. +* Then choose **Create project**. + +Step 2: To **Extract Data from PDF in Web app**, install [Syncfusion.SmartDataExtractor.Net.Core](https://www.nuget.org/packages/Syncfusion.SmartDataExtractor.Net.Core) to the Blazor project. +* Press Ctrl + ` (backtick) to open the integrated terminal in Visual Studio Code. +* Ensure you're in the project root directory where your .csproj file is located. +* Run the command `dotnet add package Syncfusion.SmartDataExtractor.Net.Core` to install the NuGet package. + +``` +dotnet add package Syncfusion.SmartDataExtractor.NET.Core + +``` + +Step 3: Create a Razor file named `Home.razor` in the `Pages` folder, which is located inside the `Components` folder. + +Include the following namespaces in the file: + +{% tabs %} +{% highlight c# tabtitle="C#" %} + +@page "/" +@rendermode InteractiveServer +@using Extract_Data_Blazor.Services +@inject ExtractionService extractor +@inject IJSRuntime JS + +{% endhighlight %} +{% endtabs %} + +Step 4: Add a button to `Home.razor`. + +Include the following code snippet to add a button in your Blazor application that triggers the “Extract Data as JSON” conversion: + +{% tabs %} +{% highlight CSHTML %} +

    Run Extraction

    + + + +

    @message

    + + +{% endhighlight %} +{% endtabs %} + +Step 5: Implement the method in `Home.razor`. + +Add the following code snippet to extract data from a PDF and download the file in your Blazor application. + +{% tabs %} +{% highlight c# tabtitle="C#" %} +@code { + string message = "Waiting..."; + async Task RunExtraction() + { + message = "Processing... "; + StateHasChanged(); // force UI update immediately + // Run extractor to get JSON string + var json = await extractor.RunExtraction(); + // Convert JSON to UTF8 bytes and trigger browser download via JS interop + var bytes = System.Text.Encoding.UTF8.GetBytes(json ?? string.Empty); + await JS.SaveAs("extracted.json", bytes); + message = "Download started"; + } +} +{% endhighlight %} +{% endtabs %} + +Step 6: Create a new cs file `ExtractionService.cs` in the `Services` folder. + +Include the following namespaces in the file: + +{% tabs %} + +{% highlight c# tabtitle="C#" %} + +using Syncfusion.Pdf.Parsing; +using Syncfusion.SmartDataExtractor; + +{% endhighlight %} + +{% endtabs %} + +Step 7: Implement the method in `ExtractionService.cs`. + +Create a new method in the ExtractionService class, and add the following code snippet to extract data as JSON from a PDF in a Blazor Web App Server. + +{% tabs %} + +{% highlight c# tabtitle="C#" %} + +using (FileStream stream = new FileStream(@"wwwroot/Input.pdf", FileMode.Open, FileAccess.Read, FileShare.ReadWrite)) +{ + // Initialize the Smart Data Extractor + DataExtractor extractor = new DataExtractor(); + + // Extract data as JSON string + string data = extractor.ExtractDataAsJson(stream); + + // Return the JSON string + return data; +} + +{% endhighlight %} + +{% endtabs %} + +Step 8: Add the service in Program.cs. + +Include the following namespaces in the Program.cs file: + +{% tabs %} +{% highlight c# tabtitle="C#" %} + +using Extract_Data_Blazor.Components; +using Extract_Data_Blazor.Services; + +{% endhighlight %} +{% endtabs %} + +Add the following line to the `Program.cs` file to register `ExtractionService` as a scoped service in the Blazor application. + +{% tabs %} +{% highlight c# tabtitle="C#" %} + +builder.Services.AddScoped(); + +{% endhighlight %} +{% endtabs %} + +Step 9: Create `FileUtils.cs` for JavaScript interoperability. + +Create a new class file named `FileUtils` in the project and add the following code to invoke the JavaScript action for file download in the browser. + +{% tabs %} + +{% highlight c# tabtitle="C#" %} + +public static class FileUtils +{ + public static ValueTask SaveAs(this IJSRuntime js, string filename, byte[] data) + => js.InvokeAsync( + "saveAsFile", + filename, + Convert.ToBase64String(data)); +} + +{% endhighlight %} + +{% endtabs %} + +Step 10: Add JavaScript function to `App.razor`. + +Add the following JavaScript function in the `App.razor` file located in the `Pages` folder. + +{% tabs %} + +{% highlight HTML %} + + + +{% endhighlight %} + +{% endtabs %} + +Step 11: Add navigation link. + +Add the following code snippet to the Navigation menu's Razor file in the `Layout` folder. + +{% tabs %} + +{% highlight HTML %} + + + +{% endhighlight %} + +{% endtabs %} + + +Step 12: Build the project. + +Run the following command in terminal to build the project. + +``` +dotnet build +``` + +Step 13: Run the project. + +Run the following command in terminal to run the project. + +``` +dotnet run +``` + +Upon executing the program, the **JSON document** will be generated as follows. + +![Data Extraction in Blazor Web App Server](GettingStarted_images/JSON_Output.png) + +{% endtabcontent %} + diff --git a/Document-Processing/Data-Extraction/NET/Extract-Data-in-Console.md b/Document-Processing/Data-Extraction/NET/Extract-Data-in-Console.md index 748d0ec1fe..31bfabd3f2 100644 --- a/Document-Processing/Data-Extraction/NET/Extract-Data-in-Console.md +++ b/Document-Processing/Data-Extraction/NET/Extract-Data-in-Console.md @@ -8,7 +8,7 @@ documentation: UG # Extract Data from PDF in Console Application -The Syncfusion® Smart Data Extractor is a .NET library used to extract structured data and document elements from PDFs and images in ASP.NET Core applications. +The Syncfusion® Smart Data Extractor is a .NET library used to extract structured data and document elements from PDFs and images in Console applications. ## Steps to Extract Data from PDF in Console App diff --git a/Document-Processing/Data-Extraction/NET/Extract-Data-in-MAUI.md b/Document-Processing/Data-Extraction/NET/Extract-Data-in-MAUI.md new file mode 100644 index 0000000000..ebf035bac7 --- /dev/null +++ b/Document-Processing/Data-Extraction/NET/Extract-Data-in-MAUI.md @@ -0,0 +1,233 @@ +--- +title: Extract Data in .NET MAUI | Syncfusion +description: Extract tables, forms, text, and images from PDF documents and scanned files in .NET MAUI using the Syncfusion® Smart Data Extractor. +platform: document-processing +control: SmartDataExtractor +documentation: UG +keywords: Assemblies + +--- + +# Extract Data from PDF in MAUI Application + +The Syncfusion® Smart Data Extractor is a .NET library used to extract structured data and document elements from PDFs and images in NET MAUI applications. + +## Steps to Extract Data from PDF in .NET MAUI + +{% tabcontents %} + +{% tabcontent Visual Studio %} + +**Prerequisites:** + +* Visual Studio 2022. +* Install [.NET 8 SDK](https://dotnet.microsoft.com/en-us/download/dotnet/8.0) or later. +* For more details about installation, refer [here](https://learn.microsoft.com/en-us/dotnet/maui/get-started/installation?view=net-maui-7.0&tabs=vswin). + +Step 1: Create a new C# .NET MAUI app. Select **.NET MAUI App** from the template and click the **Next** button. + +![Create the MAUI app in Visual Studio](GettingStarted_images/MAUI_Project_Creation.png) + +Step 2: Enter the project name and click **Create**. + +![Create a project name for your new project](GettingStarted_images/MAUI_Project_Name.png) + +Step 3: Install the [Syncfusion.SmartDataExtractor.NET](https://www.nuget.org/packages/Syncfusion.SmartDataExtractor.NET) NuGet package as a reference to your project from [NuGet.org](https://www.nuget.org/). + +![Install Syncfusion.SmartDataExtractor.NET NuGet package](GettingStarted_images/MAUI_Nuget.png) + +N> If you reference Syncfusion® assemblies from trial setup or from the NuGet feed, you also have to add "Syncfusion.Licensing" assembly reference and include a license key in your projects. Please refer to this [link](https://help.syncfusion.com/common/essential-studio/licensing/overview) to know about registering a Syncfusion® license key in your application to use our components. + +Step 3: Add a new button to the **MainPage.xaml** as shown below. + +{% tabs %} + +{% highlight c# tabtitle="C#" %} + + + + + + +