一个静态页面接入科大讯飞3.5AI

 

 

静态文件html

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <meta http-equiv="X-UA-Compatible" content="ie=edge">
    <title>体验-大模型</title>
</head>
<body>
<div class="chat-bot">
    <div class="chat-bot-header">
        <img src="./qwen.png" alt="Logo" class="logo"/>
        测试页面
    </div>
    <div id="output_text" class="chat-bot-messages"></div>
    <div class="chat-bot-input">
        <input id="input_text" type="text" placeholder="输入你想问的问题"/>
        <button id="audio-ctrl-btn">Send</button>
    </div>
</div>
</body>
</html>

 

 

获取科大讯飞最新的websocket接口地址

function getWebsocketUrl() {
    // console.log(httpUrl.pathname)
    // 动态获取domain信息
    switch (httpUrl.pathname) {
        case "/v1.1/chat":
            modelDomain = "general";
            break;
        case "/v2.1/chat":
            modelDomain = "generalv2";
            break;
        case "/v3.1/chat":
            modelDomain = "generalv3";
            break;
        case "/v3.5/chat":
            modelDomain = "generalv3.5";
            break;
    }

    return new Promise((resolve, reject) => {
        var apiKey = API_KEY
        var apiSecret = API_SECRET


        var url = 'wss://' + httpUrl.host + httpUrl.pathname

        // console.log("我打印的" + httpUrl.host)
        // console.log("我打印的" + httpUrl.pathname)

        var host = location.host
        var date = new Date().toGMTString()
        var algorithm = 'hmac-sha256'
        var headers = 'host date request-line'
        var signatureOrigin = `host: ${host}\ndate: ${date}\nGET ${httpUrl.pathname} HTTP/1.1`
        var signatureSha = CryptoJS.HmacSHA256(signatureOrigin, apiSecret)
        var signature = CryptoJS.enc.Base64.stringify(signatureSha)
        var authorizationOrigin = `api_key="${apiKey}", algorithm="${algorithm}", headers="${headers}", signature="${signature}"`
        var authorization = btoa(authorizationOrigin)
        url = `${url}?authorization=${authorization}&date=${date}&host=${host}`
        resolve(url)
    })
}

 

 

代码地址:https://gitee.com/m1v/xfyun_spark_demo.git

posted @ 2024-04-19 18:05  MoreJewels  阅读(14)  评论(0)  编辑  收藏  举报