在新标签页中打开PDF - Blazor

Question

我想在新的选项卡中打开一个PDF文件。以下代码可以在普通的HTML文件中工作，但在Blazor中不起作用。是否有办法在Blazor中使用它，或者有其他方法可以在Blazor中打开PDF文件？

<a href="Path" target="_blank">Read more</a>

- MaxB

---

https://dev59.com/U5ffa4cB1Zd3GeqP8HIA - Sergi

@Sergi 这是MVC。正在寻找Blazor的方法。 - Steve Greene

@MaxB - 你解决了吗？ - Steve Greene

@SteveGreene 还没有。 - MaxB

@Flippowitsch 没有，不幸的是 :/ - MaxB

Answer 1

在“正常”的HTML中有效的内容，在Blazor中可能无法正常工作，因为service-worker会将未知路由重定向到index.html。请参见service-worker.published.js文件中的onFetch()方法：

const shouldServeIndexHtml = event.request.mode === 'navigate';
const request = shouldServeIndexHtml ? 'index.html' : event.request;

当您点击链接<a href="Path" target="_blank">Read more</a>时，shouldServeIndexHtml为true。

为了避免这种情况，只需将上述代码更改为：

const shouldServeIndexHtml = event.request.mode === 'navigate'
     && !event.request.url.includes('/pdf/');
const request = shouldServeIndexHtml ? 'index.html' : event.request;

假设您的pdf文件在wwwroot下的子文件夹“pdf”中。请在这里找到更多信息。由于url包含“/pdf/”，shouldServeIndexHtml变为false，因此您的pdf将被显示。

- Flippowitsch

Answer 2

我可以提供两个选项：

1. 通过一个按钮。 2. 其他选项。

@inject IJSRuntime jsRuntime

<button @onclick="@LoadPage">Load Page</button>

@code {
    async Task LoadPage()
    {
        await jsRuntime.InvokeAsync<object>("open", "MyPage", "_blank");
    }
}

通过链接。

<a class="dropdown-item" href="MyPage" target="_blank">

你想要启动的 Razor 页面顶部应该有以下内容：

@page "/MyPage"

- DarkIceDust

---

这是用于在我的 Blazor 页面之间进行路由吗？但我想要打开一个 PDF。 - MaxB