BlazorチュートリアルでPDFファイルを作成する

Visual Studioでの新しいプロジェクトの作成

まず、Microsoft Visual Studio アプリケーションを開き、ファイルメニューから「新しいプロジェクト」を選択します。 次に、「Blazor Server App」を選択します。

Visual Studioで新しいプロジェクトを作成する

プロジェクト名を入力し、ファイルパスを選択します。 次に、作成ボタンをクリックします。

新しいBlazorアプリケーションの名前と場所を選択する

希望の.NET Frameworkを選択します（このチュートリアルでは.NET 6.0を使用します）。以下のスクリーンショットを参照してください。

.NET 6.0 Frameworkを使用したVisual Studioでの新しいプロジェクトの作成

Microsoft Visual Studioは、このBlazorアプリケーションの構造を生成します。

次に、この新しいプロジェクトにIronPDFライブラリを追加してください。

3.1 Visual StudioのNuGetパッケージマネージャーを使用

Visual StudioはNuGetパッケージマネージャーを提供し、プロジェクトにライブラリを直接インストールするのを助けます。 * 無制限のロケーション

Visual StudioのNuGetパッケージマネージャーへのアクセス

「Browse」タブの検索フィールドに「IronPDF」と入力して検索してください。以下のスクリーンショットを参照してください。

NuGetパッケージマネージャーGUIでIronPDFライブラリを検索する

上記の画像には関連する検索結果の一覧が表示されています。 パッケージをプロジェクトにインストールするために必要なオプションを選択します。

3.2 Visual Studioコマンドラインを使用

Visual Studioでは、ツール > NuGet パッケージ マネージャー > パッケージ マネージャー コンソールに移動します。

パッケージ マネージャー コンソールタブに次の行を入力してください。

Install-Package IronPdf

パッケージは現在のプロジェクトにダウンロードおよびインストールされます。

NuGetパッケージマネージャーコンソールを使用してIronPDFライブラリをインストールする

3.3 NuGetウェブサイトから直接ダウンロード

IronPDFライブラリをインストールするための3番目の方法は、ウェブサイトからNuGetパッケージを直接ダウンロードすることです。

IronPDF用NuGetウェブサイトに移動します。

• 右側のメニューから「Download Package」オプションをクリックします。
• ファイルシステム上でダウンロードしたパッケージを開きます。 - ダウンロードしたパッケージをダブルクリックします。
• ソリューションを再読み込みし、プロジェクトで使用を開始します。

3.4 IronPDFウェブサイトから直接ダウンロード

IronPDFウェブサイトを訪問し、IronPDFパッケージを直接ダウンロードしてください。

ダウンロード後、以下の手順に従ってパッケージをプロジェクトに追加します。

• ソリューションウィンドウからプロジェクトを右クリックします。
• 「追加」>「参照」のオプションを選択し、前にダウンロードしたライブラリの場所に移動します。
• 「OK」をクリックして、ライブラリを参照として追加します。

4. Blazor Server AppでPDF文書を作成する

このチュートリアルのBlazorアプリは、IronPDFを使用して、ウェブページのHTMLコンテンツをそのURLで取得し、それをPDF文書に変換します。

プロジェクト内の.razorファイルに以下のソースコードを入力します。

@using IronPdf

@code {
    /// <summary>
    /// This method exports data by converting a URL to a PDF file and initiating its download.
    /// </summary>
    public async Task ExportData()
    {
        try
        {
            string fileName = "Demo.pdf";
            var renderer = new ChromePdfRenderer();

            // Render the contents of the URL as a PDF document
            var pdf = renderer.RenderUrlAsPdf("https://localhost:7018/fetchdata");

            // Save the PDF using a JavaScript function
            await JSRuntime.InvokeVoidAsync("saveAsFile", fileName, Convert.ToBase64String(pdf.Stream.ToArray()));
        }
        catch (Exception ex)
        {
            // Handle any exceptions that may occur
            Console.Error.WriteLine($"Error in ExportData: {ex.Message}");
        }
    }
}

@using IronPdf

