我正遇到html问题:
未捕获的DOMException:无法在'CanvasRenderingContext2D'上执行'getImageData':源宽度为0。
在添加一些CSS之前,它运行正常,现在我已经擦除了所有CSS部分,但它仍然显示相同的错误。
<body>
<div class="cont">
<div class="">
<label>Image Decryption </label>
<input
class="ui secondary button"
type="file"
name="pic"
accept="image/*"
onchange="decode(this);"
/>
</div>
<div class="img1">
<h5>Decoded Text:</h5>
<img id="stegimage" src="" alt="" width="400" height="400" ; />
<h2 id="decoded"></h2>
</div>
</div>
</body>
这是我正在使用的js部分:
var imgdatauri;
function readURL(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (s) {
document.querySelector("#image1").src = s.target.result;
imgdatauri = s.target.result;
};
}
reader.readAsDataURL(input.files[0]);
}
function hideText() {
document.querySelector("#image2").src = steg.encode(
document.querySelector("#text").value,
imgdatauri
);
}
function decode(input) {
if (input.files && input.files[0]) {
var reader = new FileReader();
reader.onload = function (s) {
console.log(steg.decode(s.target.result));
document.querySelector("#stegimage").src =
(s.target.result)
document.querySelector("#decoded").innerText = steg.decode(
s.target.result
);
};
}
reader.readAsDataURL(input.files[0]);
}