Blazor Server : How do i generate href dynamically

I am using Blazor Server Project with .net 7.
I want to render the following link in my grid grows.
Here the need is that only when user click the button, i want to run the code that will compose SAS token with URL and the it should open this dynamically generated URL, which has sas token valid for 1 minute.

 <a href="dynamically Generated when clicked on this link"  
      class="btn btn-primary ms-2 mt-1" target="_blank">View</a>

Based on the suggestion from answers (@sam and @Kurt Hamilton), this is what i came up with, but it load the new pgae by repalcing the current page, i want the page to be loaded in new tab or new window, looks like target option has no effect, since i am using navigation manager and preventing default.

<a href="#"
   @onclick:preventDefault="true"
   @onclick:stopPropagation="true"
   @onclick="@(async ()=> await ViewFile(fileInfo.FullFilePathAndName))"
   class="btn btn-primary ms-2 mt-1" target="_blank">View</a>

I am not sure if thats even possible. However, in your case it would be best to use a onclick handler on the anchor tag and inside this handler use the NavigationManager to go to a dynamically generated URL. The href of the anchor tag in this case should be href=”” to make sure the browser doesn’t interfere with the NavigationManager when you click the link.

Here is an example:

@page "/"

@inject IJSRuntime JSRuntime

<a href="" @onclick="OnClickHandler">View</a>

@code {
    private async void OnClickHandler()
    {
        var token = "77465691";
        await JSRuntime.InvokeVoidAsync("open", $"https://stackoverflow.com/questions/{token}", "_blank");
    }
}

You could use a button with a click event handler.

1. Create a button with an onclick event handler

<button type="button" @onclick="@OnButtonClick">
Click me to generate dynamic URL
</button>

2. Generate the URL in the event handler and use NavigationManager to do the navigating.

@inject NavigationManager NavigationManager
@code {
  private void OnButtonClick()
  {
    string url = GenerateUrl();
    NavigationManager.NavigateTo(url);
  } 

  private string GenerateUrl()
  {
    // TODO: implement
    return "/";
  }  
}

EDIT

Since a requirement for you is to utilise normal anchor functionality (e.g. open in new tab), I would recommend that you link to a page that acts as a intermediary. The intermediate page would generate the link on initialize, and then redirect to the dynamic page.

1. Create a link to the intermediary page

<a href="/my-link-generator" target="_blank">
Link to dynamic URL
</a>

2. Create the intermediary page

@page "/my-link-generator"

@inject NavigationManager NavigationManager
@code {
  protected override void OnInitialized()
  {
    string url = GenerateUrl();
    NavigationManager.NavigateTo(url);
  }
  
  private string GenerateUrl()
  {
    // TODO: implement
    return "/";
  }
}

Post from (Nb777) helped

await jsRuntime.InvokeAsync(“open”, “”https://www.google.com/””, “_blank”);

I think it’s more instructional to consider what Blazor is. It’s a framework for generating html dynamically. It does things in a super-cool and efficient way– But ultimately, under the hood– it’s still just a browser displaying html.

Therefore, it’s often better to just look for a vanilla html solution instead of trying to figure out how to do it in Blazor (with or without javascript):

<p>Open <a href="https://www.google.com/" target="_blank" rel="noopener noreferrer">GOOGLE</a>.</p>

If this doesn’t work, it’s because someone’s browser settings don’t WANT you to pop up a new page. Respect this setting, and move on with your life.

Of course, instead of “google.com” you can put a link to whatever page you want, including a new document in your own site.