Volc Web Image

/ Title: volcWebImage Description: 本模块支持SDWebImage、YYWebImage等主流开源框架的绝大部分核心能力，提供主流格式图片加载、基础处理以及服务质量监控上报等能力，并针对HEIF动图/静图解码场景进行自研解码器优化。使用本模块需创建AppID获取相关配置参数，详见https://zjsms.com/eJ1bYct/ /

来自于：第三方立即使用

openPicture openPictureSync isOpen isOpenSync closePicture closePictureSync closeAllPictures closeAllPicturesSync numOfOpenedPictureSync

概述

ImageX 图片服务简介

ImageX 图片服务简介

ImageX图片服务（ImageX）主要面向中小企业提供图片上传、存储、处理、分发的一站式便捷服务，并提供详尽的服务质量监控和数据报表服务。 交付形态：主要以云服务的形式为主，同时提供客户端图片加载SDK、服务端SDK和上传SDK等。

主要应用场景

  • 图床管理：协助企业提供图片托管服务，且可以根据不同图床场景，提供原图保护等能力。
  • 信息流/新闻类应用：针对各类应用的 H5 页面、新闻客户端、Feed 流推荐、在线漫画等应用场景，结合SDK提供防劫持、预加载、预解码和智能裁剪等能力。
  • 游戏类应用：针对游戏 UI 资源包、安装包等应用场景，实现 UI 资源的快速加载，同时提高游戏安装和更新的速度。
  • 版权大图：针对版权大图，提供更高质量的图片压缩、处理、转换等场景，同时支持明暗水印、原图保护、防盗链、私密访问，保护版权防止资源外泄。

产品核心优势 依托于字节系产品多年的图像技术积累和基础资源，为客户提供最极致的一站式图像处理能力。

  • 极致节流 支持端到端 HIEC/HEIF等高压缩图片格式，相比 WebP体积还要小30%，在保持画质不变的前提下，成本再次节省。
  • SDK全端支持，可视化图片质量监控 支持上传、图片加载SDK，支持 Android、iOS 客户端SDK和多语言服务端SDK。支持跟踪与监控图片上传、分发网络、解码等多阶段服务质量详情。
  • 图片在线处理 通过基于URL的API提供各种图像处理，以将艺术效果应用于图像或简单地对其进行缩放。通过简单的链式变换系统，您可以即时裁剪，缩放，转码，过滤和优化原始高分辨率图像。基于条件参数或查看上下文的裁剪变换，为用户提供最合适的版本。
  • 全球图片分发 接入全球主流CDN厂商，在多家CDN厂商间灵活的智能调度，确保国内外用户的极致观看体验。
  • 高速上传 多机房部署，拥有全球上行CDN加速，支持不同场景的高速上传需求。

客户案例 字节跳动旗下涉及视频图像处理相关应用均接入ImageX图片服务，核心包括抖音、今日头条、西瓜视频、Faceu激萌等几十款应用服务。

volcWebImage模块概述

本模块支持SDWebImage、YYWebImage等主流开源框架的绝大部分核心能力，提供主流格式图片加载、基础处理以及服务质量监控上报等能力，并针对HEIF动图/静图解码场景进行自研解码器优化。使用本模块需创建AppID获取相关配置参数，详见火山引擎官网接入文档。 如在对接过程中出现任何疑问，请前往火山引擎官网创建工单，问题描述里填写：APICloud接入问题咨询+您遇到的具体问题，我们的技术支持工程师将为您提供接入支持。

模块接入攻略 接入前需登录火山引擎官网控制台，创建AppID以获取相关配置参数。 使用此模块之前需要先配置 config.xml 文件，配置完毕，需通过云端编译生效，配置方法如下：

  • 名称：volcWebImage

  • 参数：

    appID：（必须配置）从火山引擎官网控制台获取的 appID。 appName：（可选配置）APP的名称，建议不要包含中文字符。

  • 配置示例:

  <feature name="volcWebImage" platform="ios">
    <param name="appID" value="123456789"/>
    <param name="appName" value="my_awesome_app"/>
  </feature>

模块接口

openPicture

异步打开图片。使用前必须在config.xml中配置appID。appID的获取方法见火山引擎官网控制台

