電話を使用して悪い引用符を破壊してからの呼び出しは、ノードを使用します.jsとtwilio⚗️

ハウディリーダー👋🏽

今まであなたの好きなショーから引用符を聞いてみたかったが、方法があったことがありますか?私は最近、悪いとウォルターのとジェシーの象徴的な声がまだ私の頭の周りバウンス破壊を見た.
今日、私は自動的に呼ばれるときに悪い引用符を壊して再生する番号を設定する方法を教えているか、または製品のための自動化されたサポートライン、スタートアップ、または任意の資本主義的な努力を念頭に置いて設定するような何かのためにそれを使用することができます.🥱
この番号をデモに呼び出します.

必要条件✋🏽

基本的なJavaScriptの知識.

世間話

最近のノード.JSインストール.

何がtwilioですか？📱

Twitoは、電話、テキストメッセージング、またはP 2 Pビデオストリーミングのような様々な通信ニーズのAPIを提供する会社です.
私たちはProgrammable Voice API これは、音声やオーディオを再生するための機能を公開します.

プロジェクトデザイン🏗️

デザインをやりましょう!
ユーザーが最初に私たちの番号を呼び出し、次にtwilioは“私は、電話に答えて、このオーディオを返すtwilioに指示する私たちの明示的なサーバー上のエンドポイントを呼び出します.”TuilioはOKを言って、呼び出し元にオーディオを再生します.

プロジェクト設定

プロジェクトの料理を始めましょう.

Twilio APIキー🔑

私たちのtwilio APIキーを取得することによってキックオフしましょう、我々は後でテストするためにそれらを必要とします.あなたがtwilioアカウントを持っていないならば、ここにありますsign-up page (それはアフィリエイトのリンクではない心配しないでください).無料の電話番号を生成することを忘れないでください.
コンソールは2つのトークンをあなたのアカウント情報、アカウントSIDとAuthトークンに接続する必要があります.

環境変数の追加🤫

インストールしたパッケージの一つはdotenv . Dotenv を定義する.env 変数または敏感なキーのためのファイルprocess.env .
開ける.env ファイルとあなたのtwilio APIキーとあなたの生成された電話番号を追加します.

TWILIO_ACCOUNT_SID=<YOU_ACCOUNT_SID>
TWILIO_AUTH_TOKEN=<YOUR_AUTH_TOKEN>
TWILIO_NUMBER=<YOUR_GENERATED_TWILIO_NUMBER> # Ex. +14045555555

エクスプレス.jsサーバー

「何をすべきか」と尋ねるTwitilioを扱うには急行が必要だ.jsサーバー.空のディレクトリとinit空のNPMプロジェクトを作成し、変更を除いて任意の設定を設定しますapp.js .

npm init

次に、NPMコマンドを実行して、必要なパッケージをインストールします.

npm install express dotenv twilio ngrok

以下のフォルダ構造を作成します.

├── public/ - Public static files
├── routes/ - HTTP routes
    └── voice.js - Twilio API endpoints
├── .env
├── app.js - HTTP server definition
├── package.json
├── package-lock.json

サーバーコードを追加しましょうapp.js !

const express = require('express');
const path = require('path');
const http = require('http');

// Pull environment variables 
require('dotenv').config();

// Init Express
const app = express();
app.use(express.json());
app.use(express.urlencoded({extended: false}));
app.use(express.static(path.join(__dirname, 'public')));

// Set port
const port = '3000';
app.set('port', port);

// Create HTTP server
const server = http.createServer(app);

// Start server on port
server.listen(port, () => {
  console.log("Started server");
});

module.exports = app;

このコマンドを実行してサーバを起動します.

node app.js

オーディオファイルの追加🎤

我々の要件に従って、誰かが私たちの番号を呼び出すときにいくつかのオーディオファイルを収集しましょう.私はすでに悪い引用を壊している知っているが、あなたが欲しいものを使用することができます、私はあなたの上司ではない.

I used this site to download Breaking Bad quotes.

オーディオファイルを取得した後、public フォルダ.あなたのオーディオファイルを公開したくない場合は、別のフォルダを作成し、それらを再配置することができます.

オーディオ応答終了点

誰かが私たちのtwilio番号を呼び出すと、我々は直接twilioPOST twilioにどのように呼び出し元に対応するかを示すエンドポイントTwiML , コマンドのためのtwiliosマークアップ言語.
移動するroutes/voice.js ファイル.私たちはPOST エンドポイント名/voice ランダムにクォートを選択し、twiloに対してこのファイルを再生するためにtwmlコマンドを生成して返します.

const express = require('express');
const VoiceResponse = require('twilio').twiml.VoiceResponse;
const fs = require('fs');

// Create router
const router = express.Router();

// Create a 'POST' endpoint named '/voice'
router.post('/voice', (req, res) => {

  // Get all the files in the /public folder 
  // then filter for only .mp3 files.
  const audioFiles = fs.readdirSync('./public').filter((file) => {
    return file.match(new RegExp('.*\.(mp3)', 'ig'));
  });

  // Choose a random .mp3
  const randomAudioFile = audioFiles[Math.floor(Math.random() * audioFiles.length)];

  // Create a voice response
  const voiceResponse = new VoiceResponse();

  // Add a pause because the audio starts too quickly
  // and the person calling might miss the beginning.
  voiceResponse.pause({
    length: 1,
  });

  // Generate a TwiML command that says 
  // "Play this audio file once".
  voiceResponse.play({
    loop: 1
  }, randomAudioFile);

  // Send response to Twilio
  res.type('text/xml')
    .status(200).send(voiceResponse.toString());
});

