sip-dialpad-react

v0.0.8

Published

2 months ago

一个基于 React 的 SIP 拨号盘 SDK，可以轻松集成到任何网站中。

Downloads

0High
0Medium
0Low

moca_tao7

SIP Dialpad React SDK

一个基于 React 的 SIP 拨号盘 SDK，可以轻松集成到任何网站中。

特性

🚀 轻量级，单文件 SDK
📱 响应式设计
🎨 可自定义主题
🔧 简单易用的 API
📦 支持 UMD 和 ES 模块
test

安装方式

方法一：CDN 引入（推荐）

<!DOCTYPE html>
<html>
    <head>
        <title>SIP Dialpad SDK</title>
    </head>
    <body>
        <!-- 引入React和ReactDOM -->
        <script crossorigin src="https://pub-res.hermesomni.com/sdk/js-sip/sip-dialpad-sdk.latest.js"></script>
        <div id="dialpad-container"></div>
        <button id="makeCall">call</button>

        <script>
        console.log('SDK 已加载:', typeof SipDialpadSDK);
        console.log('SDK 内容:', SipDialpadSDK);

        try {
            // 正确的调用方式
            const sdk = SipDialpadSDK.createSipDialpadSDK();
            console.log('SDK 实例创建成功:', sdk);

            // 尝试渲染 SDK
            sdk.render("dialpad-container", {extNo: "xxx", extPwd: "xxx", iframe: { width: 800, height: 600, url: 'https://baidu.com'}});
            console.log('SDK 渲染成功');
            // call
            document.getElementById('makeCall').addEventListener('click', () => {
                sdk.makeCall('12345679',{
                 ticketId:"",
                 orderId:"",
                 businessId:"",
             })
            })
        } catch (error) {
            console.error('SDK 错误:', error);
        }
    </body>
</html>

<!DOCTYPE html>
<html>
    <head>
        <title>SIP Dialpad SDK</title>
    </head>
    <body>
        <script crossorigin src="https://pub-res.hermesomni.com/sdk/js-sip/sip-dialpad-sdk.latest.js"></script>
    </body>
</html


<script setup lang="ts">
import { ref } from "vue";

function renderDialpad() {
  const sdk = SipDialpadSDK.createSipDialpadSDK();
  console.log("SDK 实例创建成功:", sdk);

  // 尝试渲染 SDK
  sdk.render("dialpad-container", {extNo: "xxx", extPwd: "xxx", iframe: { width: 800, height: 600, url: 'https://baidu.com'}});
  console.log("SDK 渲染成功");
  // call
  const call = ()=>{
    sdk.makeCall('12345679',{
         ticketId:"",
         orderId:"",
         businessId:"",
     })
  }
}
</script>

<template>
  <div>
    <button @click="renderDialpad">渲染</button>
    <div id="dialpad-container"></div>
    <button @click="call">call</button>
  </div>
</template>

<style scoped></style>

<!DOCTYPE html>
<html>
    <head>
        <title>SIP Dialpad SDK</title>
    </head>
    <body>
        <script crossorigin src="https://pub-res.hermesomni.com/sdk/js-sip/sip-dialpad-sdk.latest.js"></script>
    </body>
</html>

const Home = ()=>{
    const renderDialpad = ()=>{
        const sdk = SipDialpadSDK.createSipDialpadSDK();
        console.log("SDK 实例创建成功:", sdk);

        // 尝试渲染 SDK
        sdk.render("dialpad-container", {extNo: "xxx", extPwd: "xxx", iframe: { width: 800, height: 600, url: 'https://baidu.com'}});
        console.log("SDK 渲染成功");
        // 代码调用打电话
        const call = ()=>{
            sdk.makeCall('12345679',{
             ticketId:"",
             orderId:"",
             businessId:"",
         })
        }
    }

    return (
        <div>
            ok
            <button onClick={renderDialpad}>render</button>
            <div id="dialpad-container" />
            <button onClick={call}>call</button>
        </div>
    )
}

Published

Vulnerabilities

Links

Maintainers

Keywords

Readme

SIP Dialpad React SDK

特性

安装方式

方法一：CDN 引入（推荐）