gRPC-Web Nedir? Bilmeniz Gereken Her Şey

Bu kapsamlı rehberde gRPC-Web'i, faydalarını ve nasıl başlanacağını keşfedin. Web uygulamaları ve gRPC servisleri arasındaki iletişimi ve Apidog gibi araçların API geliştirme sürecini nasıl kolaylaştırdığını öğrenin.

Efe Demir

Efe Demir

5 June 2025

gRPC-Web Nedir? Bilmeniz Gereken Her Şey

Merhaba! Web geliştirme alanındaki en son trendleri takip ediyorsanız, muhtemelen gRPC-Web terimini duymuşsunuzdur. Belki de projelerinize entegre etmeniz gereken bir şey olup olmadığını merak eden bir geliştiricisinizdir. Ya da sadece bu kadar tantananın ne hakkında olduğunu merak ediyorsunuzdur. Her iki durumda da doğru yerdesiniz. Gelin, gRPC-Web dünyasına dalalım ve bu yazının sonunda, ne olduğu, neden faydalı olduğu ve nasıl kullanmaya başlayabileceğiniz konusunda sağlam bir anlayışa sahip olacaksınız.

gRPC-Web Nedir?

Öncelikle: gRPC-Web tam olarak nedir? Temel olarak, gRPC-Web, web uygulamalarının gRPC hizmetleriyle iletişim kurmasını sağlayan bir JavaScript istemci kütüphanesidir. İletileri taşımak için HTTP/2 kullanan açık kaynaklı bir çerçeve olan gRPC'nin (Google Remote Procedure Call) işlevselliğini genişletir. gRPC, ölçeklenebilir ve verimli API'ler oluşturmayı kolaylaştırmak için tasarlanmıştır.

gRPC web

gRPC'ye Hızlı Bir Bakış

gRPC-Web'e daha derinlemesine dalmadan önce, gRPC'nin kendisine hızlıca bir göz atalım. gRPC, Google tarafından geliştirildi ve mikro hizmetler iletişimi için yaygın olarak kullanılıyor. HTTP/2, Protocol Buffers (protobufs) kullanır ve kimlik doğrulama, yük dengeleme ve daha fazlası gibi özellikler sağlar. gRPC ile, hizmet yöntemlerinizi ve mesaj türlerinizi protokol arabellekleri kullanarak tanımlarsınız, bu da hem istemci hem de sunucu için kod oluşturur.

Neden gRPC-Web?

Peki, zaten gRPC'miz varken neden gRPC-Web'e ihtiyacımız var? Cevap, tarayıcıların sınırlamalarında yatıyor. gRPC, sunucudan sunucuya iletişim için mükemmel olsa da, gRPC'nin kullandığı HTTP/2 fragmanlarını desteklemedikleri için doğrudan tarayıcılarla çalışmaz. İşte gRPC-Web devreye giriyor. gRPC hizmetlerinin web uygulamaları tarafından tüketilmesini sağlayan bir köprü görevi görür.

gRPC

gRPC-Web'in Temel Faydaları

gRPC-Web'in ne olduğunu bildiğimize göre, neden kullanmak isteyebileceğinizi inceleyelim. İşte bazı temel faydalar:

1. Performans

gRPC-Web'in öne çıkan özelliklerinden biri performanstır. HTTP/2 ve Protocol Buffers kullanması sayesinde, gRPC-Web çok sayıda isteği verimli bir şekilde işleyebilir. Bu, gerçek zamanlı veri alışverişi gerektiren veya birden fazla eşzamanlı bağlantıyı yönetmesi gereken uygulamalar için idealdir.

2. Kullanım Kolaylığı

gRPC-Web ile, hem web istemcileriniz hem de arka uç hizmetleriniz için aynı protokol arabellek tanımlarından yararlanabilirsiniz. Bu, uygulama yığınınızda tutarlılığı koruyabileceğiniz ve yazmanız gereken örnek kod miktarını azaltabileceğiniz anlamına gelir. Ayrıca, Apidog gibi araçlarla, API geliştirme sürecinizi daha da kolaylaştırabilirsiniz.

