Skip to content

981582: Restructure the documentation content Save PDF to different cloud storage in PDF viewer #1449

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
merged 3 commits into from
Sep 25, 2025
Merged

981582: Restructure the documentation content Save PDF to different cloud storage in PDF viewer #1449

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
3 commits
Select commit Hold shift + click to select a range
cbc90e8
981582: RevampSavePdf
sathiyaseelanksf3503 Sep 23, 2025
0305224
981582: RevampSavePdf
sathiyaseelanksf3503 Sep 23, 2025
5156329
981582: RevampSavePdf
sathiyaseelanksf3503 Sep 25, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
8 changes: 4 additions & 4 deletions Document-Processing/PDF/PDF-Viewer/blazor/save-pdf-file/to-amazon-s3.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -13,11 +13,11 @@ To save a PDF file to AWS S3, you can follow the steps below

**Step 1:** Create AWS S3 account

Set up an AWS S3 account by following the instructions on the official AWS site: [AWS Management Console](https://docs.aws.amazon.com/AmazonS3/latest/userguide/Welcome.html). Create an S3 bucket and generate access keys while ensuring secure storage of
Set up an AWS account and configure Amazon S3 by following the official guide: [AWS Management Console](https://docs.aws.amazon.com/AmazonS3/latest/userguide/Welcome.html). Create an S3 bucket, configure an IAM user or role with scoped permissions for S3 access, and generate access keys. Store credentials securely using environment variables.

**Step 2:** Create a Simple SfPdfViewer Sample in blazor

Start by following the steps provided in this [link](https://help.syncfusion.com/document-processing/pdf/pdf-viewer/blazor/getting-started/server-side-application) to create a simple SfPdfViewer sample in blazor. This will give you a basic setup of the SfPdfViewer component.
Start by following the steps provided in this [link](https://help.syncfusion.com/document-processing/pdf/pdf-viewer/blazor/getting-started/web-app) to create a simple SfPdfViewer sample in blazor. This will give you a basic setup of the SfPdfViewer component.

**Step 3:** Include the following namespaces in the **Index.razor** file.

Expand Down Expand Up @@ -77,9 +77,9 @@ Start by following the steps provided in this [link](https://help.syncfusion.com
}
```

Replace the file name with the actual document name that you want to load from AWS S3 bucket. Make sure to pass the document name from the AWS S3 bucket to the `documentPath` property of the SfPdfViewer component
Replace the file name with the actual document name that you want to load from AWS S3 bucket. Make sure to pass the document name from the AWS S3 bucket to the [DocumentPath](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.SfPdfViewer.PdfViewerBase.html#Syncfusion_Blazor_SfPdfViewer_PdfViewerBase_DocumentPath) property of the SfPdfViewer component.

N> Replace **Your Access Key from AWS S3**, **Your Secret Key from AWS S3**, and **Your Bucket name from AWS S3** with your actual AWS access key, secret key and bucket name
N> Replace **Your Access Key from AWS S3**, **Your Secret Key from AWS S3**, and **Your Bucket name from AWS S3** with your actual AWS access key, secret key and bucket name.

N> The **AWSSDK.S3** NuGet package must be installed in your application to use the previous code example.

Expand Down
18 changes: 9 additions & 9 deletions Document-Processing/PDF/PDF-Viewer/blazor/save-pdf-file/to-azure-blob-storage.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,23 +1,23 @@
---
layout: post
title: Save PDF files to Azure Storage in SfPdfViewer Component | Syncfusion
description: Learn here all about how to save PDF files to Azure Blob Storage in Syncfusion Blazor SfPdfViewer component and much more details.
title: Save PDF file to Azure Blob Storage in Blazor SfPdfViewer | Syncfusion
description: Learn how to save PDF files to Azure Blob Storage using the Syncfusion Blazor SfPdfViewer component, including setup, and persistence workflow.
platform: document-processing
control: SfPdfViewer
documentation: ug
---

# Save PDF file to Azure Blob Storage in Blazor SfPdfViewer

To save a PDF file to Azure Blob Storage , you can follow the steps below
To save a PDF file to Azure Blob Storage, follow the steps below.

**Step 1:** Create the Azure Blob Storage account

Log in to the Azure Portal. Create a new Storage Account with preferred settings. Note access keys during the setup. Within the Storage Account, create a Blob Container following the steps in this [link](https://learn.microsoft.com/en-us/azure/storage/common/storage-account-create?toc=%2Fazure%2Fstorage%2Fblobs%2Ftoc.json&tabs=azure-portal).
Sign in to the Azure portal and create a Storage account with the desired configuration. Record the connection string during setup. Within the Storage account, create a Blob container. For detailed guidance, see Create a Storage account and container in the [Azure portal](https://learn.microsoft.com/en-us/azure/storage/common/storage-account-create?toc=%2Fazure%2Fstorage%2Fblobs%2Ftoc.json&tabs=azure-portal).

**Step 2:** Create a Simple SfPdfViewer Sample in blazor
**Step 2:** Create a Simple SfPdfViewer Sample in Blazor

Start by following the steps provided in this [link](https://help.syncfusion.com/document-processing/pdf/pdf-viewer/blazor/getting-started/server-side-application) to create a simple SfPdfViewer sample in blazor. This will give you a basic setup of the SfPdfViewer component.
Create a basic Blazor Web App Server application that hosts the SfPdfViewer component by following [Getting started](https://help.syncfusion.com/document-processing/pdf/pdf-viewer/blazor/getting-started/web-app) with Blazor SfPdfViewer. This provides the baseline configuration required for the viewer.

**Step 3:** Include the following namespaces in the **Index.razor** file.

Expand Down Expand Up @@ -72,11 +72,11 @@ Start by following the steps provided in this [link](https://help.syncfusion.com

```

N> Replace **Your Connection string from Azure** with the actual connection string for your Azure Blob Storage account, **File Name to be Loaded into Syncfusion<sup style="font-size:70%">&reg;</sup> SfPdfViewer** with the file name to load from the Azure container to the SfPdfViewer, and **Your container name in Azure** with the actual container name.
N> Replace **Your Connection string from Azure** with the actual connection string for the Azure Storage account, **File Name to be Loaded into Syncfusion<sup style="font-size:70%">&reg;</sup> SfPdfViewer** with the file name to load from the Azure container into the SfPdfViewer, and **Your container name in Azure** with the actual container name.

N> The **Azure.Storage.Blobs** NuGet package must be installed in your application to use the previous code example.
N> The **Azure.Storage.Blobs** NuGet package must be installed in the application to use the previous code example.

[View sample in GitHub](https://github.com/SyncfusionExamples/blazor-pdf-viewer-examples/tree/master/Load%20and%20Save/Open%20and%20Save%20from%20Azure%20blob%20storage).
[View the sample on GitHub](https://github.com/SyncfusionExamples/blazor-pdf-viewer-examples/tree/master/Load%20and%20Save/Open%20and%20Save%20from%20Azure%20blob%20storage).

## See also

Expand Down
23 changes: 11 additions & 12 deletions ...ent-Processing/PDF/PDF-Viewer/blazor/save-pdf-file/to-box-cloud-file-storage.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,26 +1,25 @@
---
layout: post
title: Save PDF files to Box storage in SfPdfViewer Component | Syncfusion
description: Learn here all about how to save PDF files to Box cloud file storage in Syncfusion Blazor SfPdfViewer component and much more details.
title: Save PDF files to Box storage in SfPdfViewer Component | Syncfusion
description: Learn how to save PDF files to Box cloud file storage using the Syncfusion Blazor SfPdfViewer component, including setup, and upload workflow.
platform: document-processing
control: SfPdfViewer
documentation: ug
---

# Save PDF file to Box cloud file storage in Blazor SfPdfViewer

To save a PDF file to Box cloud file storage, you can follow the steps below
To save a PDF file to Box cloud file storage, follow the steps below.

**Step 1:** Set up a Box developer account and create a Box application

**Step 1** Set up a Box developer account and create a Box application
To access Box storage programmatically, a Box developer account is required. Open the [Box Developer](https://developer.box.com/) Console and create a Box application. The application provides the Client ID and Client Secret used to authenticate with Box APIs. Before accessing files, the application must be authorized using `OAuth 2.0 authentication`.

To access Box storage programmatically, you'll need a developer account with Box. Go to the [Box Developer Console](https://developer.box.com/), sign in or create a new account, and then create a new Box application. This application will provide you with the necessary credentials Client ID and Client Secret to authenticate and access Box APIs. Before accessing files, you need to authenticate your application to access your Box account. Box API supports `OAuth 2.0 authentication` for this purpose.
**Step 2:** Create a simple SfPdfViewer sample in Blazor

**Step 2:** Create a Simple SfPdfViewer Sample in blazor
Create a basic Blazor Web App Server application that hosts the SfPdfViewer component by following [Getting started](https://help.syncfusion.com/document-processing/pdf/pdf-viewer/blazor/getting-started/web-app) with Blazor SfPdfViewer. This provides the baseline configuration required for the viewer.

Start by following the steps provided in this [link](https://help.syncfusion.com/document-processing/pdf/pdf-viewer/blazor/getting-started/server-side-application) to create a simple SfPdfViewer sample in blazor. This will give you a basic setup of the SfPdfViewer component.

**Step 3:** Include the following namespaces in the **Index.razor** file.
**Step 3:** Include the following namespaces in the **Index.razor** file

1. Import the required namespaces at the top of the file:

Expand All @@ -33,7 +32,7 @@ Start by following the steps provided in this [link](https://help.syncfusion.com
@using Syncfusion.Blazor.Buttons
```

**Step 4:** Add the below code example to save pdf to `Box cloud storage`
**Step 4:** Add the following code example to save a PDF to `Box cloud storage`

```csharp

Expand Down Expand Up @@ -82,9 +81,9 @@ Start by following the steps provided in this [link](https://help.syncfusion.com

N> replace **Your_Box_Storage_Access_Token** with your actual box access token, and **Your_Folder_ID** with the ID of the folder in your box storage where you want to perform specific operations. Remember to use your valid box API credentials, as **Your_Box_Storage_ClientID** and **Your_Box_Storage_ClientSecret"** are placeholders for your application's API key and secret.

N> The **Box.V2.Core** NuGet package must be installed in your application to use the previous code example.
N> Install the **Box.V2.Core** NuGet package in the application to use the Box SDK types referenced in the example.

N> Replace `PDF_Succinctly.pdf` with the actual document name that you want to load from Box cloud file storage. Make sure to pass the document name from the box folder to the [documentPath](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.SfPdfViewer.PdfViewerBase.html#Syncfusion_Blazor_SfPdfViewer_PdfViewerBase_DocumentPath) property of the SfPdfViewer component
N> If loading a document by name, replace `PDF_Succinctly.pdf` with the actual file name, and assign it to the DocumentPath property of the SfPdfViewer component. For details, see the [DocumentPath](https://help.syncfusion.com/cr/blazor/Syncfusion.Blazor.SfPdfViewer.PdfViewerBase.html#Syncfusion_Blazor_SfPdfViewer_PdfViewerBase_DocumentPath) property of the SfPdfViewer component.

[View sample in GitHub](https://github.com/SyncfusionExamples/blazor-pdf-viewer-examples/tree/master/Load%20and%20Save/Open%20and%20Save%20from%20box%20cloud%20storage)

Expand Down
24 changes: 12 additions & 12 deletions Document-Processing/PDF/PDF-Viewer/blazor/save-pdf-file/to-google-cloud-storage.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,23 +1,23 @@
---
layout: post
title: Save PDF files to GCS in Blazor SfPdfViewer Component | Syncfusion
description: Learn here all about how to Save PDF files to Google Cloud Storage in Syncfusion Blazor SfPdfViewer component and much more details.
title: Save PDF files to Google Cloud Storage in SfPdfViewer | Syncfusion
description: Learn how to save PDF files to Google Cloud Storage from the Syncfusion Blazor SfPdfViewer component with a secure, step-by-step workflow.
platform: document-processing
control: SfPdfViewer
documentation: ug
---

# Save PDF file to Google Cloud Storage in Blazor SfPdfViewer

To save a PDF file to Google Cloud Storage in a SfPdfViewer, you can follow the steps below
To save a PDF file to Google Cloud Storage from the SfPdfViewer, follow the steps below.

**Step 1** Create a Service Account
**Step 1** Create a service account

Open the Google Cloud Console. Navigate to `IAM & Admin` > `Service accounts`. Click `Create Service Account`.` Enter a name, assign roles (e.g., Storage Object Admin), and create a key in JSON format. Download the key file securely. Utilize the downloaded key file in your applications or services for authentication and access to the Google Cloud Storage bucket. For additional details, refer to the [official documentation](https://cloud.google.com/iam/docs/service-accounts-create).
Open the Google Cloud Console. Navigate to `IAM & Admin` > `Service accounts`. Click `Create service account`, enter a name, assign only the required role (for uploads, Storage Object Creator; use broader roles such as Storage Object Admin only if necessary), and create a key in JSON format. Download the key file securely. Use the downloaded key file in the application for authentication and access to the Google Cloud Storage bucket. For details, refer to the [official documentation](https://cloud.google.com/iam/docs/service-accounts-create).

**Step 2:** Create a Simple SfPdfViewer Sample in blazor
**Step 2:** Create a simple SfPdfViewer sample in Blazor

Start by following the steps provided in this [link](https://help.syncfusion.com/document-processing/pdf/pdf-viewer/blazor/getting-started/server-side-application) to create a simple SfPdfViewer sample in blazor. This will give you a basic setup of the SfPdfViewer component.
Start by following the steps in this guide to create a [basic SfPdfViewer](https://help.syncfusion.com/document-processing/pdf/pdf-viewer/blazor/getting-started/web-app) sample in Blazor. This provides the initial setup of the SfPdfViewer component.

**Step 3:** Include the following namespaces in the **Index.razor** file.

Expand All @@ -30,7 +30,7 @@ Start by following the steps provided in this [link](https://help.syncfusion.com
@using Syncfusion.Blazor.Buttons
```

**Step 4:** Add the below code example to
**Step 4:** Add the below code example to the Index.razor file to upload the currently loaded document to GCS.

```csharp

Expand Down Expand Up @@ -70,13 +70,13 @@ Start by following the steps provided in this [link](https://help.syncfusion.com
}
```

N> Replace **Your Bucket name from Google Cloud Storage** with the actual name of your Google Cloud Storage bucket and **File Name to be Loaded into Syncfusion<sup style="font-size:70%">&reg;</sup> SfPdfViewer** with the actual file name you want to load from the cloud bucket
N> Replace **Your Bucket name from Google Cloud Storage** with the actual name of your Google Cloud Storage bucket and **File Name to be Loaded into Syncfusion<sup style="font-size:70%">&reg;</sup> SfPdfViewer** with the actual file name you want to load from the cloud bucket.

N> Replace **path/to/service-account-key.json** with the actual file path to your service account key JSON file. Make sure to provide the correct path and filename.
N> Replace **path/to/service-account-key.json** with the actual file path to the service account key JSON file. Make sure to provide the correct path and filename.

N> The **Google.Cloud.Storage.V1** NuGet package must be installed in your application to use the previous code example.
N> The **Google.Cloud.Storage.V1** NuGet package is required. Install it in the application before running the sample.

[View sample in GitHub](https://github.com/SyncfusionExamples/blazor-pdf-viewer-examples/tree/master/Load%20and%20Save/Open%20and%20Save%20from%20GCS)
[View the sample on GitHub](https://github.com/SyncfusionExamples/blazor-pdf-viewer-examples/tree/master/Load%20and%20Save/Open%20and%20Save%20from%20GCS)

## See also

Expand Down
26 changes: 13 additions & 13 deletions Document-Processing/PDF/PDF-Viewer/blazor/save-pdf-file/to-google-drive.md
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,23 +1,23 @@
---
layout: post
title: Save PDF files to Google Drive in SfPdfViewer Component | Syncfusion
description: Learn here all about how to save PDF files to Google Drive in Syncfusion Blazor SfPdfViewer component and much more details.
title: Save PDF files to Google Drive in Blazor SfPdfViewer | Syncfusion
description: Learn how to save PDF files to Google Drive using the Syncfusion Blazor SfPdfViewer, including required setup, and a working example.
platform: document-processing
control: SfPdfViewer
documentation: ug
---

# Save PDF file to Google Drive in Blazor SfPdfViewer
# Save PDF files to Google Drive in Blazor SfPdfViewer

To save a PDF file to Google Drive, you can follow the steps below
Use the following steps to download the currently loaded PDF from the viewer and upload it to a specified Google Drive folder.

**Step 1** Set up Google Drive API
**Step 1:** Set up the Google Drive API

You must set up a project in the Google Developers Console and enable the Google Drive API. Obtain the necessary credentials to access the API. For more information, view the official [link](https://developers.google.com/drive/api/guides/enable-sdk).
Create a project in Google Cloud Console and enable the Google Drive API. Obtain the necessary credentials to access the API. For detailed instructions, see Enable the [Google Drive API](https://developers.google.com/drive/api/guides/enable-sdk).

**Step 2:** Create a Simple SfPdfViewer Sample in blazor
**Step 2:** Create a simple SfPdfViewer sample in Blazor

Start by following the steps provided in this [link](https://help.syncfusion.com/document-processing/pdf/pdf-viewer/blazor/getting-started/server-side-application) to create a simple SfPdfViewer sample in blazor. This will give you a basic setup of the SfPdfViewer component.
Follow the [Getting Started](https://help.syncfusion.com/document-processing/pdf/pdf-viewer/blazor/getting-started/web-app) guide to create a basic Blazor application with the SfPdfViewer component.

**Step 3:** Include the following namespaces in the **Index.razor** file.

Expand All @@ -33,7 +33,7 @@ Start by following the steps provided in this [link](https://help.syncfusion.com
@using Syncfusion.Blazor.Buttons
```

**Step 4:** Add the below code example to save the downloaded PDF files to `Google drive` file.
**Step 4:** Add the following example to save the downloaded PDF file to `Google Drive`.

```csharp

Expand Down Expand Up @@ -99,13 +99,13 @@ Start by following the steps provided in this [link](https://help.syncfusion.com

```

N> Replace **Your Google Drive Folder ID** with your actual Google Drive folder ID, **Your Application name** with your actual application name, **File Name to be Loaded into Syncfusion<sup style="font-size:70%">&reg;</sup> SfPdfViewer** with the actual file name you want to load from the Azure container to the Syncfusion<sup style="font-size:70%">&reg;</sup> SfPdfViewer and **Your Path to the OAuth 2.0 Client IDs JSON file** with the actual path to your OAuth 2.0 Client IDs JSON file
N> Replace **Your Google Drive Folder ID** your actual Google Drive folder ID, **Your Application name** with the actual application name, **File Name to be loaded into Syncfusion<sup style="font-size:70%">&reg;</sup> SfPdfViewer** with the file to load into the viewer, and **Your Path to the OAuth 2.0 Client IDs JSON file** with the path to the downloaded OAuth client credentials JSON file.

N> The **FolderId** part is the unique identifier for the folder. For example, if your folder URL is: `https://drive.google.com/drive/folders/abc123xyz456`, then the folder ID is `abc123xyz456`.
N> The **FolderId** is the unique identifier found in the folder URL. For example, for `https://drive.google.com/drive/folders/abc123xyz456`, the folder ID is `abc123xyz456`.

N> The **Google.Apis.Drive.v3** NuGet package must be installed in your application to use the previous code example.
N> Install the **Google.Apis.Drive.v3** NuGet package in the application to use the Google Drive client.

[View sample in GitHub](https://github.com/SyncfusionExamples/blazor-pdf-viewer-examples/tree/master/Load%20and%20Save/Open%20and%20Save%20from%20Google%20Drive)
[View the sample on GitHub](https://github.com/SyncfusionExamples/blazor-pdf-viewer-examples/tree/master/Load%20and%20Save/Open%20and%20Save%20from%20Google%20Drive)

## See also

Expand Down