@code {
    /// <summary>
    /// This method exports data by converting a URL to a PDF file and initiating its download.
    /// </summary>
    public async Task ExportData()
    {
        try
        {
            string fileName = "Demo.pdf";
            var renderer = new ChromePdfRenderer();

            // Render the contents of the URL as a PDF document
            var pdf = renderer.RenderUrlAsPdf("https://localhost:7018/fetchdata");

            // Save the PDF using a JavaScript function
            await JSRuntime.InvokeVoidAsync("saveAsFile", fileName, Convert.ToBase64String(pdf.Stream.ToArray()));
        }
        catch (Exception ex)
        {
            // Handle any exceptions that may occur
            Console.Error.WriteLine($"Error in ExportData: {ex.Message}");
        }
    }
}

[using] ReadOnly Property code() As IronPdf
	''' <summary>
	''' This method exports data by converting a URL to a PDF file and initiating its download.
	''' </summary>
'INSTANT VB TODO TASK: Local functions are not converted by Instant VB:
'	public async Task ExportData()
'	{
'		try
'		{
'			string fileName = "Demo.pdf";
'			var renderer = New ChromePdfRenderer();
'
'			' Render the contents of the URL as a PDF document
'			var pdf = renderer.RenderUrlAsPdf("https://localhost:7018/fetchdata");
'
'			' Save the PDF using a JavaScript function
'			await JSRuntime.InvokeVoidAsync("saveAsFile", fileName, Convert.ToBase64String(pdf.Stream.ToArray()));
'		}
'		catch (Exception ex)
'		{
'			' Handle any exceptions that may occur
'			Console.@Error.WriteLine(string.Format("Error in ExportData: {0}", ex.Message));
'		}
'	}
End Property

上記のコードスニペットは、HTMLからPDF文書を生成する2つの方法を使用しています。 1つ目は、IronPDFのRenderUrlAsPdfメソッドで、指定されたURLからHTMLコンテンツをダウンロードし、PDF形式に変換します。

2つ目の方法は、静的なJSRuntime.InvokeVoidAsyncメソッドで、クライアントのファイルシステムにPDFコンテンツを保存するウェブページの範囲内でJavaScript関数をブラウザのJavaScriptエンジンをトリガーします。

このJavaScript関数は以下に含まれています。

<script type="text/javascript">
    /**
     * Saves the PDF data as a file on the client's system.
     * @param {string} filename - The name of the file to be created.
     * @param {string} bytesBase64 - The Base64 encoded string of the PDF data.
     */
    function saveAsFile(filename, bytesBase64) {
        if (navigator.msSaveBlob) {
            // Download the document in Microsoft Edge browser
            var data = window.atob(bytesBase64);
            var bytes = new Uint8Array(data.length);
            for (var i = 0; i < data.length; i++) {
                bytes[i] = data.charCodeAt(i);
            }
            var blob = new Blob([bytes.buffer], { type: "application/octet-stream" });
            navigator.msSaveBlob(blob, filename);
            window.navigator.msSaveOrOpenBlob(blob);
        }
        else {
            var link = document.createElement('a');
            link.download = filename;
            link.href = "data:application/octet-stream;base64," + bytesBase64;
            document.body.appendChild(link); // Needed for Firefox
            link.click();
            document.body.removeChild(link);
        }
    }
</script>

<script type="text/javascript">
    /**
     * Saves the PDF data as a file on the client's system.
     * @param {string} filename - The name of the file to be created.
     * @param {string} bytesBase64 - The Base64 encoded string of the PDF data.
     */
    function saveAsFile(filename, bytesBase64) {
        if (navigator.msSaveBlob) {
            // Download the document in Microsoft Edge browser
            var data = window.atob(bytesBase64);
            var bytes = new Uint8Array(data.length);
            for (var i = 0; i < data.length; i++) {
                bytes[i] = data.charCodeAt(i);
            }
            var blob = new Blob([bytes.buffer], { type: "application/octet-stream" });
            navigator.msSaveBlob(blob, filename);
            window.navigator.msSaveOrOpenBlob(blob);
        }
        else {
            var link = document.createElement('a');
            link.download = filename;
            link.href = "data:application/octet-stream;base64," + bytesBase64;
            document.body.appendChild(link); // Needed for Firefox
            link.click();
            document.body.removeChild(link);
        }
    }
</script>

上記のJavaScript関数はBlazorからBase64データを受け取り、それをBlobに変換してクライアント側に保存します。

Alternatively, The SaveAs method from the ChromePdfRenderer class can also be used to save PDF documents to the browser's local storage.