相关疑难解决方法(0)

canvas.toDataURL()安全错误操作不安全

当我在将视频上传到服务器之前尝试获取屏幕截图并将其另存为PNG时,我遇到了以下问题

在此输入图像描述

我希望你能解决我的问题......

/*Output image show view*/
$('#file_browse').change(function(e){
    getVideo(this);
});

var capbtn = document.querySelector('#video_capture');
var video = document.querySelector('video');
var canvas = document.querySelector('canvas');
var context = canvas.getContext('2d');
var w, h, ratio;

video.addEventListener('loadedmetadata', function() {
    ratio = video.videoWidth / video.videoHeight;
    w = video.videoWidth - 100;
    h = parseInt(w / ratio, 10);
    canvas.width = w;
    canvas.height = h;           
}, false);

capbtn.addEventListener("click", function(){
    context.fillRect(0, 0, w, h);
    context.drawImage(video, 0, 0, w, h);
    var objImageData = canvas.toDataURL("data:image/png;");  
});

function getVideo(input) {
    if (input.files && input.files[0]) { …

Run Code Online (Sandbox Code Playgroud)

javascript video html5 canvas

Kem*_*mal

2016 08-01

22
推荐指数

3
解决办法

3万
查看次数

canvas.toDataURL()和drawImage()的安全性错误

<!doctype html>
<canvas id="canvas" height="200" width="200"></canvas>
<div id="new"></div>
<script>
var div = document.getElementById("new");
var canvas = document.getElementById("canvas");  
var ctx = canvas.getContext("2d");  
var img = new Image();

img.src = 'http://www.w3.org/html/logo/downloads/HTML5_Logo_512.png';
//img.src = 'local.png';

img.onload = function(){
    //draws the image on the canvas (works)
    ctx.drawImage(img,0,0,200,200);

    //creates an image from the canvas (works only for local.png)
    var sourceStr = canvas.toDataURL();

    //creates the img-tag and adds it to the div-container
    var newImage = document.createElement("img");
    newImage.src = sourceStr;
    div.appendChild(newImage);
}
</script>

Run Code Online (Sandbox Code Playgroud)

此脚本使用html5徽标创建画布.从这个画布我想使用"toDataURL()" - 方法创建一个图像.在这里我收到一个安全错误.

Firefox说 …

javascript firefox google-chrome html5-canvas

mar*_*tin

2012 02-19

5
推荐指数

2
解决办法

2万
查看次数