如何下载，重命名和保存由用户输入生成的图像
我正在构建一个Web应用程序，用户可以在其中输入旧文件名和新文件名，并且他将能够下载生成的文件。
我是编码（特别是Javascript）的新手，所以我决定请大家看看，也许可以帮助我找到解决方案。
我尝试使用Jszip，但无法弄清楚如何配置它以获取用户输入而不是预定义的url。
<html>
<head>
</head>
<body>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jszip/3.1.5/jszip.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/FileSaver.js/1.3.8/FileSaver.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jszip-utils/0.0.2/jszip-utils.min.js"></script>
<script>
var urls = [
"https://cors-anywhere.herokuapp.com/https://img.tenniswarehouse-europe.com/new_big/AMSPP-BL-1.jpg",
"https://cors-anywhere.herokuapp.com/https://img.tenniswarehouse-europe.com/new_big/AMSPP-BL-2.jpg",
"https://cors-anywhere.herokuapp.com/https://img.tenniswarehouse-europe.com/new_big/AMSPP-BL-3.jpg",
"https://cors-anywhere.herokuapp.com/https://img.tenniswarehouse-europe.com/new_big/AMSPP-BL-4.jpg",
"https://cors-anywhere.herokuapp.com/https://img.tenniswarehouse-europe.com/new_big/AMSPP-BL-5.jpg",
"https://cors-anywhere.herokuapp.com/https://img.tenniswarehouse-europe.com/new_big/AMSPP-BL-6.jpg",
"https://cors-anywhere.herokuapp.com/https://img.tenniswarehouse-europe.com/new_big/AMSPP-BL-7.jpg"];
var nombre = $scope.meetingName;
//The function is called
compressed_img(urls,nombre);
function compressed_img(urls,nombre) {
var zip = new JSZip();
var count = 0;
var name = nombre+".zip";
urls.forEach(function(url){
JSZipUtils.getBinaryContent(url, function (err, data) {
if(err) {
throw err;
}
});
}
});
});
}
我希望下载并重命名由用户指定的文件，而不是作为示例的预定义URL。
莫回无2回答
-
桃花长相依
function compressed_img(urls,nombre) { var zip = new JSZip(); var count = 0; var name = `${nombre}.zip`; var givenName = `test`; var counter = 1; urls.forEach(function(url){ JSZipUtils.getBinaryContent(url, function (err, data) { console.log(data) if(err) { throw err; } var extention = url.split('.').pop(); zip.file(`${givenName}${counter}.${extention}`, data, { binary: true, createFolders: true }); count++; counter++; if (count == urls.length) { zip.generateAsync({type:'blob'}).then(function(content) { saveAs(content, name); }); } }); });}
随时随地看视频慕课网APP
相关分类
JavaScript