如何使用Javascript(使用base64数据)将图像保存到 iPhone

我的网页需要能够将图像保存到用户的设备,无论他们从什么设备或网络浏览器查看。图像是由网页本身创建的,所以我需要使用 img 元素,画布元素,或者只是图像的 base64 数据 (任何都可以)。

我的网页需要能够将图像保存到用户的设备,无论他们从什么设备或网络浏览器查看。图像是由网页本身创建的,所以我需要使用 img 元素,画布元素,或者只是图像的 base64 数据 (任何都可以)。

方法 1:通过锚元素下载

在单击时下载图像的页面上创建一个 anchor 元素:

<a download="myImage.png" href="data:image/png;base64,[base64-data-here]">Click me</a>

适用于 PC 和 Android。但是在 iPhone 上,会出现一个弹出窗口,询问用户是否要下载图像。如果您按“下载”,似乎什么也没发生。如果确实下载了图像,则它不会出现在“照片”应用程序中。

方法 2:P5JS 图形对象上的.save()方法

我使用的是 P5JS 库,它有一个特殊的图形对象(基本上只是一个画布 DOM 元素的包装),它带有一个.save()方法,将图像保存到用户的文件系统:

myGraphicsObject.save("myImage.png")

这似乎只在 iPhone 上工作了一半。一半的时间它似乎什么也没做,或者它打开了一个页面,上面写着“找不到文件”。非常奇怪。

方法 3:允许用户长按图像保存自己

在 Google 图片上,任何移动用户都可以长按图像以将其保存到其图库中。我试图通过在页面上放置一个简单的 img 元素来在我的网页上重新创建它。我尝试将 style 属性设置为-webkit-user-select: none,以防止长按仅突出显示页面上的元素。我甚至尝试使用document.open()从网页中删除所有其他元素,以查看是否有帮助:

document.open();
document.write("<html><body></body></html>")
myCanvas.setAttribute('style', "-webkit-user-select: none;")
document.body.appendChild(myCanvas);

当我尝试这个时,长按图像似乎没有在 iPhoneAndroid 上做任何事情。这种方法似乎是最有前途的,但我不知道如何使我的网页表现得像谷歌图片。

0

原来我对方法 3 是错误的。长按 html img 元素按预期工作。问题是我不小心使用了 canvas 元素而不是 image 元素。这是我如何将我的 canvas 元素转换为 image 元素:

var canvas_data = canvas.toDataURL();
var img_element = document.createElement("img")
img_element.src = canvas_data;
document.body.appendChild(img_element);

本站系公益性非盈利分享网址,本文来自用户投稿,不代表码文网立场,如若转载,请注明出处

(844)
由于支付宝和微信支付 iOS应用程序被拒绝
上一篇
无法运行 istio-ingressgateway 获得就绪探测失败:连接被拒绝
下一篇

相关推荐

  • ios 国际化:Welcome to the App Store!

    iOS 国际化是一种技术,它可以让应用程序能够根据用户的地理位置,语言和文化背景来显示不同的内容。它可以帮助开发人员扩大其应用程序的受众范围,并使其应用程序更具有吸引力。…

    2023-10-20 08:38:30
    0 39 33
  • android x86 安装教程:如何在 PC 上安装 Android x86

    安装 Android x86 是一个比较简单的过程,但是要求你有一台支持 UEFI 或者 BIOS 的电脑。下载 Android x86 镜像文件:你需要在 Android x86 官网上下载最新的 Android x86 镜像文件,它是一个 ISO 文件,可以在电脑上安装 Android 系统。…

    2023-05-12 06:00:43
    0 34 20
  • adb 查看cpu:查看Android设备CPU信息的adb命令

    adb 查看cpu的方法有两种:使用 adb shell top 命令…

    2023-10-22 01:20:18
    0 49 10
  • android application类:如何使用Android Application类创建强大的应用

    Android Application类是Android应用程序的核心类,它提供了一个全局的上下文,可以被应用程序中的所有组件使用。它还提供了一些系统级别的服务,如活动管理、资源管理和内容提供者管理等。…

    2023-05-17 09:37:08
    0 36 83
  • ios sfc模拟器令你重温经典游戏的乐趣

    iOS SFC模拟器是一种用于在iOS设备上模拟Super Nintendo Entertainment System(SNES)游戏的应用程序。它使用原始SNES游戏ROM文件,并允许用户在iPhone和iPad上模拟SNES游戏。…

    2023-06-16 02:56:59
    0 69 48
  • android 关闭service:如何在Android中关闭Service

    示例示例android 关闭service的方法有两种:使用()方法:…

    2023-05-10 15:20:46
    0 62 69
  • ios系统字体:Experience the Power of iOS Fonts

    iOS系统字体是指iOS系统自带的字体,它们可以在iOS设备上使用,并且都是免费的。iOS系统字体包括:San Francisco,Helvetica Neue,Helvetica,Avenir,Gill Sans,Chalkboard,Courier,Verdana,Georgia,Times New Roman,Trebuchet MS,Apple Color Emoji,Symbol和Menlo。…

    2023-06-06 08:19:36
    0 86 93
  • ios内存管理从 ARC 到 MRC

    示例示例iOS内存管理是指在iOS应用程序中,管理内存的过程。iOS内存管理主要包括以下几个方面:内存分配:在iOS应用程序中,需要根据程序需要分配内存,以便存储数据。内存分配可以使用malloc()、calloc()、realloc()等函数来实现。…

    2023-05-10 02:02:13
    0 77 20

发表评论

登录 后才能评论

评论列表(9条)