Blazor 튜토리얼로 PDF 파일 생성하기

Visual Studio에서 새 프로젝트 생성

먼저 Microsoft Visual Studio 응용 프로그램을 열고 파일 메뉴에서 "새 프로젝트"를 선택하십시오. 그런 다음 "Blazor Server App"을 선택하십시오.

Visual Studio에서 새로운 프로젝트 생성하기

프로젝트 이름을 입력하고 파일 경로를 선택하십시오. 그런 다음 만들기 버튼을 클릭하십시오.

새 Blazor 응용 프로그램의 이름과 위치 선택

원하는 .NET Framework를 선택하십시오(이 튜토리얼에서는 .NET 6.0을 사용할 것입니다). 아래 스크린샷을 참조하십시오:

.NET 6.0 프레임워크로 Visual Studio에서 새 프로젝트 생성

Microsoft Visual Studio는 이제 이 Blazor 애플리케이션의 구조를 생성할 것입니다.

그 다음, 이 새 프로젝트에 IronPDF 라이브러리를 추가하십시오.

3.1 Visual Studio의 NuGet 패키지 관리자 사용하기

Visual Studio는 라이브러리를 프로젝트에 직접 설치하는 데 도움을 주는 NuGet 패키지 관리자를 제공합니다. 아래의 스크린샷은 NuGet 패키지 관리자를 여는 방법을 보여줍니다.

Visual Studio의 NuGet 패키지 관리자 접속

검색 필드 아래의 탐색 탭에서 "IronPDF"를 검색하기 위해 아래 스크린샷처럼 검색하세요:

NuGet 패키지 관리 GUI에서 IronPDF 라이브러리 검색

위 이미지에서 관련 검색 결과 목록을 보여줍니다. 프로젝트에 패키지를 설치하기 위해 필요한 옵션을 선택하세요.

3.2 Visual Studio 명령줄 사용하기

Visual Studio에서 도구 > NuGet 패키지 관리자 > 패키지 관리자 콘솔로 이동합니다.

패키지 관리자 콘솔 탭에 다음 줄을 입력하세요:

Install-Package IronPdf

패키지는 이제 다운로드되고 현재 프로젝트에 설치됩니다.

NuGet 패키지 관리자 콘솔을 사용하여 IronPDF 라이브러리 설치

3.3 NuGet 웹사이트에서 직접 다운로드

IronPDF 라이브러리를 설치하는 세 번째 방법은 웹사이트에서 직접 NuGet 패키지를 다운로드하는 것입니다.

IronPDF용 NuGet 웹사이트로 이동하세요.

• 오른쪽 메뉴에서 "패키지 다운로드" 옵션을 클릭하세요.
• 파일 시스템에서 다운로드된 패키지를 엽니다. 자동으로 설치됩니다.
• 솔루션을 다시 로드하고 프로젝트에서 사용을 시작하세요.

3.4 IronPDF 웹사이트에서 직접 다운로드

IronPDF 패키지를 직접 다운로드하려면 IronPDF 웹사이트를 방문하세요.

다운로드 후, 프로젝트에 패키지를 추가하기 위해 다음 절차를 따르세요:

• 솔루션 창에서 프로젝트를 오른쪽 클릭.
• "추가" > "참조" 옵션을 선택한 다음, 이전에 다운로드한 라이브러리 위치로 이동하세요.
• 라이브러리를 참조로 추가하기 위해 확인을 클릭하세요.

4. Blazor 서버 앱에서 PDF 문서 만들기

이 튜토리얼의 Blazor 앱은 IronPDF를 사용하여 URL로 웹 페이지의 HTML 콘텐츠를 가져와 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 문서를 생성하는 두 가지 방법을 사용합니다. 첫 번째는 IronPDF의 RenderUrlAsPdf 메소드로, 주어진 URL에서 HTML 콘텐츠를 다운로드하여 PDF 형식으로 변환합니다.

두 번째 메소드는 정적 JSRuntime.InvokeVoidAsync 메소드로, 브라우저의 JavaScript 엔진을 트리거하여 웹 페이지 범위 내에서 JavaScript 함수를 호출하여 클라이언트 파일 시스템에 PDF 콘텐츠를 파일로 저장합니다.

아래에는 이 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 데이터를 받아 블롭으로 변환한 후 클라이언트 측 위치에 저장합니다.

또한, SaveAs 메소드와 ChromePdfRenderer 클래스를 사용하여 브라우저의 로컬 스토리지에 PDF 문서를 저장할 수 있습니다.