TypeScript

Bắt đầu với hướng dẫn gRPC để tạo token API và tải platform.proto. Chạy lệnh sau trong thư mục chứa tệp đó.

Trình duyệt không mở được kết nối gRPC HTTP/2 gốc. API nền tảng cũng nhận gRPC-Web trên HTTP/1.1. Cài protoc, plugin protoc-gen-js, protoc-gen-grpc-web và các gói runtime:

npm install grpc-web google-protobuf
npm install --save-dev @types/google-protobuf
mkdir -p src/generated
protoc -I. platform.proto \
  --js_out=import_style=commonjs,binary:src/generated \
  --grpc-web_out=import_style=typescript,mode=grpcweb:src/generated

Tải plugin biên dịch từ bản phát hành và hướng dẫn gRPC-Web chính thức; phải có trong PATH. Lệnh tạo platform_pb.js, khai báo TypeScript và PlatformServiceClientPb.ts.

import {PlatformServicePromiseClient} from './generated/PlatformServiceClientPb';
import {GetCatalogRequest, ListCatalogsRequest} from './generated/platform_pb';

// Supply a token at runtime. Do not bundle a long-lived API token in browser code.
export async function listCatalogDetails(token: string) {
  const client = new PlatformServicePromiseClient('https://reconstruct.dev');
  const metadata = {authorization: `Bearer ${token}`};
  const listRequest = new ListCatalogsRequest();
  listRequest.setPageSize(10);

  const page = await client.listCatalogs(listRequest, metadata);
  for (const catalog of page.getCatalogsList()) {
    const detailRequest = new GetCatalogRequest();
    detailRequest.setCatalogId(catalog.getCatalogId());
    const detail = await client.getCatalog(detailRequest, metadata);
    console.log(detail.getCatalogId(), detail.getDescription());
  }
}

Với ứng dụng trình duyệt, API công khai phải cho phép origin của ứng dụng qua CORS. Giữ token lâu dài trên máy chủ tin cậy; bundle trình duyệt không bảo vệ được bí mật nhúng.