0

在最好是 google chrome 的网络浏览器中,我们可以使用 JavaScript 访问和操作由各种 html 媒体元素获取的数据,img例如video?并使用javascript保存资源或一些数据?

我想做这样的事情

var myvideo=document.getElementById("myvideo");
if(window.save(myvideo.data,"myvideo.mp4")){
  console.log("video saved successfully.");
}else{
  console.log("save operation canceled by user");
}

var myfile="Some text file content";
if(window.save(myfile,"myfile.txt")){
  console.log("video saved successfully.");
}else{
  console.log("save operation canceled by user");
}

是否有任何流行的浏览器能够做到这一点以及如何做到这一点?它符合 HTML5 标准吗?虽然保存是在用户许可下完成的,在上面实施中仍然存在任何安全问题吗?

- 编辑 -

Google chrome 扩展,singleFile能够做到这一点。它将原始媒体数据插入到 html 文件中。我错了吗?如果是这样,singleFile 获取原始媒体数据的方法是什么。

4

1 回答 1

0

你可以,可能,但不容易。

在最好是 google chrome 的网络浏览器中,我们可以使用 JavaScript 访问和操作各种 html 媒体元素(如 img、video)获取的数据吗?

可以使用 Javascript 访问和操作 DOM 元素。这意味着您可以像这样更改图像的来源:

$( "img" ).attr( "src", "some other url" );

但是,(客户端)无法访问加载图像的像素并更改其颜色。

并使用javascript保存资源或一些数据?

这将是一个黑客,但我认为是的,是的。在 HTML5 中有一个download锚标签的属性。浏览器不会跟随链接,而是会打开资源的保存对话框。要以编程方式保存资源,您必须click从 Javascript 触发其链接。它不会在所有浏览器中可靠地工作,但至少在 Chrome 中

所以你的算法会是这样的:

  1. 查找页面中的所有媒体元素
  2. 在它们周围包裹一个带有下载属性的锚标记
  3. 一个接一个,模拟点击。

看到这个小提琴

这适用于页面上的一个媒体元素,但可能会中断更多。保存对话框不是浏览器的一部分,而是操作系统的一部分,因此您不会发现用户是否已经保存了某些内容。您可以做的最好的事情是在触发下一次点击之前设置足够长的超时时间。

请注意,此技术适用于 HTML5 视频/音频,其中媒体源在标记中可见,但不适用于 Flash 或 Silverlight。

我还想指出,此功能更适合在服务器上实现,请参阅web scraping

于 2013-09-08T14:58:33.910 回答