gRPC 소개

gRPC는 최초로 Google에서 개발한 최신 RPC 프레임워크입니다.이것은 프로토콜 버퍼를 인터페이스 설명 언어로 사용하고protobuf는 서열화된 구조화된 데이터의 메커니즘이다.프로토 파일에서 서비스와 데이터 구조를 정의하기만 하면 gRPC는 자동으로 당신의 서비스에 다양한 언어와 플랫폼으로 클라이언트와 서버 캐시를 생성합니다.profobuf를 사용하면 JSON이 아닌 2진법으로 통신할 수 있습니다. 이로써 gRPC는 더욱 빠르고 신뢰할 수 있습니다.gRPC의 다른 관건적인 기능은 양방향 흐름과 흐름 제어, 막힘 또는 비막힘 귀속과 인증 삽입을 포함한다.gRPC는 HTTP/2를 사용합니다. 다중 복용을 사용합니다. 다중 복용을 통해 클라이언트와 서버는 하나의 하위 TCP 연결에서 여러 개의 흐름을 시작할 수 있습니다. gRPC에 대한 더 많은 정보here를 읽을 수 있습니다.

gRPC 네트워크

gRPC 웹은javascript 라이브러리로 웹 브라우저를 통해 gRPC 서비스와 직접 대화할 수 있습니다.gRPC 웹 클라이언트는 전용 인터페이스 에이전트(특사 에이전트)를 통해 gRPC 서비스에 연결됩니다. 우리의 경우 이 에이전트는 docker 서비스로 같은 서버 기기에서 실행됩니다. 이 서버 기기는 gRPC(HTTP/2)와 브라우저 통신(HTTP/1.1)을 연결합니다.
이것은 게임 규칙을 바꾸었다. 처음에 우리는 gRPC를 서비스나 마이크로서비스 간의 통신에만 사용할 수 있고 클라이언트는 REST API 호출로만 데이터에 접근할 수 있었지만 지금은 gRPC를 사용하여 전체 응용 프로그램에서 gRPC의 기능을 활용하고 REST를 제거할 수 있다

왜 gRPC가 REST보다 좋은가

REST와 gRPC 간의 주요 차이점은

로드 유형, REST는 JSON, gRPC는 Protobuff

전송 프로토콜, REST는 HTTP/1.1, gRPC는 HTTP/2

우리는 gRPC에서 Protobuf를 사용하기 때문에 동사(GET, PUT)와 일등에 관심을 가질 필요가 없다. 또한 모든 데이터 모델에 대해 작성해야 하는 서열화 코드를 줄이고 gRPC 프레임워크에서 생성된 메모리를 책임진다.
현재 gRPC에서 HTTP/2를 사용하고 있기 때문에 요청과 응답을 유동화하고 지연 문제, 회선 막힘, TCP 연결의 복잡성을 제거할 수 있습니다.

필요한 도구 및 소프트웨어

Protoc v3.6.1-Protobuf 컴파일러로 클라이언트와 서버 메모리 생성에 사용됩니다.

go v1.11 — 우리 서버는 golang.

로 구축될 것이다

노드 — Vue 구축JS 프런트엔드 응용 프로그램.

Docker — 특사 에이전트를 실행합니다.

폴더 구조

적용 대상 주제 개요

원형 파일 만들기

서버 스텁 생성 및 gRPC 서비스 프로세서 쓰기

gRPC 서비스 만들기

특사 대리 서비스 창설

클라이언트 메모리 및 클라이언트 응용 프로그램 만들기

1. Proto 파일

자, 이제 코드로 넘어가겠습니다. 원본 파일은 우리의 gRPC 응용 프로그램의 핵심입니다. 이 파일 gRPC 프레임워크를 사용하여 클라이언트와 서버 캐시를 생성합니다. 우리는 우리의 데이터 모델과 이 데이터 모델을 사용하는 서비스를 정의합니다. 이 파일은 우리의 프로젝트 루트 디렉터리에 있는todo 폴더에 놓을 것입니다.

파일의 첫 번째 줄은 우리가 사용할 프로토 버퍼의 버전을 지정합니다. 두 번째 줄에서 지정한 같은 패키지 이름도 생성된 go 파일에서 사용됩니다.todo 서비스에서 우리는 세 가지 RPC 방법addTodo,deleteTodo,getTodos가 있는데 그 요청 유형은 매개 변수이고 응답 유형은 RPC 방법의 반환 유형이다.모든 메시지 형식에서, 우리는 인코딩과 디코딩에 사용할 유일한 태그인 =1, =2와 같은 태그를 지정합니다.repeated 키워드는 이 필드가 임의의 횟수를 반복할 수 있음을 나타냅니다

2. 서버 스텁 파일 생성

우리의 원형 파일을 만든 다음 단계는 서버 캐시를 생성하는 것입니다. 우리는 그것을 사용하여 우리의 gRPC 서버를 만들 것입니다.프로젝트의 루트 디렉터리에서 다음 명령을 사용합니다

protoc -I todo/ todo/todo.proto --go_out=plugins=grpc:todo

위의 명령에서 출력 폴더를 todo/로 지정하고 입력 파일을 todo/todo로 지정합니다.생성된 메모리 파일에 플러그인 이름과 패키지 이름을 지정합니다.상술한 명령을 실행하면 todo라는 새 파일을 찾을 수 있습니다.pb.todo 폴더로 들어가기

