将IE拍照代码迁移到tsx

This commit is contained in:
袁帅
2022-08-12 10:24:41 +08:00
parent 2694467518
commit a31c2c2e96
3 changed files with 33 additions and 16 deletions

View File

@ -28,10 +28,11 @@
pos += 4 * 320; pos += 4 * 320;
//post>= 4 * 320(x轴像素) * 240(y轴像素) 表示读取图像数据完毕 //post>= 4 * 320(x轴像素) * 240(y轴像素) 表示读取图像数据完毕
if (pos >= 4 * 320 * 240) { if (pos >= 4 * 320 * 240) {
var url ='http://127.0.0.1:8081/outer/v1.0/stock/logicStock/rgbArray2Base64'; window.parent.postMessage({"image":image.join('|')}, '*');
$.post(url, {type: 'pixel', rgb: image.join('|')}, function(result){ // var url ='http://127.0.0.1:8081/outer/v1.0/stock/logicStock/rgbArray2Base64';
$('#base64image').attr('src', 'data:image/jpg;base64,' + result.data); // $.post(url, {type: 'pixel', rgb: image.join('|')}, function(result){
}); // $('#base64image').attr('src', 'data:image/jpg;base64,' + result.data);
// });
image = new Array(); image = new Array();
pos = 0; pos = 0;
} }
@ -56,6 +57,13 @@
$('#snapBtn').on('click', function() { $('#snapBtn').on('click', function() {
webcam.capture(); webcam.capture();
}); });
function receiveMessageFromParent ( event ) {
console.log(event.data);
$('#base64image').attr('src', 'data:image/jpg;base64,' + event.data.data);
};
window.addEventListener('message', receiveMessageFromParent, false);
}); });
</script> </script>
</body> </body>

View File

@ -1,28 +1,36 @@
import React from "react"; import React from "react";
import FrameLoader from "./FrameLoader"; import FrameLoader from "./FrameLoader";
export default class FrameFaceLogin extends React.Component { export default class FrameFaceLogin extends React.Component {
constructor(props) { constructor(props:any) {
super(props); super(props);
console.log(props, "props数据"); console.log(props, "props数据");
this.state = { this.state = {
transferData: { transferData: {
optimizationOrderFn: false, image: ''
allocationFn: false,
releaseFn: false,
revocationFn: false,
}, },
}; };
} }
componentDidMount() { componentDidMount() {
// 接收Iframe 传递的数据 // 接收Iframe传递的数据
window.addEventListener("message", (e) => { window.addEventListener("message", (e) => {
const { allocationFn, releaseFn } = e.data || {}; //传递的数据 const { image} = e.data || {}; //传递的数据
if (allocationFn || releaseFn) { if (image) {
this.setState({ this.setState({
transferData: e.data, transferData: {
image:e.data
},
}); });
const url = 'http://127.0.0.1:8081/outer/v1.0/stock/logicStock/rgbArray2Base64';
console.log(this.state.transferData, "传数据"); window.fetch(url,{
method:'post',
body : JSON.stringify({//post请求参数
type: 'pixel',
rgb: image
})
}).then(res => res.json()).then(res => {
const childFrameObj = document.getElementById('faceLoginFrame');
childFrameObj.contentWindow.postMessage(res, '*');
})
} }
}); });
} }

View File

@ -2,7 +2,7 @@ import React from "react";
import ReactDOM from "react-dom"; import ReactDOM from "react-dom";
import Iframe from "react-iframe"; import Iframe from "react-iframe";
export default class FrameLoader extends React.Component { export default class FrameLoader extends React.Component {
constructor(props) { constructor(props:any) {
super(props); super(props);
this.state = { this.state = {
iFrameHeight: this.props.height ? this.props.height : 0, // 设置iframe的高度 iFrameHeight: this.props.height ? this.props.height : 0, // 设置iframe的高度
@ -14,6 +14,7 @@ export default class FrameLoader extends React.Component {
render() { render() {
return ( return (
<Iframe <Iframe
id="faceLoginFrame"
onLoad={() => { onLoad={() => {
const obj = ReactDOM.findDOMNode(this); const obj = ReactDOM.findDOMNode(this);
this.setState({ this.setState({