openPictureSync({params}, callback(ret, err))

params

rect：

类型：关联数组 描述：（必填项）模块(图片)的位置及尺寸

{
  x: 0,   //（必填项）数字类型；模块左上角的 x 坐标（相对于所属的 Window 或 Frame）；默认值：0
  y: 0,   //（必填项）数字类型；模块左上角的 y 坐标（相对于所属的 Window 或 Frame）；默认值：0
  w: 320, //（必填项）数字类型；模块的宽度；默认值：所属的 Window 或 Frame 的宽度
  h: 250  //（必填项）数字类型；模块的高度；默认值：250
}

path:

  • 类型：字符串
  • 描述：（必填项）图片资源地址，如支持http和https路径，如 http://xxx/xxx/abc.webp

fixedOn:

  • 类型：字符串
  • 描述：目标窗口名字，默认为主窗口名字

fixed:

  • 类型：Boolean
  • 描述：视图是否固定，为NO时跟随目标窗口内容滚动而滚动

callback(ret, err)

ret：

  • 类型：JSON对象
  • 内部字段：
    picID: "bf31d554-ede7-11ea-adc1-0242ac120002" // 字符串。图片句柄，如果打开失败将为空。后续关闭该图片时，需要传入此句柄作为参数。
msg: "success" | "failure" | "请在config.xml中指定appID，以便您使用volcWebImage的功能. 获取appID: https://zjsms.com/eJ1bYct/  Please specify appID in config.xml so volcWebImage can be initialized. " //字符串。

err：

  • 类型：JSON 对象
  • 内部字段：

示例代码

function openPicture2() {
    var volcWebImage = api.require('volcWebImage');

    volcWebImage.openPicture({
        rect : {
            x : 100,
            y : 400,
            w : 100,
            h : 75
            },
        path: 'http://www.ioncannon.net/wp-content/uploads/2011/06/test2.webp'
    }, (picID, err) => {
        // 存储 picID
    });
}

可用性

iOS系统

可提供的1.0.0及更高版本

openPictureSync

同步打开图片。使用前必须在config.xml中配置appID。配置方法见文档描述。

openPictureSync({params})

params

rect：

类型：关联数组 描述：（必填项）模块(图片)的位置及尺寸

{
  x: 0,   //（必填项）数字类型；模块左上角的 x 坐标（相对于所属的 Window 或 Frame）；默认值：0
  y: 0,   //（必填项）数字类型；模块左上角的 y 坐标（相对于所属的 Window 或 Frame）；默认值：0
  w: 320, //（必填项）数字类型；模块的宽度；默认值：所属的 Window 或 Frame 的宽度
  h: 250  //（必填项）数字类型；模块的高度；默认值：250
}

path:图片路径

  • 类型：字符串
  • 描述：（必填项）图片资源地址，如支持http和https路径，如 http://xxx/xxx/abc.webp

fixedOn:

  • 类型：字符串
  • 描述：目标窗口名字，默认为主窗口名字

fixed:

  • 类型：Boolean
  • 描述：视图是否固定，为NO时跟随目标窗口内容滚动而滚动

返回值

ret：

  • 类型：JSON对象
  • 内部字段：
    picID: "bf31d554-ede7-11ea-adc1-0242ac120002" // 字符串。图片句柄，如果打开失败将为空。后续关闭该图片时，需要传入此句柄作为参数。
msg:  "success" | "failure" | "请在config.xml中指定appID，以便您使用volcWebImage的功能. 获取appID: https://zjsms.com/eJ1bYct/  Please specify appID in config.xml so volcWebImage can be initialized. " //字符串。

示例代码

function openPicture() {
    var volcWebImage = api.require('volcWebImage');
    var picID = volcWebImage.openPictureSync({
        rect : {
            x : 0,
            y : 400,
            w : 100,
            h : 75
            },
        path: 'https://www.planetware.com/wpimages/2020/02/france-in-pictures-beautiful-places-to-photograph-eiffel-tower.jpg',
    });
}

可用性

iOS系统

可提供的1.0.0及更高版本

isOpen

判断一张图片是否打开

isOpen({params}, callback(ret, err))

