前端接入科大讯飞星火认知大模型API #

ws(s)://spark-api.xf-yun.com/v2.1/chat
ws(s)://spark-api.xf-yun.com/v3.1/chat

const requestObj = {
  APPID: '你的appid',
  APISecret: '你的apisecret',
  APIKey: '你的apikey',
  Uid: 'xzm', // 说明下uid自己定，唯一就行
  sparkResult: '', // 这里放你获取到的结果
}

// 鉴权url地址
const getWebsocketUrl = () => {
  return new Promise((resovle, reject) => {
    // let url = "wss://spark-api.xf-yun.com/v1.1/chat";
    let url = 'wss://spark-api.xf-yun.com/v2.1/chat' // 可以改成2.1的接口
    let host = 'spark-api.xf-yun.com' // 主机地址
    let apiKeyName = 'api_key' // API密钥的参数名
    let date = new Date().toGMTString() // 当前时间的GMT字符串表示
    let algorithm = 'hmac-sha256'// 使用的哈希算法
    let headers = 'host date request-line' // 鉴权所需的头部信息
    // let signatureOrigin = `host: ${host}\ndate: ${date}\nGET /v1.1/chat HTTP/1.1`;
    let signatureOrigin = `host: ${host}\ndate: ${date}\nGET /v2.1/chat HTTP/1.1` // 构建用于生成签名的原始字符串
    // 加密方法
    let signatureSha = CryptoJs.HmacSHA256(
      signatureOrigin,
      requestObj.APISecret
    )
    // 生成的加密签名
    let signature = CryptoJs.enc.Base64.stringify(signatureSha)
    // 构建鉴权头部信息
    let authorizationOrigin = `${apiKeyName}="${requestObj.APIKey}", algorithm="${algorithm}", headers="${headers}", signature="${signature}"`
    let authorization = base64.encode(authorizationOrigin)
    // 构建最终的 WebSocket URL
    url = `${url}?authorization=${authorization}&date=${encodeURI(
      date
    )}&host=${host}`
    resovle(url)
  })
}

// 发送消息
const sendMsg = async () => {
  // 获取请求地址
  const myUrl = await getWebsocketUrl()
  // 获取输入框中的内容
  // 每次发送问题 都是一个新的websocket请求
  let socket = new WebSocket(myUrl)
  // 监听websocket的各阶段事件 并做相应处理
  socket.addEventListener('open', (event) => {
    console.log('开启连接！！', event)
    // 发送消息
    let params = {
      header: {
        app_id: requestObj.APPID,
        uid: requestObj.Uid,
      },
      parameter: {
        chat: {
          // "domain": "general",
          domain: 'generalv2',
          temperature: 0.5,
          max_tokens: 1024,
        },
      },
      payload: {
        message: {
          // 如果想获取结合上下文的回答，需要开发者每次将历史问答信息一起传给服务端，如下示例
          // 注意：text里面的所有content内容加一起的tokens需要控制在8192以内，开发者如有较长对话需求，需要适当裁剪历史信息
          text: [
            { role: 'user', content: inputVal.value }, //# 最新的一条问题，如无需上下文，可只传最新一条问题
          ],
        },
      },
    }
    socket.send(JSON.stringify(params))
  })
  socket.addEventListener('message', (event) => {
    let data = JSON.parse(event.data)
    console.log('收到消息！！', data)
    requestObj.sparkResult += data.payload.choices.text[0].content
    if (data.header.code !== 0) {
      console.log('出错了', data.header.code, ':', data.header.message)
      // 出错了"手动关闭连接"
      socket.close()
    }
    if (data.header.code === 0) {
      // 对话已经完成
      if (data.payload.choices.text && data.header.status === 2) {
        requestObj.sparkResult += data.payload.choices.text[0].content
        setTimeout(() => {
          // "对话完成，手动关闭连接"
          socket.close()
        }, 3000)
      }
    }
    addMsgToTextarea(requestObj.sparkResult)
  })
  socket.addEventListener('close', (event) => {
    inputVal.value = ''
    console.log('连接关闭！！', event)
    // 对话完成后socket会关闭，将聊天记录换行处理
    requestObj.sparkResult = requestObj.sparkResult + '\n\n'
    addMsgToTextarea(requestObj.sparkResult)
    btnDisable.value = false
    // 清空输入框
  })
  socket.addEventListener('error', (event) => {})
}

// 这就是我们最终获取到的结果，输出在我们的页面上即可
const addMsgToTextarea = (text) => {
  sparkResult.value = text
}