背景

公司为提高客服部门沟通效率对接电话呼叫中心,调研后选择了亚马逊的Amazon Connect服务,因为是国外业务没有选择用阿里云,怕有坑。

Amazon Connect后台

需要在后台创建“联系流”,也就是用户接通电话后我们提供的一系列功能选项,比如开始放一段欢迎语音,然后提示用户选择1,2,4,*,#等,每一个选项可能又对应了一条“联系流”,整体的功能就是围绕着“联系流”来进行的,用户输入的一些值可以通过 contact.getAttributes() 拿到。

前端对接

需要引入 amazon-connect-1.3.js, 这是一个开源项目(https://github.com/aws/amazon-connect-streams)所有前端接打电话的界面功能都是基于这个库来完成的。

connect.contact(): 主要获取联系人信息(姓名,电话等)还有联系人输入的一些值。
connect.agent(): 主要获取电话设备的一些状态信息。

HTML:

  1. <!-- 电话图标,用来唤出电话界面 -->
  2. <div id="amazonConnectContainer">
  3. <img src="/Public/img/amazon_tel.jpg" alt="">
  4. </div>
  5. <!-- 生成iframe的地方,可以放在网页任意位置 -->
  6. <div id="containerDiv" title="Amazon Connect">
  7. <!--Amazon CCP is hiding in here-->
  8. </div>

CSS:

  1. <style>
  2. .containerDiv iframe {
  3. display: none;
  4. }
  5. </style>

JS:

  1. <script type="text/javascript" src="/Public/lib/connect-streams.js"></script>
  2. <script type="text/javascript">
  3. $(document).ready(function() {
  4. $("#amazonConnectContainer").click(function(event) {
  5. event.preventDefault();
  6. $("#containerDiv iframe").remove();
  7. if(typeof connect != "undefined" && !connect.core.initialized){
  8. window.myCPP = window.myCPP || {};
  9. //replace with the CCP URL for your Amazon Connect instance
  10. var ccpUrl = "https://xxxxxx.awsapps.com/connect/ccp#/";
  11. connect.core.initCCP(containerDiv, {
  12. ccpUrl: ccpUrl,
  13. loginPopup: false,
  14. softphone: {
  15. allowFramedSoftphone: true,
  16. disableRingtone: true,
  17. ringtoneUrl: true
  18. }
  19. });
  20. connect.contact(subscribeToContactEvents);
  21. connect.agent(subscribeToAgentEvents);
  22. }
  23. var awidth = 320; //窗口宽度
  24. var aheight = 465; //窗口高度
  25. var atop = (screen.availHeight - aheight) / 2; //窗口顶部位置
  26. var aleft = (screen.availWidth - awidth) / 2; //窗口放中央
  27.  
  28. window.open (ccpUrl, 'newwindow', 'height=465, width=320, top='+atop+', left='+aleft+', toolbar=no, menubar=no, scrollbars=no, resizable=no,location=no, status=no');
  29. });
  30.  
  31. function subscribeToContactEvents(contact){
  32. window.myCPP.contact = contact;
  33. logInfoMsg("Subscribing to events for contact");
  34. if (contact.getActiveInitialConnection()
  35. && contact.getActiveInitialConnection().getEndpoint()) {
  36. logInfoMsg("New contact is from " + contact.getActiveInitialConnection().getEndpoint().phoneNumber); // 用户电话
  37. } else {
  38. logInfoMsg("This is an existing contact for this agent");
  39. }
  40. logInfoMsg("Contact is from queue " + contact.getQueue().name);
  41. logInfoMsg("Contact attributes are " + JSON.stringify(contact.getAttributes())); // 用户属性
  42. }
  43. function subscribeToAgentEvents(agent) {
  44. window.myCPP.agent = agent;
  45. agentGreetingDiv.innerHTML = '<h3>Hi ' + agent.getName() + '!</h3>';
  46. logInfoMsg("Subscribing to events for agent " + agent.getName());
  47. logInfoMsg("Agent is currently in status of " + agent.getStatus().name);
  48. // 获取电话状态名称
  49. displayAgentStatus(agent.getStatus().name);
  50. // agent.onRefresh(handleAgentRefresh);
  51. // agent.onRoutable(handleAgentRoutable);
  52. // agent.onNotRoutable(handleAgentNotRoutable);
  53. // agent.onOffline(handleAgentOffline);
  54. }
  55. function logInfoMsg(msg) {
  56. connect.getLog().info(msg);
  57. }
  58. });
  59. </script>

亚马逊 amazon connect(呼叫中心)的更多相关文章

  1. 在亚马逊amazon的AWS上安装Node和MongoDB服务器

    在亚马逊amazon的AWS上安装Node和MongoDB服务器 在建立AWS上账号.创建EC2 ,用putty链接上之后,就可以用下面的方法开始安装. !!! 如果不是是自己建立的EC2, 而是由B ...

  2. 通过SecureCRT访问亚马逊Amazon EC2主机

    亚马逊推出了免费的云主机服务器 Amazon EC2,它是通过安全密钥来访问主机的. 问题是下载的密钥在SecureCRT 上无法直接使用,需要转换. 下面的方法可以在自己的linux主机上生成sec ...

  3. [2014亚马逊amazon] 在线笔试题 大于非负整数N的第一个回文数 Symmetric Number

    1.题目 如标题,求大于整数N(N>=0)的第一个回文数的字符串表示形式. 这个题目也是当时笔试第一次见到,花了一个小时才做出了.慢慢总结还是挺简单的. 2.分析 分析如下: (1)一位数N(9 ...

  4. U盘版Windows 10已经在亚马逊Amazon開始接受预订啦

    Windows 10定于下周7月29日正式公布. Windows 10家庭版119美元.专业版199美元,这个价格包含 Windows 10 授权.

  5. 亚马逊AWS业务副总裁:如何在基础设施上降成本

    腾讯科技 林靖东 11月17日编译 亚马逊Amazon Web Services业务的副总裁.著名工程师詹姆斯汉密尔顿(James Hamilton)在AWS re:Invent大会上解释了公司是如何 ...

  6. 亚马逊与Twitter携手电子商务

    亚马逊(Amazon)与Twitter开展了合作,允许用户以Twitter消息的形式将喜欢的商品发送到购物篮中.这些高科技企业正在想办法把社交媒体和电子商务融为一体. 这一功能旨在将Twitter转变 ...

  7. 亚马逊拟斥资15亿美元建航空货运中心 - Amazon to spend $1.49 bln on air cargo hub, fans talk of bigger ambitions - ReutersFebruary 1, 2017

    2月1日消息,亚马逊本周二宣布将在肯塔基州开建其第一个航空货运中心,以应对高速增长的航空货运需求.亚马逊预计,该项目将带来2000个工作岗位. 据悉,该项计划总投入约为15亿美元,亚马逊或可从当地政府 ...

  8. Amazon EMR(Elastic MapReduce):亚马逊Hadoop托管服务运行架构&Hadoop云服务之战:微软vs.亚马逊

    http://s3tools.org/s3cmd Amazon Elastic MapReduce (Amazon EMR)简介 Amazon Elastic MapReduce (Amazon EM ...

  9. [转]Amazon AWS亚马逊云服务免费一年VPS主机成功申请和使用方法

    今天部落将再次为大家介绍如何成功申请到来自亚马逊的Amazon AWS免费一年的VPS主机服务.亚马逊公司这个就不用介绍了,是美国最大的一家网络电子商务公司,亚马逊弹性计算云Amazon EC2更是鼎 ...

随机推荐

  1. [Swift]LeetCode63. 不同路径 II | Unique Paths II

    A robot is located at the top-left corner of a m x n grid (marked 'Start' in the diagram below). The ...

  2. [Swift]LeetCode81. 搜索旋转排序数组 II | Search in Rotated Sorted Array II

    Suppose an array sorted in ascending order is rotated at some pivot unknown to you beforehand. (i.e. ...

  3. [Swift]LeetCode171. Excel表列序号 | Excel Sheet Column Number

    Given a column title as appear in an Excel sheet, return its corresponding column number. For exampl ...

  4. python bz2模块

    bz2模块提供了使用bzip2算法压缩和解压缩数据一套完整的接口. bz2模块包括: 用于读写压缩文件的open()函数和BZ2File类 用于一次性压缩和解压缩的compress() 和 decom ...

  5. 手把手的教你安装PyCharm --Pycharm安装详细教程(一)(非常详细,非常实用)

    简介 Jetbrains家族和Pycharm版本划分: pycharm是Jetbrains家族中的一个明星产品,Jetbrains开发了许多好用的编辑器,包括Java编辑器(IntelliJ IDEA ...

  6. 【转】CGI

    CGI是什么 (一): CGI是Common Gateway Interface 的简称.是一个用于定Web服务器与外部程序之间通信方式的标准,使得外部程序能生成HTML.图像或者其他内容,而服务器处 ...

  7. 【WebApi】通过HttpClient调用Web Api接口

    HttpClient是一个封装好的类,它在很多语言中都有被实现,现在HttpClient最新的版本是4.5. 它支持所有的http方法,自动转向,https协议,代理服务器. 一.Api接口参数标准化 ...

  8. C#版 - Leetcode 306. 累加数 - 题解

    版权声明: 本文为博主Bravo Yeung(知乎UserName同名)的原创文章,欲转载请先私信获博主允许,转载时请附上网址 http://blog.csdn.net/lzuacm. C#版 - L ...

  9. 学习springboot

    一般而言,写个Javaweb应用搭建环境都可能要几十分钟,下载个tomcat服务器,再加上各种xml配置等等,很烦躁,而且每个web应用的配置还差不多,都是什么web.xml,application. ...

  10. vue的基本操作

    vue的基本概念   挂载点:就是el属性对应html中的节点,实例只会处理挂载点下的内容. 模版:在挂载点内部的内容,也可以将模版内容卸载实例里面 如果有template属性会用模版替换外部html ...