Skip to content

feat(PdfViewer): add UseGoogleDocs parameter #454

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
ArgoZhang merged 2 commits into from
Jun 6, 2025
Merged

feat(PdfViewer): add UseGoogleDocs parameter #454

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
2 commits
Select commit Hold shift + click to select a range
07341ea
feat: 增加 UseGoogleDocs 方法
ArgoZhang Jun 6, 2025
feb8e75
chore: bump version 9.0.1
ArgoZhang Jun 6, 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
2 changes: 1 addition & 1 deletion src/components/BootstrapBlazor.PdfViewer/BootstrapBlazor.PdfViewer.csproj
View file
Open in desktop
Original file line number Diff line number Diff line change
@@ -1,7 +1,7 @@
<Project Sdk="Microsoft.NET.Sdk.Razor">

<PropertyGroup>
<Version>9.0.0</Version>
<Version>9.0.1</Version>
</PropertyGroup>

<PropertyGroup>
Expand Down
2 changes: 1 addition & 1 deletion src/components/BootstrapBlazor.PdfViewer/PdfViewer.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -2,4 +2,4 @@
@inherits BootstrapModuleComponentBase
@attribute [JSModuleAutoLoader("./_content/BootstrapBlazor.PdfViewer/PdfViewer.razor.js", JSObjectReference = true, AutoInvokeDispose = false)]

<div @attributes="AdditionalAttributes" id="@Id" data-bb-url="@Url" class="@ClassString" style="@StyleString"></div>
<div @attributes="AdditionalAttributes" id="@Id" data-bb-google-docs="@UseGoogleDocsString" class="@ClassString" style="@StyleString"></div>
26 changes: 25 additions & 1 deletion src/components/BootstrapBlazor.PdfViewer/PdfViewer.razor.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -35,6 +35,12 @@ public partial class PdfViewer
[Parameter]
public Func<Task>? NotSupportCallback { get; set; }

/// <summary>
/// Gets or sets whether to use Google Docs for PDF rendering. Default is false.
/// </summary>
[Parameter]
public bool UseGoogleDocs { get; set; } = false;

private string? ClassString => CssBuilder.Default("bb-pdf-viewer-container")
.AddClassFromAttributes(AdditionalAttributes)
.Build();
Expand All @@ -44,6 +50,9 @@ public partial class PdfViewer
.Build();

private string? _url;
private bool _useGoogleDocs;

private string? UseGoogleDocsString => UseGoogleDocs ? "true" : null;

/// <summary>
/// <inheritdoc/>
Expand All @@ -57,11 +66,25 @@ protected override async Task OnAfterRenderAsync(bool firstRender)
if (firstRender)
{
_url = Url;
_useGoogleDocs = UseGoogleDocs;
return;
}

var rerender = false;
if (_url != Url)
{
_url = Url;
rerender = true;
}

if (_useGoogleDocs != UseGoogleDocs)
{
_useGoogleDocs = UseGoogleDocs;
rerender = true;
}

if (rerender)
{
await InvokeVoidAsync("loadPdf", Id, _url);
}
}
Expand All @@ -73,7 +96,8 @@ protected override async Task OnAfterRenderAsync(bool firstRender)
protected override Task InvokeInitAsync() => InvokeVoidAsync("init", Id, Interop, new
{
LoadedCallaback = nameof(TriggerOnLoaded),
NotSupportCallback = nameof(TriggerNotSupportCallback)
NotSupportCallback = nameof(TriggerNotSupportCallback),
Url
});

/// <summary>
Expand Down
15 changes: 9 additions & 6 deletions src/components/BootstrapBlazor.PdfViewer/PdfViewer.razor.js
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -8,8 +8,7 @@ export async function init(id, invoke, options) {
const pdfViewer = { el, invoke, options };
Data.set(id, pdfViewer);

const url = el.getAttribute('data-bb-url');
await loadPdf(id, url);
await loadPdf(id, options.url);
}

export async function loadPdf(id, url) {
Expand All @@ -21,6 +20,9 @@ export async function loadPdf(id, url) {
return;
}

delete pdfViewer.frame;
el.innerHTML = '';

if (url) {
const { frame } = pdfViewer;
const viewer = frame || createFrame(el);
Expand All @@ -29,12 +31,13 @@ export async function loadPdf(id, url) {
invoke.invokeMethodAsync(options.loadedCallaback);
};
}

const useGoogleDocs = el.getAttribute('data-bb-google-docs') === 'true';
if (useGoogleDocs) {
url = `http://docs.google.com/viewer?url=${url}`
Copy link
Copy Markdown

@sourcery-ai sourcery-ai Bot Jun 6, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

issue (code-quality): Don't reassign parameter - url (dont-reassign-parameters)

ExplanationReassigning parameters can lead to unexpected behavior, especially when accessing the arguments object. It can also cause optimization issues, especially in V8.

From the Airbnb JavaScript Style Guide

}
Comment on lines +36 to +38
Copy link
Copy Markdown

@sourcery-ai sourcery-ai Bot Jun 6, 2025

Choose a reason for hiding this comment

The reason will be displayed to describe this comment to others. Learn more.

suggestion (bug_risk): Use HTTPS and encode URL when loading Google Docs viewer

Update the protocol to https:// and use encodeURIComponent(url) to prevent mixed-content errors and handle special characters in the URL.

Suggested change
if (useGoogleDocs) {
url = `http://docs.google.com/viewer?url=${url}`
}
if (useGoogleDocs) {
url = `https://docs.google.com/viewer?url=${encodeURIComponent(url)}`
}

viewer.src = url;
}
else {
delete pdfViewer.frame;
el.innerHTML = '';
}
}

const createFrame = el => {
Expand Down