3. Ölçeklenebilirlik

gRPC-Web HTTP/2 kullandığından, çoklama gibi özelliklerden yararlanır, bu da birden fazla isteğin tek bir bağlantı üzerinden gönderilmesini sağlar. Bu, birden fazla bağlantı oluşturma ve yönetmeyle ilişkili yükü azaltmaya yardımcı olur ve uygulamanızı daha ölçeklenebilir hale getirir.

4. Birlikte Çalışabilirlik

gRPC-Web, web uygulamalarınız ve gRPC hizmetleriniz arasında sorunsuz iletişim sağlar. Bu, ek REST API'leri oluşturmanıza gerek kalmadan, mevcut gRPC tabanlı mikro hizmetler mimarinizle etkileşim kurabilen modern web uygulamaları oluşturabileceğiniz anlamına gelir.

gRPC-Web'e Başlarken

Tamam, yeterince teori! Ellerimizi kirletelim ve projelerinizde gRPC-Web'i nasıl kullanmaya başlayabileceğinizi görelim.

Önkoşullar

Başlamadan önce, aşağıdakilerin yüklü olduğundan emin olun:

Adım 1: Hizmetinizi Tanımlayın

İlk adım, protokol arabelleklerini kullanarak gRPC hizmetinizi tanımlamaktır. Hizmet ve mesaj tanımlarınızla bir .proto dosyası oluşturun. Örneğin:

syntax = "proto3";

package example;

service HelloService {
  rpc SayHello (HelloRequest) returns (HelloResponse);
}

message HelloRequest {
  string name = 1;
}

message HelloResponse {
  string message = 1;
}

Adım 2: İstemci ve Sunucu Kodunu Oluşturun

Ardından, istemci ve sunucu kodunu oluşturmak için Protocol Buffers derleyicisini kullanın. Aşağıdaki komutu çalıştırın:

protoc -I=. --js_out=import_style=commonjs,binary:. --grpc-web_out=import_style=commonjs,mode=grpcwebtext:. example.proto

Bu komut, gRPC-Web istemciniz için gerekli JavaScript dosyalarını oluşturur.

Adım 3: Sunucunuzu Kurun

Şimdi, istekleri işlemek için bir gRPC sunucusu kurun. İşte Node.js kullanarak bir örnek:

const grpc = require('@grpc/grpc-js');
const protoLoader = require('@grpc/proto-loader');

const packageDefinition = protoLoader.loadSync('example.proto', {});
const exampleProto = grpc.loadPackageDefinition(packageDefinition).example;

function sayHello(call, callback) {
  callback(null, { message: `Hello, ${call.request.name}!` });
}

const server = new grpc.Server();
server.addService(exampleProto.HelloService.service, { sayHello: sayHello });
server.bindAsync('0.0.0.0:50051', grpc.ServerCredentials.createInsecure(), () => {
  server.start();
});

Adım 4: İstemcinizi Kurun

Son olarak, web istemcinizi gRPC sunucusuyla iletişim kuracak şekilde ayarlayın. İşte React kullanarak bir örnek:

import React, { useState } from 'react';
import { HelloServiceClient } from './example_grpc_web_pb';
import { HelloRequest } from './example_pb';

const client = new HelloServiceClient('http://localhost:8080');

function App() {
  const [response, setResponse] = useState('');

  const sayHello = () => {
    const request = new HelloRequest();
    request.setName('World');

    client.sayHello(request, {}, (err, response) => {
      if (err) {
        console.error(err);
      } else {
        setResponse(response.getMessage());
      }
    });
  };

  return (
    <div>
      <button onClick={sayHello}>Say Hello</button>
      <p>{response}</p>
    </div>
  );
}

export default App;

Adım 5: Bir Proxy Kurun

