无法获取 URL.createObjectURL 中的数据

Posted 2023-02-22

【中文标题】无法获取 URL.createObjectURL 中的数据

【英文标题】：Could not get the data in URL.createObjectURL

【发布时间】：2022-01-23 11:26:37

【问题描述】：

我只是好奇如何获取URL.createObjectURL 中包装的数据。

所以我写了下面的代码。

function typedArrayToURL(typedArray, mimeType) 
  return URL.createObjectURL(new Blob([typedArray.buffer], type: mimeType))

const bytes = Uint8Array.from("https://www.baidu.com/")
// const url = typedArrayToURL(bytes, 'text/html');
const url = typedArrayToURL(bytes, 'text/plain; charset=utf-8');

let blob = await (await fetch(url)).blob();
console.info(new Uint8Array(blob))

let ab = await (await fetch(url)).arrayBuffer();
console.info(new Uint8Array(ab))

blob或ab 22的大小等于"https://www.baidu.com/"的长度，但其中的数据全为零。

【参考方案1】：

intArray 需要整数。因此，您必须以正确的格式提供数据。

类似

const bytes = Uint8Array.from("https://www.baidu.com/".split('').map(v=>v.charCodeAt(0)));

或

const encoder = new TextEncoder();
const bytes = Uint8Array.from(encoder.encode("https://www.baidu.com/"))

【讨论】：

另一个问题，我可以将a 的href 属性设置为URL.createObjectURL 实例，当我单击链接时，导航到URL.createObjectURL 实例中指定的url 而不是下载内容。

@DonghuaLiu 你要拦截链接点击，自己解码，然后随意使用。

感谢您的帮助解释，您的意思是我需要使用fetch 来获取URL.createObjectURL 实例的数据，然后将其设置为a 的href 属性。所以我应该使用a.href = await (await fetch(objectURL)).text() 而不是a.href = objectURL。

我不确定您要做什么。如果您可以将网址直接放在 href 中，那么您为什么要浏览整个 createObjectURL 部分？否则我的意思是你可以做类似document.querySelector('a[href^="blob:"]').addEventListener('click', function(e)e.preventDefault(); /* here you could use the e.target.href and decode the href to get the actual text url*/);