C# Blazor client-side read hash parameters from url

Question

I have a project in Blazor

And on the client-side, I want to read hash parameters

I know how to do it in JavaScript - but my question is how to do it in c# client-side in Blazor project

For example, I have an URL http://localhost:5060/#token=12345678

How to take token?

my code in index.cshtml

@page "/"
@inject Microsoft.AspNetCore.Blazor.Services.IUriHelper UriHelper

<h1>Hello, world!</h1>

url is @Url

@functions {
protected override void OnInit() {
    Url = GetUrl();
}

public string Url { get; set; }

public string GetUrl() {
    return ?;
}
}

@DawidFerenczy Blazor is a experimental C# framework for Client Side scripting. using WebAssembly https://blazor.net/ — Nick Polyderopoulos, Nov 14 '18 at 19:17
Perhaps this might help: https://stackoverflow.com/questions/50102726/get-current-url-in-a-blazor-component — , Nov 14 '18 at 19:22
By the way, perhaps you could change your URL to use "route parameters". This could perhaps make it easier to map the token to a component property (see here: https://codedaze.io/blazor-bites-routing/). Although, i have to admit i haven't done anything like that myself, so i might talk complete bollocks here ;-) — , Nov 14 '18 at 19:26
Possible duplicate of [Get current Url in a Blazor component](https://stackoverflow.com/questions/50102726/get-current-url-in-a-blazor-component) — mjwills, Nov 14 '18 at 20:37
@MatthieuBrucher Did you try to read my question?! There is an answer in JS but I try to solve it in C# — Igor Cova, Nov 15 '18 at 06:12

enet · Accepted Answer · 2018-11-14T22:10:15.730

If you can do it in JavaScript, then use JavaScript Interop: 1. Define a JavaScript function which extract the token. 2. Define a C# method which call the function

But it would be still better to do that with Blazor which itself use JavaScript... What you need is to look at the methods defined in Microsoft.AspNetCore.Blazor.Services.UriHelperBase and/or Microsoft.AspNetCore.Blazor.Browser.Services.BrowserUriHelper

Hope this helps...

Note: the <base> element is set in the Index.Html file located in the wwwroot folder.

"The HTML <base> element specifies the base URL to use for all relative URLs contained within a document. There can be only one element in a document.

The base URL of a document can be queried from a script using document.baseURI."

Try this:

var absoluteUrl = UriHelper.GetAbsoluteUri();
var token = absoluteUrl.Substring(absoluteUrl.IndexOf("=") + 1);

Igor Cova · Answer 2 · 2020-01-31T05:52:10.360

For reading hash parameters in C# Blazor without JavaScript or other client-side solutions I need to change function, like in the code below:

@functions {
  private string url = string.Empty;

  protected override void OnInit() {
    string url = UriHelper.GetAbsoluteUri();
    string[] parameters = url.Replace(UriHelper.GetBaseUri(), "").Replace("#", "").Split('&');

    string token = string.Empty;

    foreach (string prm in parameters) {
      if (prm.IndexOf("token=") >= 0) {
        token = prm.Replace("token=", "");
      }
    }

    UriHelper.OnLocationChanged += OnLocationChanged;
  }

  private void OnLocationChanged(object sender, string newUriAbsolute) {
    url = newUriAbsolute;
  }

  public void Dispose() {
    UriHelper.OnLocationChanged -= OnLocationChanged;
  }
}

score 0 · Answer 3 · answered Mar 13 '23 at 02:55

I was trying to retrieve the hash bookmark from a url in a Blazor component. UriHelper was not available. I had to use NavigationManager:

@inject NavigationManager _navigationManager;

.....
......

@code {
...
protected override async Task OnInitializedAsync()
{
        var uri = _navigationManager.Uri;
        int si = uri.IndexOf("#model=");
        var modelFile = si > 0 ? uri.Substring(si + 7) : ""; 
}

C# Blazor client-side read hash parameters from url

3 Answers3