gRPC-Web code-first sample

Author: hakenr

BlazorGrpcWebCodeFirst/Client/BlazorGrpcWebCodeFirst.Client.csproj

@@ -6,10 +6,13 @@
   </PropertyGroup>
 
   <ItemGroup>
+    <PackageReference Include="Grpc.Net.Client" Version="2.28.0" />
+    <PackageReference Include="Grpc.Net.Client.Web" Version="2.28.0-pre2" />
     <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly" Version="3.2.0-preview3.20168.3" />
     <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Build" Version="3.2.0-preview3.20168.3" PrivateAssets="all" />
     <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.DevServer" Version="3.2.0-preview3.20168.3" PrivateAssets="all" />
     <PackageReference Include="Microsoft.AspNetCore.Blazor.HttpClient" Version="3.2.0-preview3.20168.3" />
+    <PackageReference Include="protobuf-net.Grpc" Version="1.0.37" />
   </ItemGroup>
   <ItemGroup>
     <ProjectReference Include="..\Shared\BlazorGrpcWebCodeFirst.Shared.csproj" />

BlazorGrpcWebCodeFirst/Client/Pages/Index.razor

@@ -1,7 +1,33 @@
 @page "/"
+@using BlazorGrpcWebCodeFirst.Shared;
+@using ProtoBuf.Grpc.Client;
 
-<h1>Hello, world!</h1>
+<EditForm Model="@request" OnValidSubmit="Submit">
+	<InputText @bind-Value="request.Text" />
+	<InputNumber @bind-Value="request.Value" />
+	<input type="submit" value="Submit" />
+</EditForm>
 
-Welcome to your new app.
+@if (result != null)
+{
+	@result.NewText
+	<br />
+	@result.NewValue
+	<br />
+}
 
-<SurveyPrompt Title="How is Blazor working for you?" />
+@code
+{
+	MyServiceRequest request = new MyServiceRequest() { Text = "Hello world", Value = 42 };
+	MyServiceResult result;
+
+	async Task Submit()
+	{
+		var handler = new Grpc.Net.Client.Web.GrpcWebHandler(Grpc.Net.Client.Web.GrpcWebMode.GrpcWeb, new HttpClientHandler());
+		using (var channel = Grpc.Net.Client.GrpcChannel.ForAddress("https://localhost:44383/", new Grpc.Net.Client.GrpcChannelOptions() { HttpClient = new HttpClient(handler) }))
+		{
+			var testFacade = channel.CreateGrpcService<IMyService>();
+			this.result = await testFacade.DoSomething(request);
+		}
+	}
+}

BlazorGrpcWebCodeFirst/Server/BlazorGrpcWebCodeFirst.Server.csproj

@@ -6,7 +6,9 @@
   </PropertyGroup>
 
   <ItemGroup>
+    <PackageReference Include="Grpc.AspNetCore.Web" Version="2.28.0-pre2" />
     <PackageReference Include="Microsoft.AspNetCore.Components.WebAssembly.Server" Version="3.2.0-preview3.20168.3" />
+    <PackageReference Include="protobuf-net.Grpc.AspNetCore" Version="1.0.37" />
   </ItemGroup>
 
   <ItemGroup>

BlazorGrpcWebCodeFirst/Server/Services/MyService.cs

@@ -0,0 +1,21 @@
+using BlazorGrpcWebCodeFirst.Shared;
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace BlazorGrpcWebCodeFirst.Server.Services
+{
+	public class MyService : IMyService
+	{
+		public Task<MyServiceResult> DoSomething(MyServiceRequest request)
+		{
+			return Task.FromResult(new MyServiceResult()
+			{
+				NewText = request.Text + " from server",
+				NewValue = request.Value + 1
+			});
+		}
+	}
+}

BlazorGrpcWebCodeFirst/Server/Startup.cs

@@ -6,6 +6,9 @@
 using Microsoft.Extensions.DependencyInjection;
 using Microsoft.Extensions.Hosting;
 using System.Linq;
+using ProtoBuf.Grpc.Server;
+using BlazorGrpcWebCodeFirst.Server.Services;
+using BlazorGrpcWebCodeFirst.Shared;
 
 namespace BlazorGrpcWebCodeFirst.Server
 {
@@ -22,6 +25,14 @@ public Startup(IConfiguration configuration)
 		// For more information on how to configure your application, visit https://go.microsoft.com/fwlink/?LinkID=398940
 		public void ConfigureServices(IServiceCollection services)
 		{
+			services.AddCodeFirstGrpc(config =>
+			{
+				config.ResponseCompressionLevel = System.IO.Compression.CompressionLevel.Optimal;
+			});
+			services.AddGrpcWeb(options =>
+			{
+				options.GrpcWebEnabled = true;
+			});
 
 			services.AddControllersWithViews();
 		}
@@ -47,8 +58,12 @@ public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
 
 			app.UseRouting();
 
+			app.UseGrpcWeb();
+
 			app.UseEndpoints(endpoints =>
 			{
+				endpoints.MapGrpcService<MyService>();
+
 				endpoints.MapControllers();
 				endpoints.MapFallbackToFile("index.html");
 			});

BlazorGrpcWebCodeFirst/Shared/BlazorGrpcWebCodeFirst.Shared.csproj

@@ -1,7 +1,11 @@
-<Project Sdk="Microsoft.NET.Sdk">
+<Project Sdk="Microsoft.NET.Sdk">
 
   <PropertyGroup>
     <TargetFramework>netstandard2.1</TargetFramework>
   </PropertyGroup>
 
+  <ItemGroup>
+    <PackageReference Include="System.ServiceModel.Primitives" Version="4.7.0" />
+  </ItemGroup>
+
 </Project>

BlazorGrpcWebCodeFirst/Shared/IMyService.cs

@@ -0,0 +1,16 @@
+using System;
+using System.Collections.Generic;
+using System.Linq;
+using System.ServiceModel;
+using System.Text;
+using System.Threading.Tasks;
+
+namespace BlazorGrpcWebCodeFirst.Shared
+{
+    [ServiceContract]
+	public interface IMyService
+    {
+		Task<MyServiceResult> DoSomething(MyServiceRequest request);
+        
+    }
+}

BlazorGrpcWebCodeFirst/Shared/MyServiceRequest.cs

@@ -0,0 +1,14 @@
+using System.Runtime.Serialization;
+
+namespace BlazorGrpcWebCodeFirst.Shared
+{
+	[DataContract]
+	public class MyServiceRequest
+	{
+		[DataMember(Order = 1)]
+		public string Text { get; set; }
+
+		[DataMember(Order = 2)]
+		public int Value { get; set; }
+	}
+}

BlazorGrpcWebCodeFirst/Shared/MyServiceResult.cs

@@ -0,0 +1,14 @@
+using System.Runtime.Serialization;
+
+namespace BlazorGrpcWebCodeFirst.Shared
+{
+	[DataContract]
+	public class MyServiceResult
+	{
+		[DataMember(Order = 1)]
+		public string NewText { get; set; }
+
+		[DataMember(Order = 2)]
+		public int NewValue { get; set; }
+	}
+}