如何修复 TypeScript 错误 属性 'isBoom' 在类型 'Boom<any> | ResponseObject' 上不存在

Question

以下源代码returns TypeScript 错误：

this.hapi.ext({
  type: 'onPreResponse',
  method: async (request, handler) => {
    if (request.response.isBoom && request.response.message !== 'Invalid request payload input') {
      if (request.response.isServer) {
        logger.captureException(request.response, null, {
          digest: this.requestDigest(request)
        });
      } else {
        logger.captureMessage(request.response.message, 'info', null, {
          digest: this.requestDigest(request)
        });
      }
    }
    return handler.continue;
  }
});

Property 'isBoom' does not exist on type 'Boom | ResponseObject'. Property 'isBoom' does not exist on type 'ResponseObject'.

Property 'isServer' does not exist on type 'Boom | ResponseObject'. Property 'isServer' does not exist on type 'ResponseObject'.

Argument of type 'string | ((httpMessage: string) => ResponseObject)' is not assignable to parameter of type 'string'. Type '(httpMessage: string) => ResponseObject' is not assignable to type 'string'.

我该如何修复它们？ @types/hapi有问题吗？

Answer 1

因为 response 是联合 ResponseObject | Boom | null 我们只能访问联合的普通成员，除非我们使用类型保护。

有几种类型的类型保护，你可以阅读更多关于 here 的内容。下面我使用 in 类型保护来根据 属性 的存在进行区分

import { Server } from 'hapi';

const hapi = new Server({})

hapi.ext({
    type: 'onPreResponse',
    method: async (request, handler) => {
        if (request.response && 'isBoom' in request.response && request.response.message !== 'Invalid request payload input') {
            if (request.response.isServer) {
                request.response.message // string 
            }
            return handler.continue;
        }
    }
});

因为类型 Boom 是一个 class 一个 instanceof typeguard 也应该工作：

hapi.ext({
    type: 'onPreResponse',
    method: async (request, handler) => {
        if (request.response && request.response instanceof Boom && request.response.message !== 'Invalid request payload input') {
            if (request.response.isServer) {
                request.response.message // string 
            }
            return handler.continue;
        }
    }
});

注意 在这两种情况下，我都添加了对 request.response 的检查以将 null 从联合中排除。这仅在启用 strictNullChecks 时由编译器要求，但无论如何可能是个好主意。