Volc Web Image

/ Title: volcWebImage Description: volcWebImage /

openPicture openPictureSync isOpen isOpenSync closePicture closePictureSync closeAllPictures closeAllPicturesSync numOfOpenedPictureSync

概述

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获取相关配置参数，详见字节企业服务官网接入文档。

模块接入攻略 接入前需登录字节企业服务平台，创建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/JDJLVq8/  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/JDJLVq8/  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及更高版本

APICloud

模块开发

端API

设备访问

功能扩展

界面布局

导航菜单

开放SDK

云服务对接

小程序模块

H5模块

前端框架

UI模块引擎

云API

技术专题

开发工具

下载

微信公众号适配

七天培训课教程

其他

Faq

开放平台接入指南

自定义加速域名

云主机

入门教程

部署与管理

常见FAQ

Volc Web Image

概述

ImageX 图片服务简介

volcWebImage模块概述

模块接口

openPicture

params

callback(ret, err)

示例代码

可用性

openPictureSync

params

返回值

示例代码

可用性

isOpen

params

callback(ret, err)

示例代码

可用性

isOpenSync

params

示例代码

返回值

可用性

closePicture

params

callback(ret, err)

示例代码

可用性

closePictureSync

params

返回值

示例代码

可用性

closeAllPictures

params

callback(ret, err)

示例代码

可用性

closeAllPicturesSync

params

返回值

示例代码

可用性

numOfOpenedPictureSync

params

返回值

示例代码

可用性