我有要写入文件的数据,并打开文件对话框供用户选择保存文件的位置.如果它适用于所有浏览器会很棒,但它必须在Chrome中运行.我想在客户端做到这一点.
基本上我想知道在这个函数中放什么:
saveFile: function(data)
{
}
Run Code Online (Sandbox Code Playgroud)
在函数接收数据的情况下,用户是否选择保存文件的位置,并使用该数据在该位置创建文件.
使用HTML也很好,如果有帮助的话.
我在客户端生成一个图像,我用这样的HTML显示它:
<img src="data:image/jpeg;base64,/9j/4AAQSkZJRgABAQAAAQABAAD/2wBDAAMCAgICAgM...."/>
Run Code Online (Sandbox Code Playgroud)
我想提供下载生成的图像的可能性.
我如何才能意识到浏览器正在打开文件保存dialoge(或者只是将图像像chrome或firefox一样下载到下载文件夹中),这样用户可以保存图像而无需右键单击并另存为图像?
我更喜欢没有服务器交互的解决方案.所以我知道如果我首先上传Image然后开始下载就可以了.
非常感谢!
如果我们在nodeJS服务器上,我们可以编写一个头,设置一个mime类型,并发送它:
res.header("Content-Disposition", "attachment;filename="+name+".csv");
res.type("text/csv");
res.send(200, csvString);
Run Code Online (Sandbox Code Playgroud)
并且由于标题,浏览器将为命名的csv文件创建下载.
当在浏览器中生成有用的数据时,将其置于CSV文件中的一种解决方案是使用ajax,将其上传到服务器,(可选择将其保存在那里)并让服务器使用这些头将其发送回csv在浏览器下载回来.
但是,我希望100%的浏览器解决方案不涉及与服务器的乒乓.
所以在我看来,可以打开一个新窗口并尝试使用META标记等效设置标题.
但是这在最近的Chrome中对我不起作用.
我确实得到一个新窗口,它包含csvString,但不作为下载.
我想我希望在底部标签中下载或在底部标签中下载一个空白的新窗口.
我想知道元标记是否正确或是否还需要其他标记.
有没有办法让这项工作没有将其强加给服务器?
用于在浏览器中创建CSV的JsFiddle(不工作 - 输出窗口但无法下载)
var A = [['n','sqrt(n)']]; // initialize array of rows with header row as 1st item
for(var j=1;j<10;++j){ A.push([j, Math.sqrt(j)]) }
var csvRows = [];
for(var i=0,l=A.length; i<l; ++i){
csvRows.push(A[i].join(',')); // unquoted CSV row
}
var csvString = csvRows.join("\n");
console.log(csvString);
var csvWin = window.open("","","");
csvWin.document.write('<meta name="content-type" content="text/csv">');
csvWin.document.write('<meta name="content-disposition" content="attachment; filename=data.csv"> ');
csvWin.document.write(csvString);
Run Code Online (Sandbox Code Playgroud) "data:"URL方案值是否有任何大小限制?我对流行的网络浏览器的局限感兴趣.换句话说,多久可以data:image/jpg;base64,base64_encoded_data成为<img src="data:image/jpg;base64,base64_encoded_data" />或background-image: url(data:image/jpg;base64,base64_encoded_data)?
现在我有一个canvas,我想将其保存为PNG.我可以用所有那些花哨的复杂文件系统API来做,但我真的不喜欢它们.
我知道是否有链接download属性:
<a href="img.png" download="output.png">Download</a>
Run Code Online (Sandbox Code Playgroud)
如果用户点击它,它将下载该文件.所以我想出了这个:
$("<a>")
.attr("href", "img.png")
.attr("download", "output.png")
.appendTo("body")
.click()
.remove();
Run Code Online (Sandbox Code Playgroud)
演示:http://jsfiddle.net/DerekL/Wx7wn/
但是,它似乎不起作用.是否必须由用户操作触发?或者为什么不起作用?
我正在使用纯Javascript编写文本编辑器.我希望这样当用户点击"保存"按钮时,编辑器会下载该文件.我已经部分工作了:
uriContent = "data:application/octet-stream," + encodeURIComponent(codeMirror.getValue());
newWindow=window.open(uriContent, 'filename.txt');
Run Code Online (Sandbox Code Playgroud)
该文件下载,但问题是该文件名为"download".
问题:如何将文件名更改为我想要的任何内容,例如filename.txt?
我有一个像以下一样的three.js场景:
var scene = new THREE.Scene();
var camera = new THREE.PerspectiveCamera(75, window.innerWidth/window.innerHeight, 0.1, 1000);
var renderer = new THREE.WebGLRenderer();
renderer.setSize(window.innerWidth, window.innerHeight);
document.body.appendChild(renderer.domElement);
var geometry = new THREE.BoxGeometry(1,1,1);
var material = new THREE.MeshBasicMaterial({color: 0x00ff00});
var cube = new THREE.Mesh(geometry, material);
scene.add(cube);
camera.position.z = 5;
var render = function () {
requestAnimationFrame(render);
cube.rotation.x += 0.1;
cube.rotation.y += 0.1;
renderer.render(scene, camera);
};
render();
Run Code Online (Sandbox Code Playgroud)
是否可以从场景制作2D SnapShot或ScreenShot并将其导出为JPG图像?
我有这样的图像:
<img src="data:image/jpeg;charset=utf-8;base64,/9j...">
当我右键单击图像并选择"另存为"时,保存对话框会以"download.jpg"作为文件名.我想选择一个不同的默认文件名.download在img元素上添加标签似乎不起作用.有没有办法为此添加名称?
我已经看过了,但它的<a>标签是:在使用数据时有没有办法指定建议的文件名:URI?
我使用javascript生成一个文件并下载它.看来,根据chrome的版本,下载文件名可以自动重命名为"download".有没有办法避免它?
这是我的代码:
var link = document.createElement("a");
link.setAttribute("href", 'data:application/octet-stream,' + 'file content here');
link.setAttribute("download", 'file1.txt');
link.click();
Run Code Online (Sandbox Code Playgroud)
这不是一个重复的问题,因为我使用的是最新的Chrome,之前建议的超链接正是我正在使用的.我认为,Chrome v34运行正常,但一旦我的Chrome自动更新到v35,它就会回到"下载"文件名.
我在JavaScript中生成一个SVG字符串.
我通过以下方式向用户提供:
window.open("data:image/svg+xml," + svg_xml_string);
Run Code Online (Sandbox Code Playgroud)
当您尝试在Chrome中保存该页面时,它会建议保存为download.svg,无论如何我可以更改下载的默认文件名?
我试过了:
data:image/svg+xml;headers=Content-Disposition%3Aattachment%3Bfilename%3D%22suggest.svg%22,...
Run Code Online (Sandbox Code Playgroud)
但它不起作用.