gRPC-Web HTTP/2 kullandığından, istekleri dönüştürmek için bir proxy kurmanız gerekir. Bu amaçla grpc-web proxy'sini kullanabilirsiniz. İşte nasıl yapılacağı:

docker run -d -p 8080:8080 --network host \
  --name grpc-web-proxy \
  envoyproxy/envoy:v1.18.3 -c /etc/envoy-config.yaml

Aşağıdaki içeriğe sahip bir envoy-config.yaml dosyası oluşturun:

static_resources:
  listeners:
    - address:
        socket_address:
          address: 0.0.0.0
          port_value: 8080
      filter_chains:
        - filters:
            - name: envoy.filters.network.http_connection_manager
              typed_config:
                "@type": type.googleapis.com/envoy.extensions.filters.network.http_connection_manager.v3.HttpConnectionManager
                codec_type: AUTO
                stat_prefix: ingress_http
                route_config:
                  name: local_route
                  virtual_hosts:
                    - name: local_service
                      domains: ["*"]
                      routes:
                        - match:
                            prefix: "/"
                          route:
                            cluster: grpc_service
                http_filters:
                  - name: envoy.filters.http.grpc_web
                  - name: envoy.filters.http.router
  clusters:
    - name: grpc_service
      connect_timeout: 0.25s
      type: logical_dns
      lb_policy: round_robin
      http2_protocol_options: {}
      load_assignment:
        cluster_name: grpc_service
        endpoints:
          - lb_endpoints:
              - endpoint:
                  address:
                    socket_address:
                      address: 127.0.0.1
                      port_value: 50051

gRPC-Web Geliştirmenizi Geliştirecek Araçlar

gRPC-Web'i kurmak oldukça basit olsa da, geliştirme sürecini daha da sorunsuz hale getirebilecek araçlar vardır. Bu tür bir araç Apidog'dur. Apidog, API'lerinizi zahmetsizce tasarlamanıza, test etmenize ve izlemenize yardımcı olan bir API yönetim aracıdır. gRPC'yi destekler ve bu da onu gRPC-Web geliştirme için mükemmel bir seçim haline getirir. Apidog ile şunları yapabilirsiniz:

Apidog Official website

Apidog'u gRPC-Web ile birlikte kullanmak, geliştirme iş akışınızı önemli ölçüde kolaylaştırabilir ve sağlam, güvenilir API'ler oluşturduğunuzdan emin olmanızı sağlar.

Apidog ile gRPC-Web'i Test Etmek İçin Adım Adım Kılavuz

Adım 1: Apidog'u Kurun

Yeni Bir Proje Oluşturun: Apidog'u açın, "+ Yeni proje" düğmesine tıklayarak yeni bir proje oluşturun. İşleri düzenli tutmaya yardımcı olmak için projenize bir ad ve açıklama verin.

Create gRPC project on Apidog

Adım 2: gRPC Hizmetinizi Tanımlayın

.proto Dosyanızı İçe Aktarın: Mevcut .proto dosyanızı içe aktarabilir veya gRPC hizmetinizi manuel olarak tanımlayabilirsiniz. İçe aktarmak için, "İçe Aktar" düğmesine tıklayın ve .proto dosyanızı seçin. Apidog, dosyayı otomatik olarak ayrıştıracak ve gerekli API tanımlarını oluşturacaktır.

Import Your .proto File

Adım 3: gRPC-Web Uç Noktanızı Yapılandırın

Uç Noktayı Ayarlayın: .proto dosyanızı içe aktardıktan sonra, gRPC-Web sunucunuzun URL'sini belirterek gRPC-Web uç noktanızı yapılandırın. Örneğin, sunucunuz http://localhost:8080 üzerinde çalışıyorsa, bu URL'yi uç nokta yapılandırmasına girin.

Configure Your gRPC-Web Endpoint

Apidog, .proto dosyanızda tanımlanan tüm hizmet yöntemlerini listeleyecektir. Test etmek istediğiniz yöntemleri seçebilir ve bunları API'nize ekleyebilirsiniz.

gRPC-Web için Gerçek Dünya Kullanım Örnekleri

gRPC-Web'in nerede parladığına dair daha iyi bir fikir vermek için, işte bazı gerçek dünya kullanım örnekleri:

1. Gerçek Zamanlı Uygulamalar

Sohbet uygulamaları veya canlı panolar gibi gerçek zamanlı veri güncellemeleri gerektiren uygulamalar, gRPC-Web'den büyük ölçüde yararlanabilir. Verimli iletişim protokolü, düşük gecikme süresi ve yüksek performans sağlar.

2. Mikro Hizmetler Mimarileri

Bir mikro hizmetler mimarisiyle çalışıyorsanız, gRPC-Web, web uygulamalarınızın arka uç hizmetleriyle sorunsuz bir şekilde iletişim kurmasına yardımcı olabilir. Bu, tüm yığınınızda tutarlı bir iletişim protokolü korumanıza olanak tanır.

3. Veri Yoğun Uygulamalar

Video akış hizmetleri veya büyük veri analitik platformları gibi büyük hacimli verileri işlemesi gereken uygulamalar, gRPC-Web'in verimli veri serileştirme ve taşıma yeteneklerinden yararlanabilir.

4. IoT Platformları

IoT platformları genellikle cihazlar ve sunucular arasında verimli ve ölçeklenebilir iletişim gerektirir. gRPC-Web, bu etkileşimleri yönetmek için sağlam bir çözüm sunar.

Sonuç

Ve işte karşınızda—gRPC-Web'e kapsamlı bir genel bakış. Ne olduğunu, neden faydalı olduğunu ve projelerinizde nasıl kullanmaya başlayabileceğinizi ele aldık. Performans avantajları, kullanım kolaylığı ve ölçeklenebilirliği ile gRPC-Web, modern web geliştirme için güçlü bir araçtır. İster gerçek zamanlı uygulamalar, ister mikro hizmetler mimarileri veya veri yoğun platformlar oluşturuyor olun, gRPC-Web sizi korur. Ve Apidog gibi araçlarla, API geliştirme sürecinizi kolaylaştırabilir ve hizmetlerinizin sorunsuz çalıştığından emin olabilirsiniz.

Öyleyse, ne bekliyorsunuz? gRPC-Web'e dalın ve yeni nesil web uygulamaları oluşturmaya başlayın!

Explore more

Fathom-R1-14B: Hindistan'dan Gelişmiş Yapay Zeka Muhakeme Modeli

Fathom-R1-14B: Hindistan'dan Gelişmiş Yapay Zeka Muhakeme Modeli

Yapay zeka hızla gelişiyor. FractalAIResearch/Fathom-R1-14B, 14.8 milyar parametreyle matematik ve genel akıl yürütmede başarılı.

5 June 2025

Mistral Code: İşletmeler için En Özelleştirilebilir Yapay Zeka Destekli Kodlama Asistanı

Mistral Code: İşletmeler için En Özelleştirilebilir Yapay Zeka Destekli Kodlama Asistanı

Mistral Code'u keşfedin: Kurumsal kullanıma özel, en özelleştirilebilir yapay zeka destekli kodlama asistanı.

5 June 2025

Claude Code'un 2025'te Yapay Zeka Kodlamasını Nasıl Dönüştürdüğü

Claude Code'un 2025'te Yapay Zeka Kodlamasını Nasıl Dönüştürdüğü

Claude Code, 2025'te yapay zeka destekli kodlamayı nasıl devrimleştiriyor? Özelliklerini, kullanımını ve Windsurf kısıtlamalarından sonra neden popüler olduğunu öğrenin. Geliştiriciler için okunması gereken!

5 June 2025

API Tasarım-Öncelikli Yaklaşımı Apidog'da Uygulayın

API'leri oluşturmanın ve kullanmanın daha kolay yolunu keşfedin