Question

我会在编辑中发布我的代码...我在提交包含代码的问题时遇到了问题。

我维护了一个聊天程序，该程序在我被分配时已经构建完毕。我的工作刚开始只是为了使其与我们网站的其他部分相匹配。现在管理层正在寻求我头脑中的其他功能。一个这样的功能是客户将聊天记录的副本保存到他们的计算机的选项。

整个聊天对话存储在名为chatHistoryHTML的javascript变量中，并且循环会导致页面上的聊天会话每5秒更新一次，方法是在chatHistoryHTML变量中添加新的文本行并将其显示在“history”div中顾客看。

目前，我了解如何打开新窗口以显示仅聊天记录，而不显示任何徽标，背景或文本输入框。但是，我无法使用我的方法将PHP命令传递给该新页面。

理想情况下，我想要一个解决方案，允许用户点击按钮并出现一个保存对话框，只保存聊天对话，而无需打开新窗口。我正在打开一个新窗口，因为我试图避免在页面上保存所有其他内容。

我愿意接受建议。我知道一点Javascript和PHP，但对AJAX一无所知

Answer 1

在客户端，您可以尝试：

var content, MIME_TYPE, theBlob, a;

// What will actually be put into the file
content = "THE FILE CONTENT";

// The file type
MIME_TYPE = "text/plain";
// Basically, the file itself
theBlob = new Blob([content], {type: MIME_TYPE});

// The anchor element
a = document.createElement("a");
// Set the name of the file that will be downloaded
a.download = "Chat_History.txt";
// Set the contents to be downloaded
a.href = window.URL.createObjectURL(theBlob);
// Anchor's text
a.textContent = "Download";

// What's displayed as the URL of the anchor (when hovered, copied, etc.)
a.dataset.downloadurl = [MIME_TYPE, a.download, a.href].join(":");

// Add the anchor to the page
document.body.appendChild(a);

DEMO： http://jsfiddle.net/oqskpydg/

这确实使用了并非在所有浏览器中都可用的功能，但它是一个可靠的选项。

<强>参考文献：

Blob构造函数 - https://developer.mozilla.org/en-US/docs/DOM/Blob
Blob浏览器兼容性 - http://caniuse.com/blobbuilder
download属性/属性 - https://developer.mozilla.org/en-US/docs/HTML/Element/a#attr-download
download属性/属性浏览器兼容性 - http://caniuse.com/download
URL.createObjectURL - https://developer.mozilla.org/en-US/docs/DOM/window.URL.createObjectURL
dataset property - https://developer.mozilla.org/en-US/docs/DOM/element.dataset
dataset属性浏览器兼容性 - http://caniuse.com/dataset

Answer 2

你可以使用比{I}的解决方案更广泛支持的Data URI scheme，它不依赖于服务器端：

<a href="data:application/octet-stream;base64,PHVsPjxsaT50aGlzPGxpPmlzPGxpPmE8bGk+Y2hhdCBsb2c8L3VsPgo=">Download chat log</a>

您可以使用window.btoa和window.atob进行base64处理。

Demo。显示帧源以查看源代码而不是PasteHTML的包装。

Answer 3

主要选项：

将聊天记录转储到新窗口并调用print()（隔离日志并使其可打印，否则用户也会抓取页面上的所有UI元素）或
使用AJAX并将其发送到服务器，然后服务器将其转发回用户的电子邮件。

JavaScript无法将文件本地保存到客户端。但是，您有一个辅助选项：

将其迁移到Silverlight / Flash以获得其他功能/功能。

如何在客户端PC上将Javascript变量保存为文件

3 个答案: