首页 > 解决方案 > 如何为工作的 php 应用程序创建一个 post html 页面?

问题描述

我正在学习编码,我制作了一个简单的 php 应用程序,该应用程序在给定硬编码的往返号码的情况下拨打电话(它使用 Twilio api - www.twilio.com)。

代码如下所示:

<?php

require_once '/path/to/vendor/autoload.php';

use Twilio\Rest\Client;

$sid    = "ACXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXXX";
$token  = "your_auth_token";
$twilio = new Client($sid, $token);

$call = $twilio->calls
       ->create("+15558675310", // to
                "+15017122661", // from
                array("url" => "http://demo.twilio.com/docs/voice.xml")
       );

print($call->sid);

上面的 php 应用程序工作得很好。

我现在要做的是创建一个 html 页面,该页面采用动态数字(来自数字的静态),当我点击提交按钮时,调用应该通过。但是,除了 twilio 文档( https://www.twilio.com/docs/voice/api/call#create-a-call-resource)中的以下片段外,我不知道如何实现这一点

可以通过 REST API 调用电话号码、SIP 地址或客户端标识符。要发出新的出站呼叫,请向您帐户的呼叫资源发出 HTTP POST 请求。

由此,我知道我必须通过 html 表单页面进行发布调用,但是我从哪里开始对 URL 进行发布调用,如上述文档中所示(https://api.twilio.com/2010-04 -01/Accounts/ {AccountSid}/Calls.json)我在哪里保存我在上面复制粘贴的 php 应用程序中的身份验证详细信息?文档说我必须在拨打电话时提供一个 for 和 to 号码,我再次不确定在哪里提供。

<html>
 <body>
  <form action="twilioCall.php" method="post"> 
   From: <input type="number" name="from">
   To: <input type="number" name="to">
   <input type="submit">
  </form>
 </body>
</html>

任何帮助/指针都会非常有帮助。提前致谢!

标签: phphtmlformspost

解决方案


为了使用带有 Twilio 的笔记本电脑/计算机在浏览器中拨打电话,您需要Twilio 客户端库,还需要安装Twilio PHP 库

这假设您已经创建了一个 Twilio 帐户并购买了一个具有语音和短信功能的 twilio 号码。我假设您已经安装了 Twilio PHP 库。

当您按下“makeCall”按钮时,系统会提示您使用麦克风。选择您用来与笔记本电脑通话的任何麦克风。戴上耳机,给自己打电话。很有意思!

做这个 :

  1. 找到您的Twilio 帐户 SID和主身份验证令牌。

  2. 创建一个TwiML APP并将语音请求 URL 指向 https://EXAMPLEmywebsite.com/voice.php

语音.php

<?php
include '../twilio/Twilio/autoload.php';

use Twilio\Twiml;

$response = new Twiml;

//THE PHONE NUMBER YOU HAVE PURCHASED
$TWILIO_CALLER_ID = '';

// get the phone number from the page request parameters, if given
if (isset($_REQUEST['To']) && strlen($_REQUEST['To']) > 0) {
    $number = htmlspecialchars($_REQUEST['To']);
    $dial = $response->dial(array
            ('callerId' => $TWILIO_CALLER_ID, 
                                   'record' => 'record-from-answer'
        ));

  if($number == "English Queue" || $number== "Spanish Queue") {
     $dial->queue($number);
  } 
  elseif (preg_match("/^[\d\+\-\(\) ]+$/", $number)) {
     $dial->number($number);
    } else {
      $dial->client($number);
    }
} else {
    $response->say("Thanks for calling!");
}

header('Content-Type: text/xml');
echo $response;

拨号盘.php

  <!-- jquery -->
 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>

  <!-- Twilio Client IMPORTANT -->
   <script src="https://media.twiliocdn.com/sdk/js/client/v1.6/twilio.min.js"></script>

    //display phone logs
    <div id="log"></div>

    //simple basic dialpad
    <input id="phoneScreen" placeholder="enter phone number">

    //dial button
    <button id="makeCall" class="btn btn-success btn-dial">
    <img src="https://img.icons8.com/ios/25/000000/ringer-volume.png">
    </button>

    //hang up button
    <button id="endCall" class="btn btn-danger btn-dial">
    <img src="https://img.icons8.com/ios/25/000000/end-call.png">
    </button>

    //include twilioClient.js
    <script src="twilioClient.js"></script>

twilioClient.js

$(function () {

    log('Connecting Agent Station...');

    $.getJSON('./token.php').done(function (data) {
        log('Agent Station Connected.');
        //console.log('Token: ' + data.token);

        // Setup Twilio.Device
        Twilio.Device.setup(data.token);

        Twilio.Device.ready(function (device) {
            log('Phone Ready For Call');
        });

        Twilio.Device.error(function (error) {
            log('Agent Station Error: ' + error.message);

            //update call log

        });

        Twilio.Device.connect(function (conn) {
            log('Success! Call Established.');
        });

        Twilio.Device.disconnect(function (conn) {
            log('Call ended.');
        });

//bind button to answer incoming call?
        document.getElementById('answerCall').onclick = function () {
            // get the phone number to connect the call to
            var queueName = document.getElementById('queuename').value;
            var params = {
                To: queueName
            };
            log('Connecting agent to ' + params.To + '...');
            Twilio.Device.connect(params);
        };

        setClientNameUI(data.identity);
    })
            .fail(function () {
                log('Could not connect agent station to server!');
            });

    // Bind button to make call
    document.getElementById('makeCall').onclick = function () {

        // get the phone number to connect the call to
        var params = {
            To: document.getElementById('phoneScreen').value
        };

        log('Calling ' + params.To + '...');
        Twilio.Device.connect(params);

        Twilio.Device.connect(function (connection) {

            //retrieve call sid
            var callSid = connection.parameters.CallSid;

            //retrieve phone number
            var phonenumber = $('#phoneScreen').val();

        });
    };

    // Bind button to hangup call
    document.getElementById('endCall').onclick = function () {
        log('Hanging up...');
        Twilio.Device.disconnectAll();
    };

});

// Activity log
function log(message) {
    var logDiv = document.getElementById('log');
    logDiv.innerHTML += '<p>&gt;&nbsp;' + message + '</p>';
    logDiv.scrollTop = logDiv.scrollHeight;
}

令牌.php

<?php
include '../twilio/Twilio/autoload.php';
use Twilio\Jwt\ClientToken;

// choose a random username for the connecting user
$identity = "Caller".rand(9, 99999).round(microtime(true) * 1000).date('Y');

 //twilio account sid
 $TWILIO_ACCOUNT_SID = 'YOUR_TWILIO_ACCOUNT_SID';
 //twilio auth token
$TWILIO_AUTH_TOKEN = 'YOUR_TWILIO_AUTH_TOKEN';
//twilio app sid
$TWILIO_TWIML_APP_SID = 'YOUR_TWIMl_APP_SID';

$capability = new ClientToken($TWILIO_ACCOUNT_SID, $TWILIO_AUTH_TOKEN);
$capability->allowClientOutgoing($TWILIO_TWIML_APP_SID);
$capability->allowClientIncoming($identity);
$token = $capability->generateToken();

// return serialized token and the user's randomly generated ID
header('Content-Type: application/json');
echo json_encode(array(
    'identity' => $identity,
    'token' => $token,
));

推荐阅读