将Twilio CORS Node.js转TypeScript时，Twilio.Response()报错如何解决？

问题背景 #

将Twilio官方的CORS Node.js示例转换为TypeScript时，使用new Twilio.Response()出现以下TypeScript错误：

Property 'Response' does not exist on type 'typeof Twilio'.

原Node.js示例代码：

exports.handler = (context, event, callback) => {
  // Access the NodeJS Helper Library by calling context.getTwilioClient()
  const client = context.getTwilioClient();

  // Create a custom Twilio Response
  const response = new Twilio.Response();
  // Set the CORS headers to allow Flex to make an error-free HTTP request
  // to this Function
  response.appendHeader('Access-Control-Allow-Origin', '*');
  response.appendHeader('Access-Control-Allow-Methods', 'OPTIONS, POST, GET');
  response.appendHeader('Access-Control-Allow-Headers', 'Content-Type');

  // Use the NodeJS Helper Library to make an API call and gather
  // statistics for the Flex Plugin.
  // Note that the workspace SID is passed from the event parameter
  // of the incoming request.
  client.taskrouter.v1
    .workspaces(event.WorkspaceSid)
    .workers()
    .cumulativeStatistics()
    .fetch()
    .then((data) => {
      response.appendHeader('Content-Type', 'application/json');
      response.setBody(data);
      // Return a success response using the callback function
      return callback(null, response);
    })
    .catch((err) => {
      response.appendHeader('Content-Type', 'plain/text');
      response.setBody(err.message);
      response.setStatusCode(500);
      // If there's an error, send an error response.
      // Keep using the response object for CORS purposes.
      return callback(null, response);
    });
};

转换后的TypeScript代码（含错误行）：

import { Twilio } from 'twilio';

import {
  Context,
  ServerlessCallback,
  ServerlessFunctionSignature,
  ServerlessEventObject
} from '@twilio-labs/serverless-runtime-types/types';
import { EnvVars } from '../envVars';

export interface EventRequest extends ServerlessEventObject {
  WorkspaceSid: string;
}

export const handler: ServerlessFunctionSignature<EnvVars, EventRequest> = async (
  context: Context<EnvVars>,
  event: EventRequest,
  callback: ServerlessCallback
) => {
  // Access the NodeJS Helper Library by calling context.getTwilioClient()
  const client = context.getTwilioClient();

  // Create a custom Twilio Response
  const response = new Twilio.Response(); // 🚨 Error: Property 'Response' does not exist on type 'typeof Twilio'.

  // Set the CORS headers to allow Flex to make an error-free HTTP request
  // to this Function
  response.appendHeader('Access-Control-Allow-Origin', '*');
  response.appendHeader('Access-Control-Allow-Methods', 'OPTIONS, POST, GET');
  response.appendHeader('Access-Control-Allow-Headers', 'Content-Type');

  // Use the NodeJS Helper Library to make an API call and gather
  // statistics for the Flex Plugin.
  // Note that the workspace SID is passed from the event parameter
  // of the incoming request.
  client.taskrouter.v1
    .workspaces(event.WorkspaceSid)
    .workers()
    .cumulativeStatistics()
    .fetch()
    .then((data: any) => {
      response.appendHeader('Content-Type', 'application/json');
      response.setBody(data);
      // Return a success response using the callback function
      return callback(null, response);
    })
    .catch((err: Error) => {
      response.appendHeader('Content-Type', 'plain/text');
      response.setBody(err.message);
      response.setStatusCode(500);
      // If there's an error, send an error response.
      // Keep using the response object for CORS purposes.
      return callback(null, response);
    });
};

错误原因 #

Twilio.Response并非twilio核心库导出的成员。在Twilio Serverless Functions的Node.js运行时环境中，Response是全局提供的内置对象，不需要通过Twilio类来访问。官方Node.js示例中直接使用new Twilio.Response()是因为运行时全局的Twilio对象包含该属性，但TypeScript的类型定义不会将此全局对象与导入的Twilio类混淆。

解决方案 #

方案1：使用全局Response对象（推荐） #

直接使用运行时全局的Response，并从@twilio-labs/serverless-runtime-types导入对应的类型进行标注：

import { Twilio } from 'twilio';

import {
  Context,
  ServerlessCallback,
  ServerlessFunctionSignature,
  ServerlessEventObject,
  TwilioResponse // 导入Response类型
} from '@twilio-labs/serverless-runtime-types/types';
import { EnvVars } from '../envVars';

export interface EventRequest extends ServerlessEventObject {
  WorkspaceSid: string;
}

export const handler: ServerlessFunctionSignature<EnvVars, EventRequest> = async (
  context: Context<EnvVars>,
  event: EventRequest,
  callback: ServerlessCallback
) => {
  const client = context.getTwilioClient();

  // 直接使用全局Response，并用TwilioResponse类型标注
  const response: TwilioResponse = new Response();

  // 设置CORS头
  response.appendHeader('Access-Control-Allow-Origin', '*');
  response.appendHeader('Access-Control-Allow-Methods', 'OPTIONS, POST, GET');
  response.appendHeader('Access-Control-Allow-Headers', 'Content-Type');

  client.taskrouter.v1
    .workspaces(event.WorkspaceSid)
    .workers()
    .cumulativeStatistics()
    .fetch()
    .then((data) => {
      response.appendHeader('Content-Type', 'application/json');
      response.setBody(data);
      return callback(null, response);
    })
    .catch((err) => {
      response.appendHeader('Content-Type', 'plain/text');
      response.setBody(err.message);
      response.setStatusCode(500);
      return callback(null, response);
    });
};

方案2：手动导入Response类（不推荐） #

如果一定要从库中导入，可以直接引入twilio内部的Response类，但这不符合Twilio Functions的运行时设计，不建议使用：

import { Response } from 'twilio/lib/http/response';

补充说明 #

• 无需额外安装其他模块，@twilio-labs/serverless-runtime-types已经包含了所有Twilio Functions运行时的类型定义。
• 建议使用方案1，因为全局Response是Twilio Functions运行时专门为函数响应设计的对象，包含了适配平台的方法（如appendHeader、setBody等）。

内容的提问来源于stack exchange，提问作者Christopher Stevens