iOS实况live图标签

预览

电脑端将鼠标移至左上角即可预览live照片，移动端长按图片预览。

图源Apple官网

删删改改

这里我就不放代码了，估计没多少人看（其实是因为懒，有需要的话可以直接瞄瞄 commit 记录

https://github.com/weekdaycare/hexo-theme-stellar/commit/d568f23aee792d6ff54c25b48a4b6b84827c42afhttps://github.com/weekdaycare/hexo-theme-stellar/commit/d568f23aee792d6ff54c25b48a4b6b84827c42af

How to Use

如果你用的是 Win 电脑，直接将电脑和 iPhone 连在一起，手机上点击弹窗授权，就可以直接在电脑上查看手机 live 图的 JPG 和 MOV ，给他复制出来，至于压缩和储存问题，我不到啊（可以试试 ffmpeg 或者在线压缩工具，需要注意不要改变格式）

对于 MAC 用户，（俺也不到啊，我没有 MAC 🥺）参照苹果官方文档中不同设备的导出方式将 Live Photo 照片以及对应的视频导出。

基本写法

{% live [alt] photo:url video:url [width:300px] [height:400px] [effect:live/loop/exposure/bounce] [style:full/hint/loop] [preload:boolean] %}

{% live 图片来源于Apple官网 photo:/asset/boy.jpg video:/asset/boy.MOV %}

参数示例

alt: # live图文字说明
photo: https://xxx.jpg # JPG图片链接
video: https://xxx.mov # mov视频链接
width: 300px # 默认300px
height: 400px # 默认400px
effect: live/loop/exposure/bounce # 显示效果，默认为live
style: full/hint/loop # 也是显示效果？默认为full，搞不懂，苹果官网给了这个参数就用吧
preload: true/false # 是否在用户开始播放之前下载，默认为true

注意事项

该部分引用自 hsuyeung 已获得作者授权

宽高比为 3:4 比例的图片大小请勿超过 1088 x 1344，其他宽高比暂时没测试过，但越小越好，因为官方的实现原理原因，太大了会导致 safari 浏览器体验效果极差（包括但不限于鬼畜、卡顿、无法加载）
视频格式必须是 .MOV 格式（不区分大小写），且返回的数据的响应头必须为 video/quicktime，且宽高比为 3:4 的视频的大小请勿超过 720 x 960，理由同上
将你的图片以及视频上传至一个互联网可访问的地方并提供一个访问链接。且视频的提供方需要支持 206 状态码的 分段传输 功能（这个主要是为了兼容 Safari 浏览器）
视频编码方式需要是 H.264，如果导出来的是 HEVC 编码的，很多浏览器都不兼容这个编码的视频播放，需要自己转换一下
存在一定概率连续播放几次后就没法播放了，这个没法解决，只有刷新页面解决
这个功能的兼容性不是很好，Google、Safari 这些是没有问题的（版本过低也不行），其他浏览器以及一些应用内置的浏览器可能无法查看，所以如果你无法查看请切换浏览器试试