Skip to content
Merged
1 change: 1 addition & 0 deletions blazor-toc.html
Original file line number Diff line number Diff line change
Expand Up @@ -4159,6 +4159,7 @@
<li> <a href="/blazor/rich-text-editor/enter-key">Enter Key Configuration</a></li>
<li> <a href="/blazor/rich-text-editor/undo-redo-manager">Undo Redo Manager</a></li>
<li> <a href="/blazor/rich-text-editor/import-and-export">Import/Export</a></li>
<li> <a href="/blazor/rich-text-editor/http-client-instance">Http Client</a></li>
<li> <a href="/blazor/rich-text-editor/exec-command">Execute Command</a></li>
<li> <a href="/blazor/rich-text-editor/style">Style and Appearance</a></li>
<li> <a href="/blazor/rich-text-editor/style-encapsulation">Style Encapsulation</a></li>
Expand Down
63 changes: 63 additions & 0 deletions blazor/rich-text-editor/http-client-instance.md
Original file line number Diff line number Diff line change
@@ -0,0 +1,63 @@
---
layout: post
title: HttpClientInstance in Blazor RichTextEditor Component | Syncfusion
description: Checkout and learn here all about HttpClientInstance in Syncfusion Blazor RichTextEditor component and much more.
platform: Blazor
control: RichTextEditor
documentation: ug
---

# HttpClientInstance in Blazor RichTextEditor Component

The Rich Text Editor component in Blazor enables you to utilize the `HttpClientInstance` property to append the custom HttpClient instance to all file upload and download requests. This approach offers flexibility in managing authentication and custom request configurations for Word Import, Word and PDF Export and image/audio/video insertions.

The following example illustrates how to configure the Rich Text Editor component with HttpClient in a Blazor application.

```razor
@using Syncfusion.Blazor.RichTextEditor
@inject HttpClient httpClient

<SfRichTextEditor HttpClientInstance="@httpClient">
<RichTextEditorImageSettings SaveUrl="https://your_api.com/upload/image">
</RichTextEditorImageSettings>
<RichTextEditorAudioSettings SaveUrl="https://your_api.com/upload/audio">
</RichTextEditorAudioSettings>
<RichTextEditorVideoSettings SaveUrl="https://your_api.com/upload/video">
</RichTextEditorVideoSettings>
</SfRichTextEditor>

@code {
protected override async Task OnInitializedAsync()
{
// Adding authorization header to HTTP client
httpClient.DefaultRequestHeaders.Add("Authorization_1", "syncfusion");
await base.OnInitializedAsync();
}
}
```

## Program.cs

```csharp
using Syncfusion.Blazor;

var builder = WebApplication.CreateBuilder(args);

// Add services to the container.
builder.Services.AddRazorComponents()
.AddInteractiveServerComponents();
builder.Services.AddSyncfusionBlazor();
builder.Services.AddScoped(sp =>
{
var httpClient = new HttpClient
{
BaseAddress = new Uri("https://your_api.com/")
};

// Add custom header
httpClient.DefaultRequestHeaders.Add("Custom-Header", "YourCustomValue");
return httpClient;
});
var app = builder.Build();

```