A new experiment: Call .NET gRPC services from the browser with gRPC-Web - Printable Version +- Sick Gaming (https://www.sickgaming.net) +-- Forum: Programming (https://www.sickgaming.net/forum-76.html) +--- Forum: C#, Visual Basic, & .Net Frameworks (https://www.sickgaming.net/forum-79.html) +--- Thread: A new experiment: Call .NET gRPC services from the browser with gRPC-Web (/thread-93443.html)

A new experiment: Call .NET gRPC services from the browser with gRPC-Web - xSicKxBot - 02-01-2020 A new experiment: Call .NET gRPC services from the browser with gRPC-Web <div style="margin: 5px 5% 10px 5%;"><img src="https://www.sickgaming.net/blog/wp-content/uploads/2020/02/a-new-experiment-call-net-grpc-services-from-the-browser-with-grpc-web.png" width="58" height="58" title="" alt="" /></div><div><div class="row justify-content-center"> <div class="col-md-4"> <div><img src="https://www.sickgaming.net/blog/wp-content/uploads/2020/02/a-new-experiment-call-net-grpc-services-from-the-browser-with-grpc-web.png" width="58" height="58" alt="Avatar" class="avatar avatar-58 wp-user-avatar wp-user-avatar-58 photo avatar-default"></p> <p>James</p> </div> </div> </div> <div class="entry-meta"> <p>January 27th, 2020</p> </p></div> <p><!-- .entry-meta --> </p> <p>I’m excited to announce experimental support for gRPC-Web with .NET. gRPC-Web allows gRPC to be called from browser-based apps like JavaScript SPAs or Blazor WebAssembly apps.</p> <p>gRPC-Web for .NET promises to bring many of gRPC’s great features to browser apps:</p> <ul> <li>Strongly-typed code-generated clients</li> <li>Compact Protobuf messages</li> <li>Server streaming</li> </ul> <h2>What is gRPC-Web</h2> <p>It is impossible to implement the gRPC HTTP/2 spec in the browser because there is no browser API with enough fine-grained control over HTTP requests. <a href="https://github.com/grpc/grpc/blob/master/doc/PROTOCOL-WEB.md">gRPC-Web</a> solves this problem by being compatible with HTTP/1.1 and HTTP/2.</p> <p>gRPC-Web is not a new technology. There is a stable <a href="https://github.com/grpc/grpc-web">gRPC-Web JavaScript client</a>, and a <a href="https://blog.envoyproxy.io/envoy-and-grpc-web-a-fresh-new-alternative-to-rest-6504ce7eb880">proxy for translating between gRPC and gRPC-Web</a> for services. The new experimental packages allow an ASP.NET Core gRPC app to support gRPC-Web <strong>without</strong> a proxy, and allow the .NET Core gRPC client to call gRPC-Web services. (great for Blazor WebAssembly apps!)</p> <h2>New opportunites with gRPC-Web</h2> <ul> <li><strong>Call ASP.NET Core gRPC apps from the browser</strong> – Browser APIs can’t call gRPC HTTP/2. gRPC-Web offers a compatible alternative. <ul> <li>JavaScript SPAs</li> <li>.NET Blazor Web Assembly apps</li> </ul> </li> <li><strong>Host ASP.NET Core gRPC apps in IIS and Azure App Service</strong> – Some servers, such as IIS and Azure App Service, currently can’t host gRPC services. While this is actively being worked on, gRPC-Web offers an interesting alternative that works in every environment today.</li> <li><strong>Call gRPC from non-.NET Core platforms</strong> – Some .NET platforms <code>HttpClient</code> doesn’t support HTTP/2. gRPC-Web can be used to call gRPC services on these platforms (e.g. Blazor WebAssembly, Xamarin).</li> </ul> <p>Note that there is a small performance cost to gRPC-Web, and two gRPC features are no longer supported: client streaming and bi-directional streaming. (server streaming is still supported!)</p> <h2>Server gRPC-Web instructions</h2> <p>If you are new to gRPC in .NET, there is a <a href="https://docs.microsoft.com/aspnet/core/tutorials/grpc/grpc-start">simple tutorial to get you started</a>.</p> <p>gRPC-Web does not require any changes to your services, the only modification is startup configuration. To enable gRPC-Web with an ASP.NET Core gRPC service, add a reference to the <em>Grpc.AspNetCore.Web</em> package. Configure the app to use gRPC-Web by adding <code>AddGrpcWeb(...)</code> and <code>UseGrpcWeb()</code> in the startup file:</p> <p><em>Startup.cs</em></p> <pre><code class="csharp">public void ConfigureServices(IServiceCollection services) { services.AddGrpc(); } public void Configure(IApplicationBuilder app) { app.UseRouting(); // Add gRPC-Web middleware after routing and before endpoints app.UseGrpcWeb(); app.UseEndpoints(endpoints =&gt; { endpoints.MapGrpcService&lt;GreeterService&gt;().EnableGrpcWeb(); }); } </code></pre> <p>Some additional configuration may be required to call gRPC-Web from the browser, such as configuring the app to support CORS.</p> <h2>Client gRPC-Web instructions</h2> <p>The JavaScript gRPC-Web client has <a href="https://github.com/grpc/grpc-web/tree/master/net/grpc/gateway/examples/helloworld#write-client-code">instructions</a> for setting up a gRPC-Web client to use in browser JavaScript SPAs.</p> <p>Calling gRPC-Web with a .NET client is the same as regular gRPC, the only modification is how the channel is created. To enable gRPC-Web, add a reference to the <em>Grpc.Net.Client.Web</em> package. Configure the channel to use the <code>GrpcWebHandler</code>:</p> <pre><code class="csharp">// Configure a channel to use gRPC-Web var handler = new GrpcWebHandler(GrpcWebMode.GrpcWebText, new HttpClientHandler()); var channel = GrpcChannel.ForAddress("https://localhost:5001", new GrpcChannelOptions { HttpClient = new HttpClient(handler) }); var client = Greeter.GreeterClient(channel); var response = await client.SayHelloAsync(new GreeterRequest { Name = ".NET" }); </code></pre> <p>To see gRPC-Web with .NET in action, take a moment to read a great blog post written by Steve Sanderson that uses <a href="https://blog.stevensanderson.com/2020/01/15/2020-01-15-grpc-web-in-blazor-webassembly/">gRPC-Web in Blazor WebAssembly</a>.</p> <h2>Try gRPC-Web with ASP.NET Core today</h2> <p>Preview packages are on NuGet:</p> <p>Documentation for using gRPC-Web with .NET Core can be found <a href="https://docs.microsoft.com/aspnet/core/grpc/browser">here</a>.</p> <p>gRPC-Web for .NET is an experimental project, not a committed product. We want to test that our approach to implementing gRPC-Web works, and get feedback on whether this approach is useful to .NET developers compared to the traditional way of setting up gRPC-Web via a proxy. Please add your feedback here or at the <a href="https://github.com/grpc/grpc-dotnet">https://github.com/grpc/grpc-dotnet</a> to ensure we build something that developers like and are productive with.</p> <p>Thanks!</p> <div class="authorinfoarea"> <div><img src="https://www.sickgaming.net/blog/wp-content/uploads/2020/02/a-new-experiment-call-net-grpc-services-from-the-browser-with-grpc-web-1.png" width="96" height="96" alt="Avatar" class="avatar avatar-96 wp-user-avatar wp-user-avatar-96 photo avatar-default"></div> </p></div> </div> https://www.sickgaming.net/blog/2020/01/27/a-new-experiment-call-net-grpc-services-from-the-browser-with-grpc-web/