react_hsbc_teller 1.9.20 → 1.9.22

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "react_hsbc_teller",
-  "version": "1.9.20",
+  "version": "1.9.22",
   "description": "React",
   "private": false,
   "main": "lib/hsbc.js",

package/packages/pages/video/video.jsx

@@ -6,6 +6,7 @@ import API from '../../api/api';
 import { initWebSocket, joinRoom, disconnect } from '../../common/websocket';
 import { BoardOperate } from '../../common/index.esm.js';
 import './video.less'
+import { compressImage } from '../../utils/utils'
 import Header from '../header/header.jsx'
 import Foot from '../foot/foot.jsx'
 import voiceImgOpen from '../../assets/img/icon_Mute.png'
@@ -295,7 +296,7 @@ class Video extends Component {
   saveLog = (val) => {
     axios({
       method: 'get',
-      baseURL: this.props.logUrl + '&message=' + encodeURIComponent(val) + '&react_hsbc_teller=1.9.20&logTime=' + Date.now() + '&mtoken=' + encodeURIComponent(this.state.rtoken) + '&roomId=' + encodeURIComponent(this.state.channelId) + '&sessionId=' + encodeURIComponent(this.state.sessionId) + '&appointmentID=' + this.props.businessNumber,
+      baseURL: this.props.logUrl + '&message=' + encodeURIComponent(val) + '&react_hsbc_teller=1.9.22&logTime=' + Date.now() + '&mtoken=' + encodeURIComponent(this.state.rtoken) + '&roomId=' + encodeURIComponent(this.state.channelId) + '&sessionId=' + encodeURIComponent(this.state.sessionId) + '&appointmentID=' + this.props.businessNumber,
 
     }).then(res => {
 
@@ -1011,14 +1012,14 @@ class Video extends Component {
       return a.order - b.order;
     })
     for (let i =1;i<=12;i++){
-      if(document.getElementById('video'+i).name){
+      if(sortedlist[i-1].videoName){
         list.push({
-          name: 'video' + i,
-          title: sortedlist[i-1].videoName,
-          mute: sortedlist[i-1].mute,
-          noVideo: sortedlist[i-1].noVideo
-        })
-      }
+            name: 'video' + sortedlist[i-1].idIndex,
+            title: sortedlist[i-1].videoName,
+            mute: sortedlist[i-1].mute,
+            noVideo: sortedlist[i-1].noVideo
+          })
+        }
     }
     console.log(list)
     this.state.listVideoPicture = list
@@ -1378,6 +1379,7 @@ class Video extends Component {
             } else {
               if (document.getElementById('video20').name) {
                 this.test_controller.UnPublish(document.getElementById('video20').name)
+                if(this.state.drawCanvasInterval) clearInterval(this.state.drawCanvasInterval)
               }
               this.setState({
                 isWhiteboard: false
@@ -1408,6 +1410,9 @@ class Video extends Component {
                 
               }
           }
+          if (this.state.isPictureInPicture) {
+            this.pictureInPicture('Refresh')
+          }
         }
       } else if (Mival.typeId == 121305) {
         if (Mival.sessionId == this.state.sessionId) {
@@ -1442,6 +1447,9 @@ class Video extends Component {
           this.setState({
             videoList: this.state.videoList
           })
+          if (this.state.isPictureInPicture) {
+            this.pictureInPicture('Refresh')
+          }
         }
       }
     };
@@ -1843,10 +1851,8 @@ class Video extends Component {
           }
         }
         return newStream1
-      } else {
-        return stream
       }
