如何阻止数据URL成为实际URL

how to stop dataURL from being actual url?

本文关键字：URL 数据 何阻止      更新时间：2023-09-26

我的问题可能看起来很奇怪，因为我不确定如何表达它!!问题是我用js写了一个函数

function onSavePNG(url){
    var save =  document.createElement('a');
    console.log('url in save function'+url);
    save.href = url;
    console.log('save.href'+save.href);
    save.target = '_blank';
    save.download = 'Slide no '+(i+1)+'.png' || 'unknown';
    var event = document.createEvent('Event');
    event.initEvent('click', true, true);
    save.dispatchEvent(event);
    (window.URL || window.webkitURL).revokeObjectURL(save.href);
}

参数 'url' 是来自画布的数据URL，该函数应该将图像保存到磁盘。 save.href 没有保存实际的数据URL，它已更改为

'http://localhost:3000/data:image/png;base64.......'

而且我没有收到任何文件。我应该怎么做才能做到这一点

'http://localhost:3000/'

不会成为分配给 save.href 的数据URL的一部分？

我通过删除出现在 dataURL 开头和结尾的单引号解决了我的问题

function onSavePNG(url){
    var save = document.createElement('a');
    console.log(url[0]+'  '+url[url.length-1]);
    url = url.slice(1);
    url = url.substring(0,url.length-1);
    console.log(url[0]+'  '+url[url.length-1]);
    save.href = url;
    save.target = '_blank';
    save.download = 'Image.png' || 'unknown';
    var event = document.createEvent('Event');
    event.initEvent('click', true, true);
    save.dispatchEvent(event);
    (window.URL || window.webkitURL).revokeObjectURL(save.href);
}

它现在正在工作:)

由于save是一个<a>元素，因此只需在代码的最后一行中使用save.pathname（只是路径）而不是save.href（整个URL）就可以解决问题。

相关文章：