Twilio 和 Flybase 实时通信高级教程(二)

随笔2个月前发布 我累了
36 0 0

原文:Real-Time Twilio and Flybase

协议:CC BY-NC-SA 4.0

六、发送每日短信提醒

在这一章中,我将向你展示如何使用 Node.js、Flybase 和 Twilio 来编写你自己的每日短信提醒应用。

必要的工具

  • Twilio 发送和接收短信

  • 存储订阅我们服务的用户

  • Node.js 构建在 Chrome 的 JavaScript 运行时之上,轻松构建快速、可扩展的网络应用

使用 Cron 安排 SMS 消息

首先,我们需要安装几个 npm 包。我们将使用 twilio 包( https://github.com/twilio/twilio-node )来发送文本消息,并且我们将使用 cron 包( https://github.com/ncb000gt/node-cron )来安排我们想要发送文本消息的时间。您可以通过运行以下命令来安装它们:

npm install twilio
npm install cron

  • 1
  • 2
  • 3

创建一个名为 app.js 的新文件,并需要 twilio 和 cron 包:

var twilio = require('twilio'),
client = twilio('ACCOUNTSID', 'AUTHTOKEN'),
cronJob = require('cron').CronJob;

  • 1
  • 2
  • 3
  • 4

让我们写一些每天下午 6 点发送短信的代码:

var textJob = new cronJob( '0 18 * * *', function(){
  client.sendMessage( { to:'YOURPHONENUMBER', from:'YOURTWILIONUMBER', body:'Hello! Hope you're having a good day!' }, function( err, data ) {});
}, null, true);

  • 1
  • 2
  • 3
  • 4

您可能想知道我们作为 cronJob 的第一个参数传递的字符串是什么。这是一种特定于 Cron 的格式,允许我们定义希望该作业启动的时间和频率。

在这种情况下,每天 18 小时的 0 分钟。这篇文章( www.nncron.ru/help/EN/working/cron-format.htm )很好地打破了 Cron 格式。

在对 cronJob 的回调中,我们使用 Twilio 客户端库发送消息。我们传递收件人和发件人号码以及我们想要发送的消息正文。

运行这段代码,等待你的短信。如果是上午 10 点,你可能不想等 8 个小时来看看你的代码是否工作。只需更新 Cron 格式,在更早的时间发送即可。给你个提示。要在上午 10:13 发送,您可以使用以下格式:“13 10 * * *”。

你现在有了这个应用的基本版本,但你很可能不想每天只给自己发一条消息。如果你有,那么恭喜你!你们都完了!对于我们其余的人,我们可以做一些小的代码修改,让这个发送到多个电话号码。

首先,让我们添加一个名为 numbers 的新变量,它包含我们要向其发送消息的电话号码:

var numbers = ['YOURPHONENUMBER', 'YOURFRIENDSPHONENUMBER'];

  • 1
  • 2

然后,让我们更新 textJob 中的代码,循环遍历这些电话号码并向它们发送消息:

for( var i = 0; i < numbers.length; i++ ) {
  client.sendMessage( { to:numbers[i], from:'YOURTWILIONUMBER', body:'Hello! Hope you’re having a good day.'}, function( err, data ) {
    console.log( data.body );
  });
}

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6

接收短信

现在,我们在需要的时间向不同的号码发送短信,让我们更新代码,以了解用户何时向我们的应用发送短信。Twilio 使用 webhooks ( https://en.wikipedia.org/wiki/Webhook )来让您的服务器知道何时有消息或电话进入我们的应用。我们需要设置一个端点,我们可以告诉 Twilio 将它用于消息传递 webhook。

我们将使用 express 框架( http://expressjs.com/ )来设置我们的 Node web 服务器,以接收来自 Twilio 的 POST 请求,因此我们需要安装 Express 包。我们还将使用 body-parser 模块,所以我们也要安装它:

npm install express
npm install body-parser

  • 1
  • 2
  • 3

在 app.js 文件的开头,我们需要 require express 并将其初始化为一个名为 app 的变量。我们还将使用 bodyParser 中间件( https://github.com/expressjs/body-parser )来方便地使用我们将在 POST 请求中获得的数据:

var express = require('express'),
bodyParser = require('body-parser'),
app = express();
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({
  extended: true
}));

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8

我们将为/message 添加一个路由,用一些 TwiML ( www.twilio.com/docs/api/twiml )进行响应。TwiML 是一组基本指令,当你收到来电或短信时,你可以用它来告诉 Twilio 该做什么。我们的代码将如下所示:

app.post('/message', function (req, res) {
  var resp = new twilio.TwimlResponse();
  resp.message('Thanks for subscribing!');
  res.writeHead(200, {
    'Content-Type':'text/xml'
  });
  res.end(resp.toString());
});

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9

我们使用 Twilio Node 库来初始化一个新的 TwimlResponse。然后我们使用消息动词( www.twilio.com/docs/api/twiml/sms/message )来设置我们想要用什么来响应消息。在这种情况下,我们只会说“感谢订阅!”然后,我们将响应的内容类型设置为text/xml,并发送我们构建的 TwimlResponse 的字符串表示。

最后,让我们将服务器设置为侦听端口 3000:

var server = app.listen(3000, function() {
  console.log('Listening on port %d', server.address().port);
});

  • 1
  • 2
  • 3
  • 4

现在让我们启动我们的应用:

node app.js

  • 1
  • 2

现在我们已经运行了服务器,我们需要告诉 Twilio 使用这个消息 URL 作为我们的消息请求 URL:

![](https://gitee.com/OpenDocCN/vkdoc-node-zh/raw/master/docs/rt-twilio-flybase/img/EDpe7a4_f17kekwXJmzaPj53kvW913UZHr-lEvlKP588mR5jHzIzUd7g48GSzkSzz5INNI9sh3Mygtmstiz4YmCuFznnTSlWpZV0bEFXjjnlU8mZzHR_SL-7nyEHWTmolw)

  • 1
  • 2

向您的 Twilio 号码发送短信,您应该会收到回复。如果你不知道,看看 Twilio 应用监视器( www.twilio.com/user/account/developer-tools/app-monitor )来帮助确定哪里出了问题。

在 Flybase 中保存用户

我们设置了一个脚本,每天在同一时间发送短信,我们让用户能够在我们的应用中发送短信。只剩下最后一件事要做了。当用户向我们的应用发送文本时,我们需要保存他们的信息。我们将使用 Flybase ( www.flybase.io/ )作为我们的数据存储,因此我们需要安装 Flybase Node 模块:

npm install flybase

  • 1
  • 2

现在我们已经安装了 Flybase 模块,让我们在 app.js 文件的顶部要求并初始化它:

var api_key = "{YOUR-API-KEY}";
var db = "dailysms";
var collection = "users";

var usersRef = require('flybase').init(db, collection, api_key);

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6

当你注册一个 Flybase 帐户时,他们会为你的帐户提供一个 API 密钥。请务必更新此代码,用此键替换{YOUR-API-KEY}

从 Flybase 内部,创建一个名为dailysms的新应用。

因为我们将从 Flybase 中提取电话号码,所以我们希望将 numbers 变量更新为一个空数组,然后用数据库中的信息填充它。

Flybase 是一个实时数据库,它是围绕订阅事件而构建的,而不是按需阅读。我们将订阅两个事件:首先,我们希望检索所有现有电话号码的列表,然后我们希望在添加新用户时得到通知:

var numbers = [];
usersRef.on('value', function(snapshot) {
      snapshot.forEach( function( rec ){
           numbers.push( rec.value().phonenumber );
           console.log( 'Added number ' + rec.value().phonenumber );
      });
});

usersRef.on('added', function(snapshot) {
     numbers.push( snapshot.value().phonenumber );
     console.log( 'Added number ' + snapshot.value().phonenumber );
});

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13

现在,我们需要添加用户到我们的数据库时,他们在订阅文本。让我们重新审视一下我们的消息路径,以进行更新:

```javascript
app.post('/message', function (req, res) {
     var resp = new twilio.TwimlResponse();
     if( req.body.Body.trim().toLowerCase() === 'subscribe' ) {
          var fromNum = req.body.From;
          if(numbers.indexOf(fromNum) !== -1) {
               resp.message('You already subscribed!');
          } else {
               resp.message('Thank you, you are now subscribed. Reply "STOP" to stop receiving updates.');
               usersRef.push({phonenumber:fromNum});
          }
     } else {
          resp.message('Welcome to Daily Updates. Text "Subscribe" receive updates.');
     }
     res.writeHead(200, {
          'Content-Type':'text/xml'
     });
     res.end(resp.toString());
});

```js

当 Twilio 消息 webhook 向您的服务器触发一个新的 POST 请求时,我们会在请求参数( [`www.twilio.com/docs/api/twiml/sms/twilio_request#request-parameters`](http://www.twilio.com/docs/api/twiml/sms/twilio_request%2523request-parameters) )中包含关于消息的信息。

我们将使用 Body 参数来检查用户发送的文本内容,使用 From 参数来确定用户发送的文本数量。如果他们已经输入了单词“subscribe ”,并且他们还不在我们的数据库中,我们将使用我们的 Flybase 引用上的 push 函数来添加他们。

我们的应用现已准备就绪。让我们运行并尝试一下:

Twilio 和 Flybase 实时通信高级教程(二)

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28

node app.js


## 摘要

我们做到了!现在你已经建立了一个简单的每日短信提醒应用,这是你自定义每日信息的机会。

# 七、构建实时呼叫跟踪仪表板

本章将向您展示如何实现实时呼叫跟踪仪表板。

我们将分两部分完成这项工作:第一部分是一个简单的 Node.js 文件,它接受来自 Twilio 的来电,然后将信息存储在 Flybase 应用中,第二部分是仪表板本身。

我们将显示两个统计数据,传入的 Twilio 电话号码和电话的始发城市。您可以稍后在此基础上进一步构建。

使用我们最初的仪表板,我们传递事件,实际上不存储任何信息。这一次,我们将存储信息,以便以后检索。

## 后端

让我们构建您的仪表板的后端部分。

首先,让我们设置我们的“package.json”文件:

```js
{
  "name": "call-tracking",
  "version": "1.0.0",
  "description": "Example app demonstrating how to do call tracking with Twilio and Flybase",
  "main": "index.js",
  "scripts": {
    "test": "echo "Error: no test specified" && exit 1"
  },
  "repository": {
    "type": "git",
    "url": "git+https://github.com/flybaseio/call-tracking.git"
  },
  "author": "",
  "license": "ISC",
  "bugs": {
    "url": "https://github.com/flybaseio/call-tracking/issues"
  },
  "homepage": "https://github.com/flybaseio/call-tracking#readme",
  "dependencies": {
    "body-parser": "¹.15.2",
    "compression": "¹.6.2",
    "cors": "².8.1",
    "ejs": "².5.2",
    "express": "⁴.14.0",
    "flybase": "¹.7.8",
    "method-override": "².3.6",
    "serve-static": "¹.11.1"
  }
}

Twilio 和 Flybase 实时通信高级教程(二)

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
  • 51
  • 52

现在,让我们设置“index.js”文件作为后端运行:

var http = require('http');
var express = require('express');
var bodyParser = require('body-parser');
var flybase = require('flybase');
var path = require('path');

var cors = require('cors');
var compression = require('compression');
var serveStatic = require('serve-static');

var app = express();
app.set('view engine', 'ejs');
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({     extended: true     }));
app.use(express.static( path.join(__dirname, 'public')));

var port = process.env.PORT || 5000; // set our port

var flybaseRef = flybase.init('YOUR-FLYBASE-APP-NAME', "calltracking", 'YOUR-FLYBASE-API-KEY');

//     backend

app.post('/call', function(req, res) {
     flybaseRef.push({
          time: Date.now()/1000,
          number: req.body.To,
          city: req.body.FromCity
     }).then( function( rec ){
          res.type('text/xml');
          res.render('twiml', { message: 'Your call has been recorded!' })
     }, function(err){
          res.type('text/xml');
          console.log(error);
          res.render('twiml', { message: 'Sorry, an error happened.' });
     });
});

Twilio 和 Flybase 实时通信高级教程(二)

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37

现在,让我们添加前端处理程序。这只是同一个“index.js”文件的一部分:

```javascript
// frontend

function setCustomCacheControl(res, path) {
     if (serveStatic.mime.lookup(path) === 'text/html') {
          // Custom Cache-Control for HTML files
          res.setHeader('Cache-Control', 'public, max-age=0')
     }
}

app.use(compression());

app.use(serveStatic(__dirname + '/dashboard', {
     maxAge: '1d',
     setHeaders: setCustomCacheControl,
     'index': ['index.html'],
     fallthrough: true
}));

var server = http.createServer(app);
server.listen(process.env.PORT || 3000, function() {
     console.log('Express server started.');
});
```js

Twilio 和 Flybase 实时通信高级教程(二)

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25

我在这里使用了 serve-static 模块,因为如果我们希望的话,仪表板可以是独立的,所以它只是静态提供的标准 HTML 页面,所以我们会告诉我们的应用显示dashboard文件夹中的任何文件。

最后,我们需要创建一个名为views的文件夹,并添加一个名为twiml.ejs的小文件:

<Response>
     <Say><%= message %></Say>
</Response>

  • 1
  • 2
  • 3
  • 4

这用于返回我们对传入呼叫的 TwiML (Twilio 标记语言)响应。你可以进一步玩这个,让它做一些事情,如将呼叫连接到另一个号码等等,但对于这个应用,我们只需要记录和跟踪。

前端

我们希望这个仪表板能够在任何地方运行,所以我们只需包含dashboard文件夹,并设置我们的 Node 应用来静态地为其提供服务。你可以上传dashboard文件夹到任何你想上传的地方,让它运行并显示你的电话追踪数据。

创建一个名为dashboard的文件夹。现在,在dashboard文件夹中创建一个名为index.html的文件:

<!doctype html>
<html>
     <head>
          <title>Call Tracking On the Fly</title>
          <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet" integrity="sha256-7s5uDGW3AHqw6xtJmNNtr+OBRJUlgkNJEo78P4b0yRw= sha512-nNo+yCHEyn0smMxSswnf/OnX6/KwJuZTlNZBjauKhTK0c+zT+q5JOCx0UFhXQ6rJR9jg6Es8gPuD2uZcYDLqSw==" crossorigin="anonymous">
          <link href="https://cdnjs.cloudflare.com/ajax/libs/epoch/0.5.2/epoch.min.css" rel="stylesheet" />
          <link href="dashboard.css" rel="stylesheet" />
     </head>
     <body>
          <div class="navbar-nav navbar-inverse navbar-fixed-top">
                    <div class="container">
                    <div class="navbar-header">
                         <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse">
                              <span class="icon-bar"></span>
                              <span class="icon-bar"></span>
                              <span class="icon-bar"></span>
                         </button>
                         <a class="navbar-brand" href="index.html">
                              Call Tracking Dashboard
                         </a>
                    </div>
                         <div class="navbar-collapse collapse">
                              <ul class="nav navbar-nav">
                                   <li class="active">
                                        <!-- <a href="index.html">
                                             <i class="icon-home icon-white"></i> Home
                                        </a> -->
                                   </li>
                              </ul>
                         </div><!--/.nav-collapse -->
                    </div>
          </div>

          <div class="container">

               <div class="row">

                    <div class="col-sm-12 col-lg-12">
                         <article class="widget">
                              <div class="widget-inner">

                                   <header>
                                        <h1>Calls</h1>
                                   </header>

                                   <section class="widget-body">
                                        <div id="calls" class="epoch" style="height: 200px;"></div>
                                   </section>

                              </div><!-- .widget-inner -->

                         </article>
                    </div>

               </div>

               <div class="row">

                    <div class="col-sm-6 col-lg-6">
                         <article class="widget">
                              <div class="widget-inner">

                                   <header>
                                        <h1>Incoming Number</h1>
                                   </header>

                                   <section class="widget-body">
                                        <div id="numbers" class="epoch" style="height: 200px;"></div>
                                   </section>

                              </div><!-- .widget-inner -->

                         </article>
                    </div>

                    <div class="col-sm-6 col-lg-6">
                         <article class="widget">
                              <div class="widget-inner">

                                   <header>
                                        <h1>City</h1>
                                   </header>

                                   <section class="widget-body">
                                        <div id="cities" class="epoch" style="height: 200px;"></div>
                                   </section>

                              </div><!-- .widget-inner -->

                         </article>
                    </div>
               </div>

          </div>

     <script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.1.4/jquery.min.js"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/d3/3.5.10/d3.min.js"></script>
     <script src="https://cdnjs.cloudflare.com/ajax/libs/epoch/0.5.2/epoch.min.js"></script>
     <script src="https://cdn.flybase.io/flybase.js"></script>
     <script src="dashboard.js"></script>
</body>
</html>

Twilio 和 Flybase 实时通信高级教程(二)

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
  • 51
  • 52
  • 53
  • 54
  • 55
  • 56
  • 57
  • 58
  • 59
  • 60
  • 61
  • 62
  • 63
  • 64
  • 65
  • 66
  • 67
  • 68
  • 69
  • 70
  • 71
  • 72
  • 73
  • 74
  • 75
  • 76
  • 77
  • 78
  • 79
  • 80
  • 81
  • 82
  • 83
  • 84
  • 85
  • 86
  • 87
  • 88
  • 89
  • 90
  • 91
  • 92
  • 93
  • 94
  • 95
  • 96
  • 97
  • 98
  • 99
  • 100
  • 101
  • 102
  • 103

接下来,您将创建一个名为dashboard.js的文件:

$( function() {
     var calls = $('#calls').epoch( {
          type: 'time.area', axes: ['left', 'bottom', 'right'],
          data: [ { values: [ { time: Date.now()/1000, y: 0 } ] } ]
     } );
     var numbers = $( '#numbers' ).epoch( { type: 'bar' } );
     var cities = $( '#cities' ).epoch( { type: 'bar' } );
     var stats = {
          cities: {},
          numbers: {}
     };

     var dashboard = new Flybase("YOUR-FLYBASE-API-KEY", "calltracking", "stats");

     dashboard.once('value', function (data) {
          updateStats( data );
     });

     dashboard.on( 'added', function (data ){
          updateStats( data );
     });

     function updateStats( data ){
          //     process the new data...
          data.forEach( function( snapshot ){
               var row = snapshot.value();

               calls.push( [ { time: row.time, y: 1 } ] );

               var cityCount = stats.cities[ row.city ] || 0;
               stats.cities[ row.city ] = ++cityCount;

               var numberCount = stats.numbers[ row.number ] || 0;
               stats.numbers[ row.number ] = ++numberCount;
          });

          var citiesData = [];
          for( var city in stats.cities ) {
               citiesData.push( { x: city, y: stats.cities[ city ] } );
          }
          cities.update( [ { values: citiesData } ] );

          var numbersData = [];
          for( var number in stats.numbers ) {
               numbersData.push( { x: number, y: stats.numbers[ number ] } );
          }
          numbers.update( [ { values: numbersData } ] );

     }
});

Twilio 和 Flybase 实时通信高级教程(二)

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
  • 51

这是我们仪表板的大脑;它处理所有的电话,并显示在仪表板上。

最后,我们来添加一些 CSS。

创建一个名为“dashboard.css”的文件,并添加以下内容:

body {
  font: 400 0.95em/1 "Proxima Nova", Helvetica,sans-serif;
  font-size: .875em;
  background-color: #f0f0f0;

  padding-top: 90px;
}

.widget {
  -webkit-box-shadow: #f0f0f0 0 0 8px;
  -moz-box-shadow: #f0f0f0 0 0 8px;
  box-shadow: #f0f0f0 0 0 8px;
  background-color: #f0f0f0;

  margin-bottom: 30px;
}

.widget h1 {
  font-size: 1.0em;
  margin: 0 0 .4em;
  font-weight: bold;
}

.widget .widget-inner>header, .widget .widget-inner>footer {
  font-size: 12px;
  text-shadow: 1px 1px #0e0e0e;
}

.widget .widget-inner>header {
  background-color: #272727;
  text-transform: uppercase;
  padding: 16px 12px 16px 26px;
  font-weight: 700;
}

.widget .widget-inner {
  border: solid 1px #e5e5e5;
  background-color: #fff;
}

.widget .widget-inner>header {
  background-color: #f5f5f5;
}

.widget .widget-inner>header h1 {
  color: #8b8b8b;
  text-shadow: 1px 1px #fff;
  margin-bottom: 0;
}

.widget .widget-body {
  color: #666;

  height: 225px
}

.widget .widget-body {
  padding: 16px;
  color: #d3d4d4;
  font-family: Helvetica, Arial, sans-serif;
  z-index: 1;
}

.widget .widget-inner>footer {
  color: #8b8b8b;
  background-color: #f5f5f5;
  text-shadow: 1px 1px #fff;
}

.dash-unit {
  margin-bottom: 30px;
  padding-bottom: 10px;
  border: 1px solid #e5e5e5;
  /*background-image: url('../img/sep-half.png');*/
  background-color: #f5f5f5;
  color: #8b8b8b;
  height: 290px;
  text-align: center;
}

.dash-unit dtitle {
  font-size: 11px;
  text-transform: uppercase;
  margin: 8px;
  padding: 0px;
  height: inherit;
}

.dash-unit hr {
  border: 0;
  border-top: 1px solid #151515;
  border-top-style: dashed;
  margin-top: 3px;
}

Twilio 和 Flybase 实时通信高级教程(二)

  • 1
  • 2
  • 3
  • 4
  • 5
  • 6
  • 7
  • 8
  • 9
  • 10
  • 11
  • 12
  • 13
  • 14
  • 15
  • 16
  • 17
  • 18
  • 19
  • 20
  • 21
  • 22
  • 23
  • 24
  • 25
  • 26
  • 27
  • 28
  • 29
  • 30
  • 31
  • 32
  • 33
  • 34
  • 35
  • 36
  • 37
  • 38
  • 39
  • 40
  • 41
  • 42
  • 43
  • 44
  • 45
  • 46
  • 47
  • 48
  • 49
  • 50
  • 51
  • 52
  • 53
  • 54
  • 55
  • 56
  • 57
  • 58
  • 59
  • 60
  • 61
  • 62
  • 63
  • 64
  • 65
  • 66
  • 67
  • 68
  • 69
  • 70
  • 71
  • 72
  • 73
  • 74
  • 75
  • 76
  • 77
  • 78
  • 79
  • 80
  • 81
  • 82
  • 83
  • 84
  • 85
  • 86
  • 87
  • 88
  • 89
  • 90
  • 91
  • 92
  • 93
  • 94
  • 95

摘要

你可以在任何地方运行它。您只需将您想要追踪的 Twilio 电话号码指向您添加到该网站的 URL,并以/call作为终点。在 GitHub 可以看到完整的代码库: https://github.com/flybaseio/call-tracking

© 版权声明

相关文章

暂无评论

您必须登录才能参与评论!
立即登录
暂无评论...