-
+      return stream
     }
     // 发布媒体流成功
     this.test_controller.OnPublishSucc = (sid) => {
@@ -2941,7 +2947,7 @@ class Video extends Component {
     }
   }
   componentWillMount() {
-    console.log('hsbc_teller_sdk', '1.9.20')
+    console.log('hsbc_teller_sdk', '1.9.22')
     let arr = []
     for(let i=1;i<=12;i++){
       arr.push({
@@ -3021,6 +3027,11 @@ class Video extends Component {
           console.log(data)
         })
       }
+      if (this.state.isPictureInPicture) {
+        setTimeout(() => {
+          this.pictureInPicture('Refresh')
+        }, 0);
+      }
     }
   };
   isFileSuccuse = () => {
@@ -3432,6 +3443,9 @@ class Video extends Component {
         //   videoList: this.state.videoList
         // })
         this.videoListSort();
+        if (this.state.isPictureInPicture) {
+          this.pictureInPicture('Refresh')
+        }
       } else {
         console.log('1')
         this.messageClick('保持信息失败', 'error')
@@ -3624,6 +3638,7 @@ class Video extends Component {
         })
         // this.messageClick('识别失败', 'error')
         this.errorCodeClick('ocr',result.code)
+        this.saveLog('OCR failed, error code=' + result.code)
       }
     } catch (err) {
       this.setState({
@@ -3722,6 +3737,9 @@ class Video extends Component {
         //   videoList: this.state.videoList
         // })
         this.videoListSort();
+        if (this.state.isPictureInPicture) {
+          this.pictureInPicture('Refresh')
+        }
       } else {
         console.log('1')
         this.messageClick('保持信息失败', 'error')
@@ -3963,19 +3981,25 @@ class Video extends Component {
     }
   }
   sgsinImage = () => {
-    if (this.state.IDtypeFrontOrBack == IDtypeFront) {
-      this.setState({
-        facialImg: this.test_controller.TakePicture(1, undefined, undefined, this.state.customOcrSid, 'png'),
-        isFaceImage: true,
-        facialImgFront: this.test_controller.TakePicture(1, undefined, undefined, this.state.customOcrSid, 'png'),
-      })
-    } else if (this.state.IDtypeFrontOrBack == IDtypeBack) {
-      this.setState({
-        facialImg: this.test_controller.TakePicture(1, undefined, undefined, this.state.customOcrSid, 'png'),
-        isFaceImage: true,
-        facialImgBack: this.test_controller.TakePicture(1, undefined, undefined, this.state.customOcrSid, 'png'),
-      })
-    }
+    const imgBase64 = this.test_controller.TakePicture(1, undefined, undefined, this.state.customOcrSid, 'png')
+    // console.log(imgBase64)
+
+    compressImage(imgBase64, (compressedImg)=>{
+      // console.log(compressedImg)
+      if (this.state.IDtypeFrontOrBack == IDtypeFront) {
+        this.setState({
+          facialImg: compressedImg,
+          isFaceImage: true,
+          facialImgFront: compressedImg,
+        })
+      } else if (this.state.IDtypeFrontOrBack == IDtypeBack) {
+        this.setState({
+          facialImg: compressedImg,
+          isFaceImage: true,
+          facialImgBack: compressedImg,
+        })
+      }
+    })
 
   }
   handleChangeOcr = (val) => {

package/packages/utils/utils.js

@@ -0,0 +1,36 @@
+function compressImage(base64, callback) {
+  var targSize = 1024 * 1024 * 1.45 //1024KB  
+  if (base64.length <= targSize) {
+      callback(base64);
+      // console.log("直接返回")
+      return
+  }
+  var newImage = new Image();
+  newImage.src = base64;
+  console.log('压缩前'+base64.length)
+  newImage.setAttribute("crossOrigin", 'Anonymous'); //url为外域时需要  
+  newImage.onload = function () {
+      var quality = 0.95; //压缩系数0-1之间
+      var canvas = document.createElement("canvas");
+      var ctx = canvas.getContext("2d");
+      canvas.width = 720
+      canvas.height = 405
+      ctx.clearRect(0, 0, canvas.width, canvas.height);
+      ctx.drawImage(newImage, 0, 0, canvas.width, canvas.height);
+      var base64 = canvas.toDataURL("image/png", quality); //压缩语句
+      // 如想确保图片压缩到自己想要的尺寸,如要求在5-10kb之间，请加以下语句，quality初始值根据情况自定
+      // console.log(base64.length + "循环1压缩" + (base64.length / 1024 > 512))
+      
+      // while (base64.length > targSize) {
+      //     quality -= 0.03;
+      //     // console.log(base64.length + "循环压缩" + quality)
+      //     base64 = canvas.toDataURL("image/png", quality);
+      // }
+      console.log('压缩后'+base64.length)
+      callback(base64); //必须通过回调函数返回，否则无法及时拿到该值
+  }
+}
+
+export {
+  compressImage
+}