uni-app中h5页面在ios上怎么保存图片到相册?

发布于 1周前 作者 yuanlaile 来自 Uni-App

uni-app中h5页面在ios上怎么保存图片到相册?

H5页面有保存图片到相册功能,uni.saveImageToPhotosAlbum不支持H5,在ios端有什么办法可以保存图片到相册?

4 回复

用uts写原生插件调用ios保存图片功能,再在h5里调用uts插件


兄弟 解决了吗 急需 方案 !!!

在uni-app中,将H5页面上的图片保存到iOS设备的相册,可以通过调用uni-app提供的文件系统API和调用原生保存图片的方法来实现。由于uni-app直接提供的API可能无法直接满足保存图片到相册的需求,通常需要结合原生插件或利用条件编译来调用iOS的原生代码。

以下是一个简化的示例,展示如何通过uni-app结合iOS原生代码实现保存图片到相册的功能。注意,这个示例假设你已经具备了一定的iOS原生开发知识。

1. 在uni-app中触发保存图片的操作

首先,在uni-app的H5页面中,创建一个按钮来触发保存图片的操作,并传递图片的URL。

<template>
  <view>
    <button @click="saveImage('https://example.com/path/to/your/image.jpg')">保存图片</button>
  </view>
</template>

<script>
export default {
  methods: {
    saveImage(imageUrl) {
      // 调用原生插件或条件编译的代码来保存图片
      #ifdef APP-PLUS
      plus.runtime.exec('UIWebView', 'saveImageToAlbum', [imageUrl], (res) => {
        console.log('图片保存成功:', res);
      }, (err) => {
        console.error('图片保存失败:', err);
      });
      #endif
    }
  }
}
</script>

2. 在iOS原生代码中实现保存图片的功能

接下来,在iOS原生代码中实现saveImageToAlbum方法。这通常涉及到创建一个原生插件,或者在你的uni-app项目的iOS原生工程中添加相关代码。

// Objective-C代码示例
#import <UIKit/UIKit.h>

@interface UIWebView (SaveImage)

- (void)saveImageToAlbum:(NSString *)imageUrl;

@end

@implementation UIWebView (SaveImage)

- (void)saveImageToAlbum:(NSString *)imageUrl {
    NSData *imageData = [NSData dataWithContentsOfURL:[NSURL URLWithString:imageUrl]];
    UIImage *image = [UIImage imageWithData:imageData];
    
    if (image) {
        UIAlertController *alert = [UIAlertController alertControllerWithTitle:@"保存图片"
                                                                        message:@"图片即将保存到相册"
                                                                 preferredStyle:UIAlertControllerStyleAlert];
        UIAlertAction *saveAction = [UIAlertAction actionWithTitle:@"确定" style:UIAlertActionStyleDefault handler:^(UIAlertAction * _Nonnull action) {
            UIImageWriteToSavedPhotosAlbum(image, self, @selector(image:didFinishSavingWithError:contextInfo:), nil);
        }];
        [alert addAction:saveAction];
        [self.viewController presentViewController:alert animated:YES completion:nil];
    } else {
        NSLog(@"无法加载图片");
    }
}

- (void)image:(UIImage *)image didFinishSavingWithError:(NSError *)error contextInfo:(void *)contextInfo {
    if (error) {
        NSLog(@"保存图片失败: %@", error);
    } else {
        NSLog(@"图片保存成功");
    }
}

@end

这个示例展示了如何在iOS原生代码中实现保存图片到相册的功能,并通过plus.runtime.exec方法在uni-app中调用它。注意,实际开发中你可能需要处理更多的错误情况和权限请求(如访问相册的权限)。

回到顶部