RSS

gRPC-Web 中的拦截器

我们很高兴地宣布,从 gRPC-web 1.1.0 版本开始,支持拦截器。虽然当前的设计基于其他 gRPC 语言提供的 gRPC 客户端拦截器,但它还包括 gRPC-web 特定的功能,这些功能应该使拦截器易于采用并在现代 Web 框架中使用。

简介

与其他 gRPC 语言类似,gRPC-web 支持一元和服务器流式拦截器。对于每种拦截器,我们都 定义了一个接口,其中包含一个 intercept() 方法

  • UnaryInterceptor
  • StreamInterceptor

以下是 UnaryInterceptor 接口的声明方式

/*
* @interface
*/
const UnaryInterceptor = function() {};

/**
 * @template REQUEST, RESPONSE
 * @param {!Request<REQUEST, RESPONSE>} request
 * @param {function(!Request<REQUEST,RESPONSE>):!Promise<!UnaryResponse<RESPONSE>>}
 *     invoker
 * @return {!Promise<!UnaryResponse<RESPONSE>>}
 */
UnaryInterceptor.prototype.intercept = function(request, invoker) {};

intercept() 方法接受两个参数

  • 类型为 grpc.web.Requestrequest
  • 一个 invoker,它在调用时执行实际的 RPC

StreamInterceptor 接口声明类似,只是 invoker 返回类型是 ClientReadableStream 而不是 Promise。有关实现细节,请参阅 interceptor.js

我可以使用拦截器做什么?

拦截器允许您执行以下操作

  • 在传递原始 gRPC 请求之前对其进行更新 — 例如,您可能会注入额外的身份验证标头等信息
  • 操作原始调用函数的行为,例如绕过调用,以便您可以使用缓存的结果
  • 在响应返回给客户端之前更新响应

接下来您将看到一些示例。

一元拦截器示例

下面给出的代码演示了一个执行以下操作的一元拦截器

  • 在 RPC 之前,它将字符串附加到 gRPC 请求消息。
  • 收到 gRPC 响应消息后,它将字符串附加到该消息。

这个简单的一元拦截器定义为一个实现 UnaryInterceptor 接口的类

/**
 * @constructor
 * @implements {UnaryInterceptor}
 */
const SimpleUnaryInterceptor = function() {};

/** @override */
SimpleUnaryInterceptor.prototype.intercept = function(request, invoker) {
  // Update the request message before the RPC.
  const reqMsg = request.getRequestMessage();
  reqMsg.setMessage('[Intercept request]' + reqMsg.getMessage());

  // After the RPC returns successfully, update the response.
  return invoker(request).then((response) => {
    // You can also do something with response metadata here.
    console.log(response.getMetadata());

    // Update the response message.
    const responseMsg = response.getResponseMessage();
    responseMsg.setMessage('[Intercept response]' + responseMsg.getMessage());

    return response;
  });
};

流拦截器示例

使用 StreamInterceptorClientReadableStream 拦截服务器流式响应时,需要更加小心。以下是需要遵循的主要步骤

  1. 创建一个 ClientReadableStream 包装器类,并使用它来拦截流事件,例如接收服务器响应。
  2. 创建一个实现 StreamInterceptor 并使用流包装器的类。

以下示例流包装器类拦截响应并将字符串附加到响应消息

/**
 * A ClientReadableStream wrapper.
 *
 * @template RESPONSE
 * @implements {ClientReadableStream}
 * @constructor
 * @param {!ClientReadableStream<RESPONSE>} stream
 */
const InterceptedStream = function(stream) {
  this.stream = stream;
};

/** @override */
InterceptedStream.prototype.on = function(eventType, callback) {
  if (eventType == 'data') {
    const newCallback = (response) => {
      // Update the response message.
      const msg = response.getMessage();
      response.setMessage('[Intercept response]' + msg);
      // Pass along the updated response.
      callback(response);
    };
    // Register the new callback.
    this.stream.on(eventType, newCallback);
  } else {
    // You can also override 'status', 'end', and 'error' eventTypes.
    this.stream.on(eventType, callback);
  }
  return this;
};

/** @override */
InterceptedStream.prototype.cancel = function() {
  this.stream.cancel();
  return this;
};

示例拦截器的 intercept() 方法返回一个包装的流

/**
 * @constructor
 * @implements {StreamInterceptor}
 */
const TestStreamInterceptor = function() {};

/** @override */
TestStreamInterceptor.prototype.intercept = function(request, invoker) {
  return new InterceptedStream(invoker(request));
};

绑定拦截器

通过使用适当的选项键传递拦截器实例数组,您可以在实例化客户端时将拦截器绑定到客户端

const promiseClient = new MyServicePromiseClient(
    host, creds, {'unaryInterceptors': [interceptor1, interceptor2, interceptor3]});

const client = new MyServiceClient(
    host, creds, {'streamInterceptors': [interceptor1, interceptor2, interceptor3]});

反馈

发现 grpc-web 的问题或需要新功能?在 grpc-web存储库上提交一个问题。如果您有一般性问题或意见,请考虑在 gRPC 邮件列表中发帖或发送电子邮件至 [email protected]