Display Binary PDF file in page using Generic Handler and C# in ASP.Net

Hi George616,

Refer below modified code.

HTML

Uploadinvoice 

<form id="form1" runat="server">
    <div class="form-horizontal">
        <h1 style="font-size: small; margin-top: 0%; color: red;">ID Card with QR Code</h1>
        <hr />
        <div class="mid-cont">
            <br />
            <div class="containr-fluid">
                <asp:FileUpload runat="server" ID="showPreviewBill" />
                <asp:Button ID="buttonmail" runat="server" CssClass="btn btn-primary navbar-btn" BackColor="SteelBlue"
                    Font-Size="9pt" Text="QR code" OnClick="buttonmail_Click" />
                <br />
                <br />
            </div>
            <div class="contentt">
                <canvas id="the-canvas" style="border: 1px solid grey; height: 850px; width: 700px;"></canvas>
            </div>
        </div>
        <asp:Label ID="lblMessage" runat="server" Text=""></asp:Label>
    </div>
</form>
<script src="https://code.jquery.com/jquery-3.3.1.slim.min.js" integrity="sha384-q8i/X+965DzO0rT7abK41JStQIAqVgRVzpbzo5smXKp4YfRvH+8abtTE1Pi6jizo" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.3/umd/popper.min.js" integrity="sha384-ZMP7rVo3mIykV+2+9J3UJ46jBk0WLaUAdn689aCwoqbBJiSnjAK/l8WvCWPIPm49" crossorigin="anonymous"></script>
<link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/css/bootstrap.min.css" />
<script src="https://stackpath.bootstrapcdn.com/bootstrap/4.1.3/js/bootstrap.min.js" integrity="sha384-ChfqqxuZUCnJSK3+MXmPNIyE6ZbWh2IMqE241rYiqJxyMiZ6OW/JmZQ5stwEULTy" crossorigin="anonymous"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/malihu-custom-scrollbar-plugin/3.1.5/jquery.mCustomScrollbar.concat.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/pdf.js/2.0.943/pdf.min.js"></script>
<script type="text/javascript">
    $(function () {
        $("#showPreviewBill").change(function () {
            if (this.files && this.files[0]) {
                var reader = new FileReader();
                reader.onload = function (e) {
                    showInCanvas(e.target.result);
                }
                reader.readAsDataURL(this.files[0]);
            }
        });

        function convertDataURIToBinary(dataURI) {
            var BASE64_MARKER = ';base64,';
            var base64Index = dataURI.indexOf(BASE64_MARKER) + BASE64_MARKER.length;
            var base64 = dataURI.substring(base64Index);
            var raw = window.atob(base64);
            var rawLength = raw.length;
            var array = new Uint8Array(new ArrayBuffer(rawLength));

            for (i = 0; i < rawLength; i++) {
                array[i] = raw.charCodeAt(i);
            }
            return array;
        }

        function showInCanvas(url) {
            'use strict';
            var pdfAsArray = convertDataURIToBinary(url);
            pdfjsLib.getDocument(pdfAsArray).then(function (pdf) {
                pdf.getPage(1).then(function (page) {
                    var scale = 1.5;
                    var viewport = page.getViewport(scale);
                    var canvas = document.getElementById('the-canvas');
                    var context = canvas.getContext('2d');
                    canvas.height = viewport.height;
                    canvas.width = viewport.width;
                    var renderContext = {
                        canvasContext: context,
                        viewport: viewport
                    };
                    page.render(renderContext);
                });
            });
        }
    });
</script>

Invoiceprint

<form id="form1" runat="server">
    <div class="form-horizontal">
        <h1 style="font-size: small; margin-top: 0%; color: red;">ID Card with QR Code</h1>
        <hr />
        <br />
        <div class="row">
            <asp:Panel ID="printpanel" runat="server">
                <div class="contentt">
                    <%--<canvas id="the-canvas" style="border: 1px solid black; height: 750px; width: 650px;"></canvas>--%>
                    <asp:Literal ID="ltEmbed" runat="server" />
                    <asp:Image ID="Image1" runat="server" BorderStyle="None" Width="80px" Height="85px" />
                </div>
            </asp:Panel>
            <br />
            &nbsp;&nbsp;
            <div class="print">
                <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
                <br />
                <br />
                <asp:Button ID="btnPrinnt" runat="server" CssClass="btn btn-primary navbar-btn" BackColor="SteelBlue" Font-Size="Small" Text="Send to Mail" />
                <br />
                <br />
                <asp:Button ID="buttonmail" runat="server" CssClass="btn btn-primary navbar-btn" BackColor="SteelBlue" Font-Size="Small" Text="Download Invoice" />
            </div>
        </div>
    </div>
</form>

Code

Uploadinvoice

