chikka 语音访谈

chikka 语音访谈插件,需要结合chikka.ai 平台一起使用。通过平台创建访谈后，从访谈设置页面获取访谈链接，比如获取的访谈链接是https://product.chikka.ai/interview2/QWqz2G,最后面的QWqz2G为组件的access_code

使用

目前只支持 React

安装插件

npm i chikka-interview

例子

import { ChikkaVoice } from 'chikka-interview'
import { useState, useEffect } from 'react'
function App() {
  //start end,访谈完成后会自动触发结束的，不需要手动触发，手动触发是没有访谈数据的
  const [interviewStatus, setInterviewStatus] = useState('') //控制访谈开始

  //excellent,good,poor,lost,unknown
  const [connectionQuality, setConnectionQuality] = useState('') //连接信号质量

  // initializing,disconnected,connecting,speaking,listening
  const [voiceState, setVoiceState] = useState('disconnected') //语音状态

  //1:访谈未开始，2:访谈中，3：访谈完成
  const [ifEnd, setIfEnd] = useState(1) //判断访谈是否完成

  const [interviewData, setInterviewData] = useState([]) //访谈完后的数据

  //1:正常 2.access_code无效 3.访谈已经关闭 4.访谈超过最大访谈数量 5 访谈到达截止时间
  const [interviewSettingDataStatus, setInterviewSettingDataStatus] =
    useState(1) //访谈基础数据和设置的响应状态

  //Chinese,English,Japanese,Spanish,Korean,German
  const [language, setLanguage] = useState('Chinese') //切换语言

  useEffect(() => {
    //访谈完成后，初始化访谈状态
    if (ifEnd === 3) {
      setInterviewStatus('')
    }
  }, [ifEnd])

  return (
    <div className="container">
      <button
        onClick={() => {
          setInterviewStatus('start')
          setInterviewData([]) //初始化访谈数据
        }}
      >
        开始访谈
      </button>
      <button
        onClick={() => {
          setInterviewStatus('end')
        }}
      >
        手动结束访谈
      </button>
      <ChikkaVoice
        interviewStatus={interviewStatus}
        access_code="QWqz2G"
        language={language}
        setConnectionQuality={setConnectionQuality}
        setVoiceState={setVoiceState}
        setIfEnd={setIfEnd}
        setInterviewData={setInterviewData}
        setInterviewSettingDataStatus={setInterviewSettingDataStatus}
      ></ChikkaVoice>
      <div>interviewStatus:{interviewStatus}</div>
      <div>
        连接信号质量：{connectionQuality}
        -------(excellent,good,poor,lost,unknown)
      </div>
      <div>
        语音状态：{voiceState}
        ------(initializing,disconnected,connecting,speaking,listening)
      </div>
      <div>
        访谈是否结束状态：{ifEnd}------(1:访谈未开始，2:访谈中，3：访谈结束)
      </div>
      <div>
        访谈基础数据和设置的响应状态：{interviewSettingDataStatus}
        ---------(1:正常 2.access_code无效 3.访谈已经关闭 4.访谈超过最大访谈数量
        5 访谈到达截止时间)
      </div>
      <div>访谈完后的数据：{JSON.stringify(interviewData)}</div>
    </div>
  )
}

export default App