DEV Community

Cover image for Converting HTML to PDF on Linux Azure App Service
Chelsea Devereaux for MESCIUS inc.

Posted on • Updated on • Originally published at grapecity.com

Converting HTML to PDF on Linux Azure App Service

Organizations perform HTML to PDF conversions for many reasons, such as archiving web content, simplifying web content review processes, or creating a printer-friendly web page version.

GrapeCity Documents for PDF API features the GcHtml package. GcHtml lets users convert an HTML string or an HTML web page to PDF.

The RenderToPdf method of the GcHtmlRenderer class performs the conversion. Different overloads of this method let users save the HTML to a PDF file or a stream. Alter the generated PDF file settings (page height, width, header, footer, etc.) with the PdfSettings class.

Outlined below is the process of converting a web page to a PDF file on a Linux Azure app service using the GcHtmlRenderer class.

Step 1: Create a Web Application that Converts HTML to PDF

  • Create a new ASP. NET Core Web application using the Model-View-Controller template in VS2019 on a Windows machine.

Converting HTML to PDF on Linux Azure App Service

  • Install the following packages in the project using NuGet Package Manager

    • Grapecity.Documents.Html
    • Grapecity.Documents.Html.Windows.X64
    • Grapecity.Documents.Html.Linux.X64

(Note: The application deployment target is Linux, hence 'Grapecity.Documents.Html.Windows .X64' package is only needed for local debugging on Windows)

  • Use GcHtmlRenderer and RenderToPdf method

    • Add a method to HomeController.cs which implements the β€œRender HTML to PDF” feature

Here is a sample code snippet:

[HttpPost] 
public IActionResult CreatePdfFromHtml(string txtLink, string txtFile) 
{ 
    var stream = new MemoryStream(); 
    var path = Path.GetFullPath(txtFile); 

    //Converting Web Page to PDF 
    using (var _pdf = new GcHtmlRenderer(new Uri(txtLink))) 
          _pdf.RenderToPdf(path); 

    //Load the PDF file in the browser window using 
    (var ts = System.IO.File.OpenRead(path)) 
    { 
        ts.CopyTo(stream); 
    } 
    stream.Position = 0; 
    return File(stream, 'application/pdf'); 
} 
Enter fullscreen mode Exit fullscreen mode
  • Add the following code to the Index View of the HomeController (this provides the UI that performs the conversion).

    #ConvertPDF { display: flex; flex-direction: column; align- items: center; justify- content: center; margin: 0 auto; background-color: lightgray; width: 800px; height: 250px; } input[type=text] { width: 400px; margin- left: 5px; }




    @using (@Html.BeginForm('CreatePdfFromHtml', 'Home', FormMethod.Post))
    {

    <div id="ConvertPDF">
        <div>
              <label>Web Page Link</label> 
              <input id="txtLink" name="txtLink" type="text"  />
        </div>
        <br />
        <div>
            <label>PDF File Name</label> 
            <input id="txtFile" name="txtFile" type="text"  />
        </div>
        <br />
        <input id="ConvertHTMLtoPDF" type="submit" value="Generate PDF from HTML"  />
    </div>
    

    }

Build and Execute the Application

  • Enter the web page link and PDF file name. Click the button and convert the web page to a PDF file.
  • Generate the PDF

Converting HTML to PDF on Linux Azure App Service

Step 2: Publish the Application to Linux Azure App Service

Install Chrome Dependencies

Because GcHtml uses headless Chromium to render HTML, additional shared libraries required by Chromium need to be installed on the Linux system.

Install these shared libraries by adding two shell script files to the web application. These are run when the Linux Azure App Service starts. Create these shell script files using NotePad++. It supports saving the file in Unix script file format(.sh) and helps make sure the files meet the following criteria:

  • The line feed used in the shell script file must be LF. You can use the Edit EOL conversion Unix(LF) option of NotePad++ to choose the file's appropriate line character.

  • The file is saved using UTF-8 with no BOM encoding. This action is the default encoding used by NotePad++ when saving a Unix script file.

  • Keeping the above points into consideration, let's create the required shell script files:

    • Create a file named "install-deps. sh" and add the following commands to it

      apt-get update 
      apt-get install libxss1 libappindicator1 libindicator7 libnss3-dev -y 
      
    • Save the file in the project folder using the Unix script file format

    • Create another file named "startup. sh" and add the following commands to it

       sh ./wwwroot/install-deps.sh & 
       dotnet AzureService_HTML_Pdf.dll"
      
    • Save the file in the project folder using Unix script file format

Publish the Application

Right-click the project name in the Solution Explorer Window

  • Choose "Publish"

    • "Publish" dialog appears
  • Click the start button

    • "Pick a publish target" dialog appears
  • Choose "App Service Linux" in the left panel and the "Create New" radio button in the right panel

    • Click "Create Profile"

Converting HTML to PDF on Linux Azure App Service

  • The "Create New App Service" dialog appears
    • Click the "Create" button

The App Service is created.

Converting HTML to PDF on Linux Azure App Service

  • Click the Publish button in the "Publish" dialog. Make sure the application published without issue

  • Publish "startup. sh" and "install-deps. sh"

    • Right-click on the file in Solution Explorer and choose the Publish option
  • Open the Azure portal and set the Startup Command to "./startup.sh" in the created app service

    • Choose Settings Configuration > General Settings

Converting HTML to PDF on Linux Azure App Service

  • Restart the app service in the Azure portal
  • Open the published website link in the browser window and load the application home page
  • Enter the web page link and the PDF file name
  • Click "Generate PDF"

Converting HTML to PDF on Linux Azure App Service

Convert any web page to a PDF file with GrapeCity Documents for PDF API. Visit our website for more info.

Top comments (0)