首页 > 解决方案 > ios在CDVWKWebViewEngine ionic cordova angularJS中将文件转换为blob

问题描述

只是在这里碰碰运气。

我的任务是更新 Ionic 1、AngularJS、Cordova 应用程序以更改 iOS 相机和文件权限。

在应用程序的大多数区域中,我可以简单地转换 FileSrc 和 trustAsResourceUrl 来检索和显示在应用程序中。在下面的场景中,我需要将新的安全离子路径转换为 ​​blob 以进行发布。

原始文件路径格式:file:///var/mobile/Containers/Data/Application/10298A9F-7E24-48C4-912D-996EA731F2​​B0/Library/NoCloud/cdv_photo_001.jpg

消毒后: ionic://localhost/ app_file /var/mobile/Containers/Data/Application/10298A9F-7E24-48C4-912D-996EA731F2​​B0/Library/NoCloud/ cdv_photo_001.jpg

以下是我迄今为止尝试过的:

function getDirectory(path) {
    return path.substr(0, path.lastIndexOf('/'));
}

function getFilename(path) {
    return path.substr(path.lastIndexOf('/') + 1);
}


      function getImage(path) {
            const pathStr = path;

            if (window.ionic.Platform.isIOS() && typeof path === 'string') {
                const fixedURL = window.Ionic.WebView.convertFileSrc(path);
                path = $sce.trustAsResourceUrl(fixedURL);
            } 

            if (typeof navigator.camera === 'undefined') {
                return window.fetch(path, { method: 'GET' })
                    .then(function(response) {
                        return response.blob();
                    });
            }

            const filename = getFilename(`${path}`);
            const directory = getDirectory(`${path}`);

            return $cordovaFile.readAsArrayBuffer(directory, filename)
                .catch(function(error) {
                    const err = {
                        message: 'read failed for image',
                        filename,
                        directory,
                        error
                    };
                    $log.error(`getImage, Error: ${JSON.stringify(err)}`);
                    return $q.reject(err);
                })
                .then(function(data) {
                    return new Blob([data], { type: 'image/jpeg' });
                });
        }

标签: iosangularjscordovaionic-v1

解决方案


对于将来可能需要这样做的任何其他人,我发现这是导致问题的保存文件的位置。

在科尔多瓦 getPicture 配置中,我只需要添加

saveToPhotoAlbum: true

在需要 $cordovaFile 的情况下,可以使用 fetch api 从那里提取文件:

return window.fetch(path, { method: 'GET' })
         .then(function(response) {
          return response.blob();
});

推荐阅读