javascript - 如何通过 Web 共享 API 共享单个 Base64 URL 图像？

Question

因此，我需要使用 TypeScript 上的 Web 共享 API 共享一个 base64 图像字符串。

如果我像这样将base64字符串作为url参数传递可以吗:

  var base64url = "data:image/octet-stream;base64,/9j/4AAQSkZ...."
  navigator.share({
    title: 'Hello',
    text: 'Check out this image!',
    url: base64url ,
  })

或者我需要有一个文件数组并使用 Web Share API v2 吗？如果是这样，我该如何实现它，我只有一个 base64 字符串，我能找到的例子太困惑了。

我在这件事上是个菜鸟，所以我们将不胜感激!

Answer 1

如评论中所述，在 url 字段中共享 url 不会为您的用户带来好的结果。
您可以通过以下代码使用 Web Share API v2:

const base64url = "data:image/octet-stream;base64,/9j/4AAQSkZ...."
const blob = await (await fetch(base64url)).blob();
const file = new File([blob], 'fileName.png', { type: blob.type });
navigator.share({
  title: 'Hello',
  text: 'Check out this image!',
  files: [file],
})

您可能需要根据您的实际图像 url 调整扩展名和 mime 类型。
请注意，虽然 v2 目前仅在 Android Chrome 上可用(我找不到很好的来源，但我只是在一个项目中做到了这一点)。
您可以使用 navigator.canShare() 在运行时检查可用性。 .