Send token to api using SfDataManager and Adaptor

[Luis Campuzano]

Hi All, 

How I can send a token or any security token to an api while using SfChart and the SfDataManager, I was able to add the Url and use the Adaptor as "Syncfusion.Blazor.Adaptors.WebApiAdaptor" but my api controller is secure and only accept an Authorize role, so how I can I send on the header a token

Thanks for all your help

Luis Campuzano

[Sarveswaran Palani]

Hi Luis,

Greetings from Syncfusion support.

We suggest you to set the access token in the default header of the HttpClient by injecting it in the page. We have already explained about this topic detaily in our UG documentation. Kindly refer the attached UG documentation link for your reference.

Reference: https://blazor.syncfusion.com/documentation/datagrid/data-binding#authorization-and-authentication

Please get back to us, if you have any further queries.

Regards,
Sarvesh

[Luis Campuzano]

Hello,

I try to follow your recommendations base on your link:
Data Binding in Blazor DataGrid Component | Syncfusion
and as you can see Below I have everything setup, but in my case I don't create a httpClient on the 

OnInitializedAsync()

As you can see I'm adding the HttpClient before the SyncfusionBlazor

builder.Services.AddHttpClient<FullServiceApi>("FullServiceApi",
       (sp, c) =>
       {
           //c.BaseAddress = new Uri(builder.HostEnvironment.BaseAddress);
           c.EnableIntercept(sp);
       }
   );
 
   builder.Services.AddSyncfusionBlazor();

Also I try using the Headers and it is not working

<div class="col-md-3" style="height:30%;">
			<h1>Using API</h1>
			<SfChart Width="100%" Height="100%">
				<SfDataManager Headers="@HeaderData" Url="api/EFChart/syncfApple" Adaptor="Syncfusion.Blazor.Adaptors.WebApiAdaptor">
				</SfDataManager>
				<ChartPrimaryXAxis Format="yyyy MM d" ValueType="Syncfusion.Blazor.Charts.ValueType.DateTime">
				</ChartPrimaryXAxis>
				<ChartPrimaryYAxis Title="Close Value" Interval="50" RangePadding="ChartRangePadding.Normal">
				</ChartPrimaryYAxis>
				<ChartTooltipSettings Enable="true"></ChartTooltipSettings>
				<ChartSeriesCollection>
					<ChartSeries XName="Date" YName="Value" Type="ChartSeriesType.Spline">
						<ChartSeriesAnimation Enable="true" Duration="2000" Delay="200"></ChartSeriesAnimation>
						<ChartEmptyPointSettings Mode="@Mode"></ChartEmptyPointSettings>
					</ChartSeries>
				</ChartSeriesCollection>
			</SfChart>
		</div>

and on my Initialize

protected override async Task OnInitializedAsync()
	{
		await base.OnInitializedAsync();
 
		var token = await _localStorage.GetItemAsync<string>("authToken");
 
		var accessToken = $"bearer {token}";
 
		HeaderData.Add("Authorization", accessToken);
 
		await Task.Delay(5000);
 
		ToWait = true;
	}

[Prathap Senthil]

Thanks for the Update.

In the code snippet, you mentioned that you are not creating an instance of HttpClient in the OnInitializedAsync() method. The HttpClient is responsible for making HTTP requests to your API. If you want to retrieve data from an API, you need to inject an instance of HttpClient into your component and use it to make the HTTP request. You mentioned that you tried using headers, but it is not working. It's important to ensure that the headers are set correctly and match the requirements of your API. Make sure you have the appropriate authorization headers or any other headers required by your API. Additionally, double-check the URL you are using in the Url property of SfDataManager to ensure it is correct. If your issue persists In order to better assist you, we kindly request that you provide a simple issue reproducible sample, and we will proceed further. We appreciate your cooperation, and these will help us validate the reported issue at our end and provide a solution as soon as possible.