Blazor Open a page in a new Browser tab using navigation manager?

Anantham.S 1 Reputation point
2021-01-04T11:14:40.087+00:00

Could please advise me the way of open a page in new tab using Navigation manager and how to show pdf file in browser window?

Blazor
Blazor
A free and open-source web framework that enables developers to create web apps using C# and HTML being developed by Microsoft.
1,383 questions
0 comments

5 answers

Sort by: Most helpful
Most helpful Newest Oldest
  1. Brian Savage 21 Reputation points
    2023-04-26T02:49:48.3233333+00:00

    I am very new to this Blazor Server framework. But I have been having the same 'JS Converting circular structure ' until I noticed that the two calls were slightly different: await JSRuntime.InvokeAsync<object>("open", url, "_blank"); fails await JSRuntime.InvokeVoidAsync("open", url, "_blank"); solves the problem.

    4 people found this answer helpful.
  2. Michael Wang-MSFT 1,051 Reputation points
    2021-01-05T07:08:47.173+00:00

    Hi, @Anantham.S ,

    The way of open a page in new tab

    Try JSRuntime.InvokeAsync to open in new tab. 

        await JSRuntime.InvokeAsync<object>("open", "navigate", "_blank");

    53553-image.png

    show pdf file in browser window

    You can open pdf file directly via a tag. 

        <a href="./HelloWorld.pdf" target="blank">Go to Hello</a>

    53485-222.gif

    ------
    If the answer doesn’t solve your issue, please provide more details of error that will help us track down what’s happening.
    If the answer is helpful, please click "Accept Answer" and upvote it.
    Note: Please follow the steps in our documentation to enable e-mail notifications if you want to receive the related email notification for this thread.

    Best Regards,
    Michael Wang

    3 people found this answer helpful.
  3. Marcel W 0 Reputation points
    2023-01-17T10:54:35.89+00:00

    User's image

    User's image

    Confirmed. I got the same error when using this. But it is interessting to see that the new tab is open and shows the correct page. But after successfully open the tab, the task is throwing an error due to the task has cancelled.

    Edit: I tried to add an CancellationToken.Null as a parameter and it seems to work without exception.

    await _js.InvokeAsync<object>("open", CancellationToken.None, url);

    1 person found this answer helpful.
  4. Rama Murthy Veera 1 Reputation point
    2021-08-27T02:30:06.58+00:00

    It's giving following error!!

    blazor.webassembly.js:1 Uncaught (in promise) TypeError: Converting circular structure to JSON
    --> starting at object with constructor 'Window'
    --- property 'window' closes the circle
    at JSON.stringify (<anonymous>)
    at blazor.webassembly.js:1

  5. Henriksen Wesley D (Wes) 0 Reputation points
    2023-12-06T14:58:20.65+00:00

    If getting the TypeError exception message, use this instead:
    await JSRuntime.InvokeVoidAsync("open", url, "_blank");

    0 comments