Question

我通过ajax响应在数组缓冲区中获取了图像内容。将该数组缓冲区添加到blob builder.now我想将这些内容写入文件。有没有办法做到这一点..？我使用windows.requestFileSystem它与chrome工作正常，但在mozilla不工作.. 这是我的一段代码，

function retrieveImage（studyUID，seriesUID，instanceUID，sopClassUID，nodeRef）{

     window.requestFileSystem = window.requestFileSystem||window.webkitRequestFileSystem;
var xhr = new XMLHttpRequest();
var url="/alfresco/createthumbnail?ticket="+ticket+"&node="+nodeRef;
xhr.open('GET', url, true);
xhr.responseType = 'arraybuffer';

xhr.onload = function(e) {
    if(this.status == 200) {
        window.requestFileSystem(window.TEMPORARY, 1024*1024, function(fs) {
            var fn = '';
            if(sopClassUID == '1.2.840.10008.5.1.4.1.1.104.1') {
                fn = instanceUID+'.pdf';
            } else {
                fn = instanceUID+'.jpg';
            }

                    fs.root.getFile(fn, {create:true}, function(fileEntry) {
                     fileEntry.createWriter(function(writer) {
                     writer.onwriteend = function(e) {
                        console.log(fileEntry.fullPath + " created");

                    }
                    writer.onerror = function(e) {
                        console.log(e.toString());
                    }

                    var bb;
                    if(window.BlobBuilder) {
                        bb = new BlobBuilder();
                    } else if(window.WebKitBlobBuilder) {
                        bb = new WebKitBlobBuilder();
                    }
                    bb.append(xhr.response);

                    if(sopClassUID == '1.2.840.10008.5.1.4.1.1.104.1') {
                        writer.write(bb.getBlob('application/pdf'));
                    } else {
                        writer.write(bb.getBlob('image/jpeg'));
                    }
                }, fileErrorHandler);
            }, fileErrorHandler);
        }, fileErrorHandler);
    }
};
xhr.send();

}

Answer 1

不允许网页脚本将任意文件[例如pdfs]写入客户端的存储空间。你应该感恩，因为这意味着网页很难将恶意软件放在你的机器上。

相反，您应该将用户（或打开新窗口/选项卡）重定向到浏览器可以找到下载所需内容的URL，并让它处理它。使用标题告诉客户下载它或按照here说明显示。

如果您需要动态创建下载的内容，请在服务器上对其进行管理，使其成为活动页面（.php，.jsp，.aspx等...）。重要的是在响应的标题中包含正确的MIME类型。

注意：是的，我告诉你不要使用ajax，只是window.open。 编辑：我想你可能想要在img中呈现图像，在这种情况下，它是相同的，只需将url放在src属性中并且没有ajax。如果适当的话，只有一些javascript来更新属性。

鉴于您的评论我理解您想要：

将图像缓存在客户端中，以避免每次都从服务器返回。
允许用户自定义允许使用本地存储图像的体验。

现在，出于安全原因，不允许对客户端文件进行arbirary访问。在这种情况下，它可以双向工作：首先它阻止网页窥探你，其次它阻止你在页面上注入恶意内容。

所以，对于第一部分，据我所知，默认是缓存图像[这是由浏览器处理的，是的，你应该不时地清理它，因为它会增长]。如果这不适合您，我想您可以尝试使用cache manifest。

关于第二种，通常的方法是使用local storage [再次由您的浏览器处理，但不是对客户端文件的任意访问]来存储/检索图像的URL并使用它图像。

图像仍然可以保存在服务器上，是的，它可以被缓存。要将其发送到服务器 - 当然 - 您始终可以使用<input type="file" ... />上传它，并且可能需要将enctype设置为您的表单。 - 你已经知道了，对吧？ - 在服务器上，将图像存储在数据库（或专用文件夹）中。现在，可以检索图像的页面应该是：

检查请求方法
检查用户的权限（通过会话/ cookie识别）
检查请求的参数（如果有的话）
设置标题
输出文件获取数据库（或专用文件夹）

现在，假设您希望允许它作为xcopy可部署应用程序（恰好在浏览器中运行）。在这种情况下，您始终可以告诉用户将他想要的图像存储在特定位置，并使用相对路径访问它们。

或者 - 只是因为 - 你在一个地方托管，因为没有服务器端脚本的机会。所以你必须只使用javascript给你的东西。好吧，你不能在这里使用相对路径，因为它不是本地的...如果你尝试使用本地绝对路径，浏览器将只是 diss 你（我的意思是，它只是忽略它）

因此，您无法从客户端的文件中获取图像，也无法将其存储在服务器上...

嗯，你知道有working draft，我注意到你正在尝试。问题是它是一份工作草案。安全问题初始实现得到staggered，引用Jonas Sicking：

将此功能暴露给Web的主要问题是安全性。您不希望任何网站只读取或修改您的图像。我们可以提出类似于GeoLocation API的提示，因为这个API可能会删除过去10年的所有图片，我们可能想要更多。这是我们正在积极努力的事情。但在这里肯定是安全性在这里很难实现，而不是实现低级文件操作。

所以，我猜答案是“尚未”？事实上，考虑到微软只提供达到推荐状态的标准部件的方法，以及每个新版本的Windows推出新版IE的方法......那么你将不得不等待一段时间才能得到支持所有的浏览器。首先等待FileAPI达到推荐状态。然后等到Microsoft更新IE以支持它。如果，任何机会（似乎会发生）它只适用于IE10（或未来的IE11），并且那些在Windows 8之前无法在Windows上运行，那么你将等待很多人升级。 / p>

如果这是你的情况，我建议为某个图片托管网站获取一个API，并使用它[那可能不是免费的（或不是私人的），所以你可以只改变你的网络托管]

Answer 2

您无法将响应存储在与所有浏览器兼容的文件中，有一种方法，你可以在javascript中使用FileReader，但这也无法在IE上运行。

几周前我遇到了类似的问题，我做的是我向传递内容的服务器发出ajax请求，服务器在文件中为我存储内容，然后返回对存储文件的引用。

我将我的文件存储在临时数据库表中，服务器操作返回了文件的id，我们可以随时从数据库访问该文件。

你也可以在一些缩略图中将你的文件存储在服务器上，但我更喜欢数据库。

如果您需要更多规格，请告诉我

有什么方法可以将image / pdf内容保存到适用于所有浏览器的本地文件系统中

2 个答案: