浏览器赢得'；不能执行部分javascript代码

我目前正在下载一幅带水印的图像，有一些奇怪的事情发生了。当图像带有水印时，它的src是DataURL，我想替换DataURL字符串的一部分来下载它。但奇怪的是，脚本似乎只是跳过了这一步，并在没有它的情况下执行它。当我通过控制台运行相同的命令替换部分字符串时，它突然工作正常。我是否错过了什么或发生了什么

代码：

var-watermarkImage='1〕https://pravdaovode.cz/wp-content/uploads/2018/07/vodoznak.png';
var afterMark=“”；
函数getScreen（）{
html2canvas（div_box）.then（函数（画布）{
log（canvas.toDataURL（））；
var blob=dataURItoBlob（canvas.toDataURL（））；
placeMark（blob）；
如果画布中的（'msToBlob'）{
blob=dataURItoBlob（后标记）；
msSaveBlob（blob，'pravda_o_vode_cenova_mapa.jpg'）；
} 
否则{
afterMark=afterMark.replace（“image/png”、“image/octet-stream”）；
var a=document.createElement（'a'）；
a、 setAttribute（'href'，afterMark）；
a、 setAttribute（'target'，'u blank'）；
a、 setAttribute（'download'，'pravda_o_vode_cenova_mapa.png'）；
a、 style.display='none'；
文件.正文.附件（a）；
a、 单击（）；
文件.body.removeChild（a）；
}
});
}
函数dataURItoBlob（dataURI）{
var-byteString；
if（dataURI.split（'，'）[0].indexOf（'base64'）>=0）
byteString=atob（dataURI.split（'，）[1]）；
其他的
byteString=unescape（dataURI.split（'，）[1]）；
var mimeString=dataURI.split（'，'）[0]。split（'：'）[1]。split（'；'）[0]；
var ia=新的Uint8Array（byteString.length）；
for（var i=0；i

---

div_box变量只是div中包含的页面的一部分。我正在使用html2canvas库。

似乎

watermark

是异步函数，
尝试在

placeMark

中使用Promise，并在

placeMark（）中运行下载。然后

像这样：

function placeMark(blobImage) {
    return new Promise((resolve, reject) => {
        watermark([blobImage, watermarkImage])
            .image(watermark.image.center())
            .then(function(img) {
                afterMark = img.src;
                resolve(true);
            });
    })
}

function getScreen() {
    html2canvas(div_box).then(function(canvas) {
        console.log(canvas.toDataURL());
        var blob = dataURItoBlob(canvas.toDataURL());
        placeMark(blob).then((item) => {
            if ('msToBlob' in canvas) {
                blob = dataURItoBlob(afterMark);
                navigator.msSaveBlob(blob, 'pravda_o_vode_cenova_mapa.jpg');
            } else {
                afterMark = afterMark.replace("image/png", "image/octet-stream");

                var a = document.createElement('a');
                a.setAttribute('href', afterMark);
                a.setAttribute('target', '_blank');
                a.setAttribute('download', 'pravda_o_vode_cenova_mapa.png');
                a.style.display = 'none';
                document.body.appendChild(a);
                a.click();
                document.body.removeChild(a);
            }
        });
    });
}

---

可能重复为什么不在函数开头添加“debugger；”行，按F12在web浏览器中打开开发人员工具并逐步调试？您似乎在调用

placeMark

@HirasawaYui中的异步调用这将“修复”（或更好地隐藏）问题在这种情况下上帝保佑您，我完全怀念异步调用。非常感谢。

function placeMark(blobImage) {
    return new Promise((resolve, reject) => {
        watermark([blobImage, watermarkImage])
            .image(watermark.image.center())
            .then(function(img) {
                afterMark = img.src;
                resolve(true);
            });
    })
}

function getScreen() {
    html2canvas(div_box).then(function(canvas) {
        console.log(canvas.toDataURL());
        var blob = dataURItoBlob(canvas.toDataURL());
        placeMark(blob).then((item) => {
            if ('msToBlob' in canvas) {
                blob = dataURItoBlob(afterMark);
                navigator.msSaveBlob(blob, 'pravda_o_vode_cenova_mapa.jpg');
            } else {
                afterMark = afterMark.replace("image/png", "image/octet-stream");

                var a = document.createElement('a');
                a.setAttribute('href', afterMark);
                a.setAttribute('target', '_blank');
                a.setAttribute('download', 'pravda_o_vode_cenova_mapa.png');
                a.style.display = 'none';
                document.body.appendChild(a);
                a.click();
                document.body.removeChild(a);
            }
        });
    });
}