module.exports = router;

今編集してサーバーにルートを添付app.js .

const voiceRouter = require('./routes/voice');
app.use(voiceRouter);

Make sure to restart your server on code changes.

'音声'終点のテスト🔬

我々のエンドポイントをtwilioに付ける前に、あなたが悪いプログラマでない限り、私たちは最初にそれをテストしました.ちょっとあなたの製品が何であるかについて、私に教えてください🤣.
エンドポイントパスが動作するかどうかをチェックするには、HTTPクライアントを使用しますPostman 送るPOST リクエストlocalhost:3000/voice . 次のようになります.

<?xml version="1.0" encoding="UTF-8"?>
<Response>
    <Pause length="1"/>
    <Play loop="1">who_knocks.mp3</Play>
</Response>

我々の終点の機能性をテストするために、私たちは/voice エンドポイント.あなたのtwilioアカウントがアクティブにされていない場合は、呼び出すことができる唯一の番号は、あなたのアカウントを作成したものです.
それを実行する前に、twilioはlocalhost . 我々がテストしているならば、重要でありません.幸運にも、道具があるNgrok , を公開するリバースプロキシlocalhost:3000 それは実際のサーバーのようなインターネットへのサーバーを表現!
移動するapp.js ファイル.にserver.listen コマンドのコールバックは、サーバーにインターネットを接続してサーバーを再起動するコードを追加します.

const ngrok = require('ngrok');

// Listen on port
server.listen(port, () => {
  console.log("Started server");

  // Create a public url for our
  // `localhost:3000` express server.
  ngrok.connect({
    addr: 3000, // Our localhost port
  }).then((ngrokUrl) => {
    console.log("Connected to url: " + ngrokUrl);
  });
});

次のようになります.

Connected to url: https://xxxx-xx-xx-xxx-xx.ngrok.io

今、私たちはコマンドをテストするためにtwilioコードを作成!を使用してtwilioクライアントを作成しますTWILIO_ACCOUNT_SID and TWILIO_AUTH_TOKEN 我々が以前に加えた環境変数.

const twilio = require("twilio");

// Listen on port
server.listen(port, () => {
  console.log("Started server");

   // Create Twilio client
  const twilioClient =
     new twilio(process.env.TWILIO_ACCOUNT_SID, process.env.TWILIO_AUTH_TOKEN);
...

私たちのtwilioクライアントを使用して、コマンドを送信するコマンドを使用して電話番号を呼び出す/voice エンドポイント.

// Listen on port
server.listen(port, () => {
  console.log("Started server");

  // Create a public url for our
  // `localhost:3000` express server.
  ngrok.connect({
    addr: 3000,
  }).then((ngrokUrl) => {
    console.log("Connected to url: " + ngrokUrl);

    // Append voice endpoint to ngrokUrl
    const voiceUrl = `${ngrokUrl}/voice`;

    // Create Twilio client
    const twilioClient = new twilio(process.env.TWILIO_ACCOUNT_SID, process.env.TWILIO_AUTH_TOKEN);

    // Call a phone number using the
    // command from the /voice endpoint.
    twilioClient.calls.create({
      to: '<TARGET_PHONE_NUMBER>', // Target number to call
      from: process.env.TWILIO_NUMBER, // Your generated Twilio number
      url: voiceUrl, // The ngrok url that points to the /voice endpoint
      method: 'POST'
    }).then((call) => {
      console.log(call); // Print call log
    }).catch((err) => {
      console.log("Error making call " + err); // Print error
    });
  });
});

数秒後に、選択したオーディオファイルを再生コールを取得する必要があります!かなりクールな右?😊

接続/ボイスエンドポイントトゥリオ🪛

それは真実の瞬間のための時間です!我々は、我々の接続を試みます/voice トゥリュートゥトゥリオ.あなたのTwinoアカウントにログインし、コンソールに移動します.左サイドバーの'探索製品'をクリックします.

スクロールダウンし、'電話番号'をクリックします.

選択してくださいtwilio番号.

'ボイス＆ファックス'にスクロールし、あなたのngrokのURLを追加するには/voice エンドコールのためのウェブフックとして'コールが付属しています.

あなたのtwilio電話番号を呼び出して、あなたのオーディオは、あなたの耳に正しく遊びます!👍🏾👍🏾👍🏾

最後の思考💭

誰がT . Vはあなたの脳をrots言う?壊れているので、システム設計、サーバーの作成、環境変数の使用方法、テストの重要性、そして最も重要なことは料理の仕方を学びました.コード😉. うまくいけば、あなたは読んで楽しんできたし、それから何かを取った.
私はグレゴリーゲインズ、良い記事を書いているgoofyソフトウェアエンジニアです.あなたがより多くの内容が欲しいならば、Twitterで私について来てください.
今すぐ何か偉大な作成に行く!あなたはtwilioアプリを作成するか、いくつかの助けを必要とTwitter上で私を打った.