خروجی PDF از Html با پشتیبانی از زبان فارسی

پنجشنبه 22 مرداد 1394

در این مقاله با نحوه کار با کتابخانه NReco PDF Generator یکی از کتابخانه های خوب برای ایجاد خروجی پی دی اف (PDF) از HTML با قابلیت پشتیبانی از فرمت بندی Unicode به منظور استفاده آن در محتوای فارسی آشنا می شویم.

خروجی PDF از Html با پشتیبانی از زبان فارسی

برای تبدیل Html به PDF در Asp.Net نیاز به دو اسکریپت برای تبدیل داریم ، فایل اول Jquery ، و فایل بعدی یک اسکریپت جاوااسکریپت به نام ExportToPDF.js است.
همچنین نیاز به یک Handler برای مدیریت و ایجاد فایل PDF داریم.
و در آخر یک کتابخانه (Dll) به نام NReco.PdfGenerator.dll که در پروژه ضمیمه برای شما همراهان قرار داده شده است.

پروژه ای ایجاد کرده و در آن اقدام به ایجاد یک Webform می کنیم.
در قسمت Head که در بالای سند ما قرار دارد دو ارجاع به کتابخانه های جاوا اسکریپت ایجاد میکنیم.
 

<script src="scripts/jquery-2.1.3.min.js"></script>

<script src="scripts/ExportToPDF.js"></script>

 

کد کامل صفحه را مشاهده می کنید که در زیر ارجاع هایی که به فرم داده ایم ، کد جاوااسکریپتی برای ایجاد Event در زمانی که بر روی کلید ایجاد پی دی اف کلیک می کنیم قرار داده ایم که باعث ایجاد پی دی اف صفحه می شود.

 

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="Default.aspx.cs" Inherits="ExportHTMLToPDF.Default" %>

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <script src="scripts/jquery-2.1.3.min.js"></script>
    <script src="scripts/ExportToPDF.js"></script>

    <script type="text/javascript">
        $(document).on('click', '#btnPrint', function () {
            ExportToPDF($('#divtoPrint'), [], 'عنوان خروجی صفحه', PDFPageType.Portrait);
        });
    </script>
</head>
<body>
    <form id="form1" runat="server">
        <div id="divtoPrint">
            <style>
                * {
                    font-family: W_yekan;
                }

                td {
                    text-align: center;
                }

                h2, h4 {
                    text-align: center;
                }
            </style>
            <h2>برنامه نویسان</h2>
            <h4>Barnamenevisan</h4>
            <hr />
            <h4 style="color: #0094ff">لیست کاربران
            </h4>
            <table id="TableinDivToPrint" border="1" style="width: 100%">
                <tr>
                    <th>ردیف</th>
                    <th>نام</th>
                    <th>نام خانوادگی</th>
                    <th>مهارت</th>
                    <th>سن</th>
                </tr>
                <tr>
                    <td>1</td>
                    <td>ایمان</td>
                    <td>مدائنی</td>
                    <td>MVC , C#</td>
                    <td>27</td>
                </tr>
                <tr>
                    <td>2</td>
                    <td>سجاد</td>
                    <td>باقرزاده</td>
                    <td>MVC , C#</td>
                    <td>26</td>
                </tr>
                <tr>
                    <td>3</td>
                    <td>مسعود</td>
                    <td>شریفی</td>
                    <td>MVC , C#</td>
                    <td>25</td>
                </tr>

                <tr>
                    <td>4</td>
                    <td>بردیا</td>
                    <td>اجاقی</td>
                    <td>MVC , C#</td>
                    <td>24</td>
                </tr>

                <tr>
                    <td>5</td>
                    <td>علی</td>
                    <td>تمیمی</td>
                    <td>MVC , C#</td>
                    <td>23</td>
                </tr>

                <tr>
                    <td>6</td>
                    <td>پارسا</td>
                    <td>کرمی</td>
                    <td>MVC , C#</td>
                    <td>22</td>
                </tr>
            </table>
            <br />
        </div>
        <input type="button" id="btnPrint" value="تبدیل به PDF" style="padding: 5px; direction: rtl;" />
    </form>
</body>
</html>

 

تصویر زیر خروجی صفحه ایجاد شده را نشان می دهد.

در مرحله بعد یک Handler به نام ExportHandler قرار می دهیم.در کد های زیر مشاهده می کنید:
 

<%@ WebHandler Language="C#" Class="ExportHandler" %>

using System;
using System.Web;
using System.IO;
using System.Web.UI;
using System.Text;
using NReco.PdfGenerator;//added this reference to DLL which is copied and pasted in bin folder. 

