Skip to content
New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Jump to bottom

JSInterop Streaming implementation to allow for larger objects over SignalR #247

Merged
merged 4 commits into from
Sep 18, 2024
Merged

JSInterop Streaming implementation to allow for larger objects over SignalR #247

Show file tree
Hide file tree
Changes from all commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
495cf04
Added Streaming provider to support storing objects larger than the S…
CoreyHayward Sep 13, 2024
98cae1b
updated readme to include streaming use
CoreyHayward Sep 14, 2024
a5c7dbe
cleanup
CoreyHayward Sep 14, 2024
bc70d25
Merge branch 'main' into main
chrissainty Sep 18, 2024
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
21 changes: 21 additions & 0 deletions README.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -79,6 +79,27 @@ builder.Services.AddBlazoredLocalStorageAsSingleton();

This method will not work with Blazor Server applications as Blazor's JS interop services are registered as Scoped and cannot be injected into Singletons.

### Using JS Interop Streaming
When using interactive components in server-side apps JS Interop calls are limited to the configured SignalR message size (default: 32KB).
Therefore when attempting to store or retrieve an object larger than this in LocalStorage the call will fail with a SignalR exception.

The following streaming implementation can be used to remove this limit (you will still be limited by the browser).

Register the streaming local storage service

```c#
public void ConfigureServices(IServiceCollection services)
{
services.AddBlazoredLocalStorageStreaming();
}
```

Add the JavaScript file to your _App.razor_

```html
<script src="_content/Blazored.LocalStorage/Blazored.LocalStorage.js"></script>
```

## Usage (Blazor WebAssembly)
To use Blazored.LocalStorage in Blazor WebAssembly, inject the `ILocalStorageService` per the example below.

Expand Down
1 change: 1 addition & 0 deletions samples/InteractiveServer/Components/App.razor
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -15,6 +15,7 @@
<body>
<Routes @rendermode="InteractiveServer"/>
<script src="_framework/blazor.web.js"></script>
<script src="_content/Blazored.LocalStorage/Blazored.LocalStorage.js"></script>
</body>

</html>
3 changes: 3 additions & 0 deletions samples/InteractiveServer/Program.cs
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -11,7 +11,10 @@
.AddInteractiveServerComponents();

builder.Services.Replace(ServiceDescriptor.Scoped<IJsonSerializer, NewtonSoftJsonSerializer>());

builder.Services.AddBlazoredLocalStorage();
// Use the below to enable streaming of objects with local storage
//builder.Services.AddBlazoredLocalStorageStreaming();

var app = builder.Build();

Expand Down
4 changes: 4 additions & 0 deletions src/Blazored.LocalStorage/Blazored.LocalStorage.csproj
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -65,4 +65,8 @@
</AssemblyAttribute>
</ItemGroup>

<ItemGroup>
<Content Update="wwwroot\Blazored.LocalStorage.js"></Content>
</ItemGroup>

</Project>
Loading
Loading