veImageX
veImageX
- 文档首页
veImageX最佳实践图像处理最佳实践LivePhoto 上传加载全链路
文档反馈
问问助手您可跟随以下内容在 veImageX 完成 LivePhoto 图像的上传加载的全流程操作，并了解该方案优势以及整体使用流程。
背景信息
Live Photo（实况图片）是 Apple 自 2015 年发布的 iphone 6s 及以上机型原生支持拍摄的一种照片形式，Live Photo 会在按下快门的前后 1.5 秒内对画面和声音进行记录，得到一个时长为 3 秒的小视频，Live Photo 本质为 heic 静图 （部分老机型是 jpeg 静图）+ mov 视频的结合。
相较于原始图像格式具有以下优点：
对比短视频体积更小
对比 gif 动图画质更高
更佳的浏览体验，音画结合可以提供更多信息
用户基于 LivePhoto 可创造出多种花样玩法（如表情包）
方案优势
上传简单：支持 LivePhoto 打包上传，可帮助开发者减少开发量，让开发者专注在核心业务的打造；
支持静图、视频转码：在支持 Live Photo 加载的同时可降低文件体积，节省 livephoto 下行流量成本；
丰富的图像处理能力：支持结合缩放、水印等功能，可提升 Live Photo 观看体验；
灵活满足多种下发场景需求：支持下发原图、原视频、处理后静图和处理后视频；
双端适配：支持 Android 和 iOS 双端展示 Live Photo 效果，解决跨平台无法观看的问题。
整体流程
LivePhoto 上传
由于在 iOS 和 Andriod 下动态图的实现不尽相同，因此 veImageX 定义了 LivePhoto 文件进行统一处理。针对动态图的上传，您需要根据我们提供的工具函数，先将动态图打包成 veImageX 能够识别的 LivePhoto 文件，然后再使用上传 SDK 进行上传，上传完成后通过回调将打包文件删除。
由于安卓下没有动态图的一个标准，各厂商实现方式不尽相同，当前暂未支持安卓下的 LivePhoto 上传。仅 iOS 上传 SDK 支持上传 LivePhoto 文件。
文件打包
iOS 提供了 PHLivePhoto 组件来表示一个动态图，本质上就是一个目录，里面包含各分辨率的图片和视频，您可以基于此对象来提取图片视频来打包成我们所需的 LivePhoto 文件。如图所示，我们提供了以下两种打包方式：
方式一：打包 PHLivePhoto：您可以直接传入 PHLivePhoto 对象，由 veImageX 去获取图片以及视频后打包成所需文件并返回其路径。当其中有多个分辨率文件时，veImageX 会选择分辨率最大的原始资源。
方式二：打包图片和视频：您可以自行解析动态图组件以获取图片和视频所在路径，并给上传 SDK 传入图片和视频路径后打包成所需文件后返回其路径。
文件上传
根据实际需求选取打包方式进行文件打包，获得打包后的文件路径后根据打包文件路径初始化上传 Client，设置回调(完成后删除对应文件)，开始上传文件。
LivePhoto 分发
说明
使用 iOS 上传 SDK 上传后的 LivePhoto 文件包含一个 HEIC 格式的图片和一个 MOV 格式的视频。
- 对于能解码的设备，可以直接下发原始图片和视频进行渲染；
- 对于不能解码的设备，可以下发转码到 JPEG 的静图以及转码到 MP4 的视频以保证加载正常，或者直接当作一张静图来加载。
由于使用 iOS 上传 SDK 上传后的打包文件是 veImageX 定义的 LivePhoto 文件，并不能够被直接下发加载使用。 所以 veImageX 也提供了提取并转码的能力，您可以使用图片模板进行图片提取转码，以及使用视频模板进行视频提取并转码。您可以根据自身的需要使用不同的模板能力按需下发 URL 进行加载渲染，可满足以下四种需求：
下发原始图片
可以使用原图的图片模板来直接下发原图，服务端仅从 LivePhoto 中提取图片并返回原图访问 URL。使用原图图片模板并拼接 image 输出格式：http://test.com/test3.jpg~tplv-example-image.image
下发原始视频
可以使用原视频的视频模板来下发原视频，服务仅从 LivePhoto 中提取视频并返回原视频访问 URL。使用原视频的视频模板并拼接 video 输出格式：http://test.com/test3.mov~tplv-example-video.video
原始图片转码
可以使用图片模板来进行图片转码，按需配置图片模板进行处理并转码图片格式。图片模板配置缩放并拼接 webp 输出格式：http://test.com/test3.jpg~tplv-example-resize:1080:0.webp
原始视频转码
说明
请联系提交工单联系技术支持配置视频模板。
可以使用视频模板来进行视频转码，当前视频转码是实时转码并流式返回，但是随着原视频的分辨率的增大，首次访问播放的等待时间就会越久。视频模板配置缩放并拼接 mp4 输出格式：http://test.com/test3.mov~tplv-example-vresize:1080:0.mp4
操作步骤
Step 1： 接入 iOS 上传 SDK
Step 2：接入图片加载 SDK
您可通过以下版本的客户端加载 SDK 加载 LivePhoto，具体适用版本及接入文档如下所示：
| 平台 | 版本号 | 接入文档 |
|---|---|---|
| Android_BDFresco | 2.3.1-tob 及以上 | BDFresco 加载 SDK 接入文档 |
| iOS | 1.38.3.7 及以上 | iOS 加载 SDK 接入文档 |
Step 3：配置处理模板
配置模板时，如需对静图/视频进行缩放、裁剪等处理，请确保图片模板与视频模板配置一致，否则可能出现用户观看 Live Photo 时封面图与视频有差异的问题，导致体验下降。
下发原图：请配置原图输出模板，即输出格式选择 image。
下发转码/处理后的结果图：请参考图片处理配置按需配置图像处理模板。