현재 프로토콜 파일에 지정된 모든 RPC 방법을 위한 프로세서 방법을 작성해야 합니다. 새 프로세서를 만들 것입니다.동일한 대기사항 폴더로 이동

간단하게 말하자면, 나는 데이터베이스를 사용하여 우리의 todo를 저장하고 검색하지 않을 것이다. 왜냐하면 우리는 같은 생성된 todo 패키지에서 생성된 메모리 파일의 요청과 응답 데이터 형식을 사용할 수 있기 때문이다.우리의 모든 처리 방법은 서버 구조에 귀속되어 있습니다

addTodohandler 함수에서 저는 UUID 패키지를 사용하여 모든 todo에 유일한 ID를 생성하고 todo 대상을 생성한 다음 서버 구조의 todo 목록에 추가합니다

GetTodoshandler 함수에서 서버 구조 내의 Todos 목록으로 되돌아갈 뿐

deleteTodo 프로세서 함수에서 저는 todo id를 사용하여 검색과 삭제 작업을 수행하고 서버 구조의 todo 목록을 업데이트합니다.

3. Hook up the gRPC server

현재 우리는 모든 프로세서를 연결하고 gRPC 서버를 시작해야 합니다. 우리는 새로운 파일 서버를 만들 것입니다.우리 프로젝트의 근본에 깊이 들어가기

위의 파일에서, 우리는 포트 14586에 새 서버와 비어 있는 todo 서버 실례, 그리고 새로운 gRPC 서버를 만들고 있습니다. 우리는 Register Todo Services를 사용하여 새로 만든 gRPC 서버에 우리의 todo 서비스를 등록하고 창설된 gRPC 서버에 서비스를 제공하고 있습니다.

상술한 파일을 실행하려면 gorun 서버를 사용하십시오.gRPC 서버를 시작할 프로젝트의 루트부터

4. Envoy proxy setup

특사 에이전트는 docker 서비스가 될 것입니다. 저희 서버와 클라이언트 응용 프로그램 사이에 위치하고 다음은 특사 에이전트 docker와 프로필입니다

Todo gRPC 서비스는 포트 14586에서 실행되며, En 특사는 8080에서 HTTP 1.1 트래픽을 차단하고 이를 HTTP2(gRPC)로 14586으로 재지정합니다.

Docker 컨테이너 구축

sudo -E docker build -t envoy:v1 .

특사 에이전트를 시작하려면docker 용기를 사용하십시오

sudo docker run  -p 8080:8080 --net=host  envoy:v1

5. Vue.js frontend app

현재 유일하게 부족한 부분은 클라이언트입니다. 우리는 Vue를 사용할 것입니다.js 프레임워크는 우리의 클라이언트 웹 응용 프로그램을 만들기 위해 간단하게 보기 위해 TODO를 추가하고 삭제하는 방법

Vue를 생성합니다.vuecli의 js 프로젝트 사용하기

vue create todo-client

프로젝트의 루트 디렉터리에 todoclient라는 새 폴더를 만듭니다. 클라이언트 메모리

다음 명령을 사용하여 클라이언트 캐시 만들기

protoc --proto_path=todo --js_out=import_style=commonjs,binary:todo-client/src/ --grpc-web_out=import_style=commonjs,mode=grpcwebtext:todo-client/src/ todo/todo.proto

위의 명령은 두 개의 파일 todo\u pb를 만듭니다.js 및 todo_grpc_web_pb.js는 src 폴더에 있습니다.간단하게 말하자면, 나는 gRPC 서비스 클라이언트를 사용하는 부분만 토론할 것이다

import { addTodoParams, getTodoParams, deleteTodoParams } from "./todo_pb";
import { todoServiceClient } from "./todo_grpc_web_pb";

클라이언트 응용 프로그램의 todo 구성 요소에서 todo_pb에서 필요한 모든 데이터 형식을 가져옵니다.todo\u grpc\u web\u pb의 js와 클라이언트입니다.그런 다음 todoServiceClient를 사용하여 새 클라이언트 인스턴스를 만들고 로컬 호스트 URL과 포트를 사용합니다. 특사 에이전트를 수신 서버 URL로 구성하고 클라이언트 인스턴스를 저장합니다

위와 같은 방법은 구성 요소addtodo 단추를 누르고deletetodo 아이콘을 누르는 방법입니다.우리는 단지 클라이언트 캐시를 사용하여 gRPC 서비스를 실행하고, 캐시 데이터 형식과 setter와 getter를 사용하여 서버에서 발송/수신한 데이터를 처리합니다

Conclusion

본문을 끝까지 읽어주셔서 감사합니다.😁, 또는 추가, 수정 또는 삭제해야 할 내용에 대해 궁금한 점이 있으면 언제든지

만약 당신이 정말 읽는 것을 좋아한다면,clap 아이콘을 누르는 것을 잊지 마세요

당신은 여기repo에서 완전한 원본 코드를 찾을 수 있습니다. 그리고 저GitHub와

원재Medium

grpc 웹 및 Vue의 TODO 응용 프로그램을 사용합니다.회사 명