如何在 Angular 上使用 Twilio?

Posted

技术标签:

【中文标题】如何在 Angular 上使用 Twilio?【英文标题】:How to use Twilio on Angular? 【发布时间】:2021-05-03 16:10:45 【问题描述】:

我正在将 whatsapp 消息与我的应用程序集成,但我遇到了构建问题

whatsapp.service.ts

    import  Injectable  from "@angular/core";
    import  Twilio  from "twilio";
    // usado para ler os arquivos .env
    require("dotenv").config();
    
    let twilioID: string = "";
    let twilioToken: string = "";
    
    if (process.env.ENVIROMENT == "local" || process.env.ENVIROMENT == "dev") 
      //Dev ou local enviroment
      twilioID = process.env.TWILIO_TEST_SID || "";
      twilioToken = process.env.TWILIO_TEST_AUTH_TOKEN || "";
     else 
      // Em produção
      twilioID = process.env.TWILIO_PRODUCTION_SID || "";
      twilioToken = process.env.TWILIO_PRODUCTION_AUTH_TOKEN || "";
    
    // Cliente para usar funções da api do twilio
    const client = new Twilio(twilioID, twilioToken);
    
    const BOT_NUMBER = "whatsapp:+14155238886";
    
    @Injectable(
      providedIn: "root",
    )
    export class WhatsAppService 
      sendWhatsAppMessage(
        numberDestiny: number,
        message: string,
        countryCode: number
      ) 
        return client.messages.create(
          from: BOT_NUMBER,
          to: `whatsapp:+$countryCode$numberDestiny`,
          body: message,
        );
      
    
      sendMediaWhatsAppMessage(
        numberDestiny: number,
        message: string,
        countryCode: number,
        mediaUrls: string[]
      ) 
        return client.messages.create(
          mediaUrl: mediaUrls,
          from: BOT_NUMBER,
          to: `whatsapp:+$countryCode$numberDestiny`,
          body: message,
        );
      
    

构建错误

./node_modules/jsonwebtoken/node_modules/jwa/index.js 中的错误模块未找到:错误:无法解析“加密” 'C:\Users\ialex\Documents\Development\node_modules\jsonwebtoken\node_modules\jwa'

./node_modules/scmp/index.js 中的错误模块未找到:错误:不能 解决“加密” 'C:\Users\ialex\Documents\Development\node_modules\scmp'

./node_modules/twilio/lib/webhooks/webhooks.js 中的错误模块不是 发现:错误:无法解析“加密” 'C:\Users\ialex\Documents\Development\node_modules\twilio\lib\webhooks'

./node_modules/dotenv/lib/main.js 中的错误找不到模块:错误: 无法解析“fs” 'C:\Users\ialex\Documents\Development\node_modules\dotenv\lib'

./node_modules/twilio/lib/base/RequestClient.js 模块中的错误不是 发现:错误:无法解析“fs” 'C:\Users\ialex\Documents\Development\node_modules\twilio\lib\base'

./node_modules/twilio/lib/base/RequestClient.js 模块中的错误不是 发现:错误:无法解析“http” 'C:\Users\ialex\Documents\Development\node_modules\twilio\lib\base'

./node_modules/twilio/lib/base/RequestClient.js 模块中的错误不是 发现:错误:无法解析“https” 'C:\Users\ialex\Documents\Development\node_modules\twilio\lib\base'

./node_modules/dotenv/lib/main.js 中的错误找不到模块:错误: 无法解析“路径” 'C:\Users\ialex\Documents\Development\node_modules\dotenv\lib'

错误 ./node_modules/jsonwebtoken/node_modules/jws/lib/sign-stream.js 模块 未找到:错误:无法解析“流” 'C:\Users\ialex\Documents\Development\node_modules\jsonwebtoken\node_modules\jws\lib'

错误 ./node_modules/jsonwebtoken/node_modules/jws/lib/verify-stream.js 找不到模块:错误:无法解析“流” 'C:\Users\ialex\Documents\Development\node_modules\jsonwebtoken\node_modules\jws\lib'

错误 ./node_modules/jsonwebtoken/node_modules/jws/lib/data-stream.js 模块 未找到:错误:无法解析“流” 'C:\Users\ialex\Documents\Development\node_modules\jsonwebtoken\node_modules\jws\lib'

【问题讨论】:

这能回答你的问题吗? Module not found: Error: Can't resolve 'crypto' 抱歉,帮不上忙 【参考方案1】:

这里是 Twilio 开发者宣传员。

这里的问题是因为您试图在客户端应用程序中使用Twilio Node.js library。首先,Node 库不是为在浏览器中使用而构建的。

更重要的是,这不是一个好主意,因为它要求您的帐户 SID 和身份验证令牌存在于客户端中。恶意用户可能会从应用程序源中读取您的帐户 SID 和身份验证令牌,然后使用它们滥用您的 Twilio 帐户。

相反,您应该向服务器端的 Twilio API 发出请求,然后将相关数据从您的 Angular 应用程序发送到服务器。

前段时间我确实编写了一个示例 Angular 应用程序,这可能会有所帮助。你可以看到我是如何send the data to the server in this MessageService 然后send it to the Twilio API in this server side route。 (我很抱歉没有更多关于这个应用程序的文档。)

【讨论】:

以上是关于如何在 Angular 上使用 Twilio?的主要内容,如果未能解决你的问题,请参考以下文章

如何检查 Twilio.Device 处理程序是不是已存在

如何在解析服务器上配置 Twilio?

Twilio - 如何将现有呼叫移至会议

Twilio Video Javascript在服务器上

如何使用Twilio留下语音邮件?

我在 Angular 中离开房间时出错 twilio-programmable-video