Bootstrap

jssip(二)——使用(拨号)

简介

这一章主要讲jssip的使用,需要看安装与配置的可以在下放链接中查看对应的内容。
jssip(一)——安装与配置

https://blog.csdn.net/xuelong5201314/article/details/132604950

需求

jssip用到的主要是链接sip、断开链接sip、拨打电话、挂断电话、来电监听、来电接听、挂断来电、二次拨号以及电话监听挂和断监听

使用

这里只提供简单的使用逻辑,界面什么的就自己设计吧。

<script>
import jssip from '@/utils/jssipInit'
export default {
	data() {
    	return {
    		phone: null, // 电话号
	    	JsSipURL: 'www.abc.com', // JsSipURL 这里是域名,当然本地的话加端口号即可
	      	password: '123', // JsSipPassword 这个密码要与后端约定好
	      	username: '', // 分机号
    		phoneState: '', // 用来控制界面拨打的状态
    		incomingCall: false // 来电状态 来电弹窗状态
    	}
    },
    created() {
    	// 监听sip状态
		this.$bus.$on('sessionData', (data) => { // 监听sip
			switch (data.state) {
		        case 'unregistered': // 注销
          			this.$message.warning('sip已注销')
          			break
		        case 'registered': // 注册成功
					this.$message.success('sip注册成功')
					break
        		case 'ended': // 通话结束
            		// 这里写挂断后逻辑
          			break
        		case 'progress': // 呼叫中
          			this.phoneState = 2
          			break
        		case 'confirmed': // 呼叫确认
          			this.phoneState = 1
          			break
        		case 'failed': // 通话失败
          			this.incomingCall = false
          			this.phoneState = 0
          			break
        		case 'progress-remote': // 来电中
            		this.incomingCall = true
            		// 来电后逻辑
            		this.phoneState = 5
          		}
          		break
        	default:
          		break
      		}
    	})
    	window.addEventListener('beforeunload', this.onBeforeunload)// 关闭窗口调用事件
	},
	mounted() {
    	this.initLink()
  	},
  	methods: {
  		// 初始化链接
	    initLink() {
	    	// username分机号 password密码 url域名 port端口 
			jssip.jssipInit({ username: this.username, password: this.password, url: this.JsSipURL, port: '5072' })
	    },
	    // 断开sip
	    unregistered() {
	      jssip.unregister()
	    },
	    onBeforeunload(e) {
	      jssip.unregister() // 断开jssip
	    },
	    // 二次拨号号码
	    onDTMFFun(dtmfNumber) {
	    	jssip.dtmf(dtmfNumber)
	    },
	    // 呼叫
	    onClickPhone(phone) {
	      this.phone = phone
	      const len = this.phone.length
	      if (this.phone.length === 11) {
	        jssip.call({ phone: this.phone, url: this.JsSipURL })
	        layoutAPI.callStatus()
	      } else {
	        if (this.phone.length=== 0) {
	          this.$message.error('请输入号码!')
	        } else {
	          this.$message.error('您输入号码不对,请输入正确的号码!')
	        }
	      }
	    },
	    // 点击挂断
	    onClickHangUp() {
	      this.phoneState = 0
	      jssip.hangUp()
	    },
	    // 点击接听来电
	    onAnswer() {
	      // 接听来电逻辑
	      jssip.answer()
	      this.incomingCall = false
	    },
	    // 点击挂断来电
	    onHangUp() {
	      // 挂断逻辑
	      jssip.hangUp()
	      this.incomingCall = false
	    },
	    // 监听
	    onListen() {
	      // 监听逻辑
	      jssip.answer()
	    },
	    // 关闭监听
	    listenInClose() {
	      // 关闭监听逻辑
	      jssip.hangUp()
	    },
  	}
}
</script>
;