protected void Page_Load(object sender, EventArgs e)
{
    if (!string.IsNullOrEmpty(Request.QueryString["invoicecard"]))
    {
        Session["invoicecard"] = Convert.ToInt32(Request.QueryString["invoicecard"]);
    }
}

protected void buttonmail_Click(object sender, EventArgs e)
{
    string filename = Path.GetFileName(showPreviewBill.PostedFile.FileName);
    string contentType = showPreviewBill.PostedFile.ContentType;
    using (Stream fs = showPreviewBill.PostedFile.InputStream)
    {
        using (BinaryReader br = new BinaryReader(fs))
        {
            byte[] bytes = br.ReadBytes((Int32)fs.Length);
            using (SqlConnection con = new SqlConnection("Data Source=(LocalDB)\\MSSQLLocalDB;AttachDbFilename=|DataDirectory|\\Dataregister.mdf;Integrated Security=True"))
            {
                string query = "INSERT INTO tableinvoice(email, Name, ContentType, Data, Uid, CreatedBy, Role, CreatedDate, Organization)" +
                                " VALUES(@email, @Name, @ContentType, @Data, @Uid, @CreatedBy, @Role, @CreatedDate, @Organization); SELECT @@IDENTITY";
                using (SqlCommand cmd = new SqlCommand(query))
                {
                    cmd.Connection = con;
                    cmd.Parameters.AddWithValue("@email", user.Text.Trim());
                    cmd.Parameters.AddWithValue("@Name", filename);
                    cmd.Parameters.AddWithValue("@ContentType", contentType);
                    cmd.Parameters.AddWithValue("@Data", bytes);
                    cmd.Parameters.AddWithValue("@Uid", labelid.Text.Trim());
                    cmd.Parameters.AddWithValue("@CreatedBy", createby.Text.Trim());
                    cmd.Parameters.AddWithValue("@Role", role.Text.Trim());
                    cmd.Parameters.AddWithValue("@CreatedDate", DateTime.Now);
                    cmd.Parameters.AddWithValue("@Organization", named.Text.Trim());
                    con.Open();
                    object Invoice = cmd.ExecuteScalar();
                    con.Close();

                    Session["paperinv"] = Invoice;
                    Response.Redirect("Invoiceprint.aspx");
                }
            }
        }
    }
}

Invoiceprint

protected void Page_Load(object sender, EventArgs e)
{
    if (!this.IsPostBack)
    {
        BindCardAndQR();
    }
}
private void BindCardAndQR()
{
    if (Session["paperinv"] != null)
    {
        int id = Convert.ToInt32(Session["paperinv"]);
        // Binding PDF file in Literal control
        string embed = "<object data=\"{0}{1}\" type=\"application/pdf\" width=\"650px\" height=\"750px\"></object>";
        ltEmbed.Text = string.Format(embed, ResolveUrl("~/Handler.ashx?Id="), id);

        //This is where I Bind Image1 control for the QR code generated
        byte[] QRBytes = GetQRCodeBytes(Server.MapPath("/Invoiceprint.aspx") + "?Id=" + id);
        Image1.ImageUrl = "data:image/jpg;base64," + Convert.ToBase64String(QRBytes);
    }
}
public byte[] GetQRCodeBytes(string url)
{
    //QR code generated here
    QRCodeEncoder encoder = new QRCodeEncoder();
    Bitmap bi = encoder.Encode(url);
    MemoryStream tmpSteam = new MemoryStream();
    bi.Save(tmpSteam, ImageFormat.Jpeg);
    return tmpSteam.ToArray();
}

Generic Handler

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

using System;
using System.Web;
using System.Data.SqlClient;

public class Handler : IHttpHandler
{

    public void ProcessRequest(HttpContext context)
    {
        int id = int.Parse(context.Request.QueryString["Id"]);
        byte[] bytes;
        string contentType;
        string constr = "Data Source=(LocalDB)\\MSSQLLocalDB;AttachDbFilename=|DataDirectory|\\Dataregister.mdf;Integrated Security=True";
        using (SqlConnection con = new SqlConnection(constr))
        {
            using (SqlCommand cmd = new SqlCommand())
            {
                cmd.CommandText = "SELECT Data,ContentType FROM tableinvoice WHERE Id=@Id";
                cmd.Parameters.AddWithValue("@Id", id);
                cmd.Connection = con;
                con.Open();
                using (SqlDataReader sdr = cmd.ExecuteReader())
                {
                    sdr.Read();
                    bytes = (byte[])sdr["Data"];
                    contentType = sdr["ContentType"].ToString();
                }
                con.Close();
            }
        }

        context.Response.Buffer = true;
        context.Response.Charset = "";
        context.Response.Cache.SetCacheability(HttpCacheability.NoCache);
        context.Response.ContentType = "application/pdf";
        context.Response.BinaryWrite(bytes);
        context.Response.Flush();
        context.Response.End();
    }

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