params

pictureID:

  • 类型: string
  • 描述: 打开图片时获得的图片句柄

callback(ret, err)

ret：

  • 类型：BOOL 对象
  • 描述：标识图片是否打开

示例代码

function isOpen() {
    var volcWebImage = api.require('volcWebImage');
    volcWebImage.isOpen({
        pictureID: openedPictures[openedPictures.length - 1]
    }, (ret, err) => {
        if (err) {
            api.toast({
                msg: "error",
                location: "middle"
            })
        } else {
            if (ret) {
                api.toast({
                    msg: "is open",
                    location: "middle"
                })
            } else {
                api.toast({
                    msg: "is not open",
                    location: "middle"
                })
            }
        }
    });
}

可用性

iOS系统

可提供的1.0.0及更高版本

isOpenSync

打开图片的同步方法

isOpenSync({params})

params

pictureID:

  • 类型: string
  • 描述: 打开图片时获得的图片句柄

示例代码

function isOpen() {
    var volcWebImage = api.require('volcWebImage');
    var picIsOpen = volcWebImage.isOpen({
        pictureID: openedPictures[openedPictures.length - 1]
    });
}

返回值

  • 类型：BOOL
  • 描述：标识图片是否已被打开

可用性

iOS系统

可提供的1.0.0及更高版本

closePicture

关闭图片

closePicture({params}, callback(ret, err))

params

pictureID:

  • 类型: string
  • 描述: 打开图片时获得的图片句柄

callback(ret, err)

ret：

  • 类型：JSON 对象
  • 内部字段：
{
    success: true   //布尔型；true||false
    msg: '' // 字符串
}

err：

  • 类型：JSON 对象或nil

示例代码

function closeLastOpenedPicture() {
    var volcWebImage = api.require('volcWebImage');
    var msg = volcWebImage.closePicture(
        {pictureID: openedPictures[openedPictures.length - 1]},
        function(ret, err) {
            var success = ret["success"]
            var mag = ret["mag"]
            // ...
        }
    );
    openedPictures.pop()
}

可用性

iOS系统

可提供的1.0.0及更高版本

closePictureSync

关闭图片的同步方法

closePictureSync({params})

params

pictureID:

  • 类型: string
  • 描述: 打开图片时获得的图片句柄

返回值

  • 类型：JSON 对象
  • 内部字段：
{
    success: true   //布尔型；true||false
    msg: 'xxx' // 字符串
}

示例代码

function closeLastOpenedPicture() {
    var volcWebImage = api.require('volcWebImage');
    var msg = volcWebImage.closePictureSync({pictureID: openedPictures[openedPictures.length - 1]});
    openedPictures.pop()
}

可用性

iOS系统

可提供的1.0.0及更高版本

closeAllPictures

关闭所有已打开的图片 closeAllPictures(function(ret, err) {})

params

无

callback(ret, err)

ret：

  • 类型：JSON 对象
  • 内部字段：
{
    success: true   //布尔型；true||false
    msg: '' // 字符串
}

err：

  • 类型：JSON 对象或nil

    示例代码

    function closeAllPictures() {
  var volcWebImage = api.require('volcWebImage');
  volcWebImage.closeAllPictures(function(ret, err) {
      openedPictures = []
  });
}

    可用性

    iOS系统

可提供的1.0.0及更高版本

closeAllPicturesSync

关闭所有已打开的图片的同步方法 closeAllPicturesSync()

params

无

返回值

  • 类型：JSON 对象
  • 内部字段：
{
    success: true   //布尔型；true||false
    msg: '' // 字符串
}

示例代码

function closeAllPictures() {
    var volcWebImage = api.require('volcWebImage');
    volcWebImage.closeAllPicturesSync();
}

可用性

iOS系统

可提供的1.0.0及更高版本

numOfOpenedPictureSync

获取已打开图片的数量的同步方法 numOfOpenedPictureSync()

params

无

返回值

  • 类型：整数
  • 描述：已打开图片的数量

    示例代码

    var volcWebImage = api.require('volcWebImage');
var cnt = volcWebImage.numOfOpenedPictureSync();

    可用性

    iOS系统

可提供的1.0.0及更高版本