微信小程序连接websocket上传语音文件并获取评分信息

最近领导视察比较多,公司项目这边搞完领导视察要改地东西,回来之后马不停蹄地继续弄语音小程序,最近加的东西不多,也比较简单,但为了保证今后查找资料方便,还是决定记录一下

上传并回调

这里面有一个上传文件获取评分的方法,我们这里不关注怎么评分,看看微信小程序怎么上传文件(wx.uploadFile)和处理回调,请看代码:

doGetScore(){ 
   this.setData({isShowScore:true});
   let path = this.tempFilePath;
   let  originText=this.data.swiperItems[this.data.currentSwiperIndex].zimuDO.zhongwen; 
    
   let auth=wx.getStorageSync('userToken')["accessToken"];
   const uploadTask =  wx.uploadFile({
      filePath: path,
      name: 'file',
      url: constants.SPRING_ADDRESS+'/kfk/enroll/getScore?name='+encodeURIComponent(encodeURIComponent(originText)),
      header:{
        "Content-Type": "multipart/form-data",
        "Authorization":auth
      },
      onProgressUpdate:(e)=>{
        console.log(e);
      console.log("总字节数",e.totalBytesExpectedToSend);
      console.log("已传字节数",e.totalBytesSent);
      },
      success:(res)=>{
        console.log(res);
      },
      fail:(err)=>{
          console.log(err);
      },
     

    }) 
     
  },

websockt连接

主要关注的是websocket的相关操作,一些没有用到的代码,可以忽略。 yourip和 yourport 要换成你自己的地址和端口。

onFinish:function(){
    let that = this;
     this.stopRecord()
     this.setData({
      visible: false,
      isDisplay:true
    });
    console.log('录音完成')
   const url = "ws://${yourip}:${yourport}/ws?token="+wx.getStorageSync('userToken')["accessToken"]; 

    this.socket = wx.connectSocket({
      url: url
    });  
    this.socket.onOpen(()=>{
      
      console.log("socket open",this.socket);
      this.setData({voiceScore:0});
      this.setData({voiceMessage:"正在计算评分..."});
      this.doGetScore();
    });

    this.socket.onMessage(async (e,err)=>{ 
      await new Promise((resolve,reject)=>{
        resolve(e,err);
      }).then((messageRes,err)=>{ 
        if(err){
          this.socket.close(); 
          return;
        }
        if(this.socket!=null){
          this.socket.close();
        } 

        let thedata =  messageRes.data; 
         if(thedata!=null){
			//解析返回的json  
           let jsondata = JSON.parse(thedata); 
           let jsoncontent= JSON.parse(jsondata.content); 
           let scoreXmlData =jsoncontent.text; 
           const  domParser = new parser.DOMParser(); 
           const doc =domParser.parseFromString(scoreXmlData,'text/xml'); 
           let sentence = doc.getElementsByTagName('read_sentence')[1]  
           let total_score = sentence.getAttribute('total_score')
           let phone_score = sentence.getAttribute('phone_score')
           let tone_score = sentence.getAttribute('tone_score')
      
           this.setData({voiceScore:parseFloat(total_score).toFixed(2)});
           this.setData({voiceMessage:""});
           this.socket.close();
         }
      });   
    }); 

    this.socket.onError((err)=>{
      console.log("socket error:",err);
    })

    this.socket.onClose(()=>{
      console.log("socket close");
    })

     
  },

总结

评分过程是在后端处理的,我这边前端只负责上传文件,再通过websocket的onMessage方法来解析返回回来的分数信息。

截止到目前,阅读次数的峰值已经越过了100,昨天的阅读量也有50+,看着这些真实的数字波动,心里不禁激动万分,咱们虽然不一定做的特别好,但也希望能够有越来越多的朋友能够停下脚步,了解一些知识,我们不同于动不动就收费喊加群的,且不说是否被骗,起码普通人生活不易,咱们公众号是特别理解的,所以咱们尽量多做免费的知识分享,而且一切都以自愿、真诚为原则。就像当年毛主席的政策方针,不拿群众一针一线。 当然咱们也不能那么伟大,对于高价值的系列文章,大家俗称的干货,咱们也会标个合适的价格,尽量地照顾咱们大众读者。

欢迎大家多多关注和支持! 我们一直会保持不定期更新,绝对不会放弃,让我们都遇到更好的自己!