public class ExportHandler : IHttpHandler
{
    public void ProcessRequest(HttpContext context)
    {
        string InpuData = context.Request.Form["data"];       //Div Content will be fetched from form data.
        //If You find this error in above line 
        //Error: A potentially dangerous Request.Form value was detected from the client (data="<html><head><title><...").
        //then add this in your Web.config file.
        // <httpRuntime requestValidationMode="2.0" /> inside   <system.web>  </system.web>
        
        string PageType = context.Request.Form["PageType"];  //here we will recieve Page Type sent from front end.
        if (string.IsNullOrEmpty(InpuData))
            InpuData = "Some Error occured.Content not found.Please try again.";
        
        string appPath = HttpContext.Current.Request.PhysicalApplicationPath; 
     
        var htmlContent = InpuData.Replace("AppPath", appPath);
        var pdfDoc = new NReco.PdfGenerator.HtmlToPdfConverter(); //created an object of HtmlToPdfConverter class.

        if (string.IsNullOrEmpty(PageType))
        pdfDoc.Orientation = PageOrientation.Default;  //setting orientation.
        else
        {
            if(PageType=="Landscape")
                pdfDoc.Orientation = PageOrientation.Landscape;
            else
                pdfDoc.Orientation = PageOrientation.Portrait;  
        }
        
        pdfDoc.Size = PageSize.A4;   //8.27 in × 11.02 in //Page Size
        PageMargins pageMargins = new PageMargins();     //Margins in mm
        pageMargins.Bottom = 05;
        pageMargins.Left = 05;
        pageMargins.Right = 05;
        pageMargins.Top = 05;
        pdfDoc.Margins = pageMargins;                      //margins added to PDF.

        pdfDoc.PageHeaderHtml = "Barnamenevisan - PDF generated by CodingKeeda.";
        //Why I am adding this to page footer?? So we can get paging in footer section of each PDF page.how its working?? A Javascript code is written inside the DLL which is handling  Div's class i.e. page and topage.
        pdfDoc.PageFooterHtml = "<div style='float:right;'>  Page <span class='page'></span> of  <span class='topage'></span></div>";
        var pdfBytes=pdfDoc.GeneratePdf(htmlContent);
        context.Response.ContentType = "application/pdf";
        context.Response.AddHeader("content-disposition", "attachment;filename=ExportedFile.pdf");//Use inline in place of attachment If You wish to open PDF on Browser.
        context.Response.Cache.SetCacheability(HttpCacheability.NoCache);
        HttpContext.Current.Response.BinaryWrite(pdfBytes);
        HttpContext.Current.Response.End();
    }

    public bool IsReusable
    {
        get
        {
            return false;
        }
    }
}

کد زیر را نیز به منظور استفاده از کتابخانه ExportToPDF برای ایجاد پی دی اف استفاده می کنیم.
 

    <script type="text/javascript">
        $(document).on('click', '#btnPrint', function () {
            ExportToPDF($('#divtoPrint'), [], 'عنوان خروجی صفحه', PDFPageType.Portrait);
        });
    </script>

 

دقت داشته باشید این تابع 4 پارامتر دارد:

1- پارامتر اول متد  ExportToPDF اشاره به بخشی دارد که قرار است خروجی ما در فایل پی دی اف باشد. 
در این مثال ما با استفاده از Jquery یک Div با شناسه (id) برابر divtoPrint را به تابع پاس می دهیم.

2- پارامتر دوم متد  ExportToPDF اشاره به تعداد ستون هایی که در Table هایی که در در Div ما وجود دارد میکند که با شروع از صفر تعداد ستون هایی که می خواهیم مخفی کنیم را نمایش می دهد.اگر هم خالی باشد یعنی هیچ کدام از ستون ها مخفی نباشند.برای مثال اگر بنویسیم [0,1] ستون های اول و دوم جدول مخفی  می شوند.

3- پارامتر سوم متد  ExportToPDF اشاره عنوانی دارد که در بالای صفحه خروجی ایجاد می شود.

4- پارامتر چهارم متد  ExportToPDF اشاره به حالت صفحه یعنی عمودی یا افقی بودن آن دارد.

 

بعد از اضافه کردن موارد فوق و اضافه کردن WebHandler حالا اقدام به اجرای پروژه می کنیم.
با کلیک بر روی گزینه تبدیل به PDF فایل پی دی اف دانلود می شود.
 

در قسمت زیر نیز ضمیمه مقاله قرار داده شده است امیدوارم استفاده لازم را از آن ببرید.

فایل های ضمیمه

برنامه نویسان

نویسنده 3355 مقاله در برنامه نویسان

کاربرانی که از نویسنده این مقاله تشکر کرده اند

در صورتی که در رابطه با این مقاله سوالی دارید، در تاپیک های انجمن مطرح کنید