You need to enable JavaScript to run this app.
导航

创意魔方

最近更新时间2023.05.22 18:34:21

首次发布时间2022.10.12 14:14:18

阅读本文,您可以快速了解 Nodejs SDK 中创意魔方相关接口的调用方法。

初始化

设置 AK/SK 和地域,具体可参考初始化

获取渲染样式结果图

使用创意魔方中预先创建好的样式,定义需要设置的要素与要素的取值,生成结果图,并获取结果图 URI。

接口请求参数和返回参数详见 OpenAPI: GetImageStyleResult

const getImageStyleResult = async () => {
  try {
    const res = await Client.GetImageStyleResult({
      StyleId: "your style id",   // 图片渲染所用样式的样式 ID    
      ServiceId: "your service id",   // 服务 ID
      Params: {
        "element id 1": "element content 1",
        "element id 2": "element content 2",
      },
    });
    // do your work
    // ...
  } catch (err) {
    console.error(err);
  }
}

新建样式

使用本接口来创建创意魔方样式,您可以自定义样式名称、样式画布高度/宽度等参数,并得到返回的样式 ID。

接口请求参数和返回参数详见 OpenAPI: CreateImageStyle

const createImageStyle = async () => {
  try {
    const res = await Client.CreateImageStyle({
      Name: "demo",
      Height: 100,   // 样式画布的高度
      Width: 200,   // 样式画布的宽度
      Unit: "px",   // 样式画布宽度/高度的像素单位
      ServiceId: "your service id",   //服务ID
    });
    // do your work
    // ...
  } catch (err) {
    console.error(err);
  }
}

编辑样式

对当前已创建的创意魔方样式的各元素(如图片、文字等)进行新的编辑操作,并选择是否对上传图片按照当前样式数据进行样式渲染以及渲染结果图的存储。

接口请求参数和返回参数详见 OpenAPI: UpdateImageStyle

const updateImageStyle = async () => {
  try {
    const res = await Client.UpdateImageStyle({
      Style: userStyle,    // 更新的样式结构,具体接口请参考样式结构
      DoUpload: false,   // 是否执行对上传图像的样式渲染和渲染结果图的上传操作
    });
    // do your work
    // ...
  } catch (err) {
    console.error(err);
  }
}

删除样式

通过输入样式 ID 来删除该 ID 对应的创意魔方样式。

接口请求参数和返回参数详见 OpenAPI: DeleteImageStyle

const deleteImageStyle = async () => {
  try {
    const res = await Client.DeleteImageStyle({
      StyleId: "your style id",   // 待删除的样式ID
    });
    // do your work
    // ...
  } catch (err) {
    console.error(err);
  }
}

获取样式详情

本接口支持通过输入样式 ID,获取该样式各要素(图片、文字、二维码、背景等)的配置项详情。

接口请求参数和返回参数详见 OpenAPI: GetImageStyleDetail

const getImageStyleDetail = async () => {
  try {
    const res = await Client.GetImageStyleDetail({
      StyleId: "62*******89",   // 样式 ID
    });
    // do your work
    // ...
  } catch (err) {
    console.error(err);
  }
}

获取样式列表

通过输入样式类型等数据,获取分页返回的样式数据信息,如:样式 ID、样式名称和结果图 URI 等参数。

接口请求参数和返回参数详见 OpenAPI: GetImageStyles

const getImageStyles = async () => {
  try {
    const res = await Client.GetImageStyles({
      Type: "user",  //样式类型,取值 user 表示用户样式
      Offset: 0,
      Limit: 10,
    });
    // do your work
    // ...
  } catch (err) {
    console.error(err);
  }
}

更新样式元信息

通过输入样式 ID 以及更新的样式名称来修改已创建完成的创意魔方样式名称

接口请求参数和返回参数详见 OpenAPI: UpdateImageStyleMeta

const updateImageStyleMeta = async () => {
  try {
    const res = await Client.UpdateImageStyleMeta({
      StyleId: "your style id",   // 待更新的样式 ID
      Name: "update-demo",   // 更新后的样式名称 
    });
    // do your work
    // ...
  } catch (err) {
    console.error(err);
  }
}

添加常用图片/背景/蒙版元素

在图片或背景列表添加常用的图片或背景,如果添加失败将返回失败的图片或背景 URI。

接口请求参数和返回参数详见 OpenAPI: AddImageElements

const addImageElements = async () => {
  try {;
    const res = await Client.AddImageElements({
      Type: "image",  // image 表示图片要素;background 表示背景要素;mask 表示蒙版要素。
      Images: ["your picture store uri"],   // 待添加的图片 URI 列表
    });
    // do your work
    // ...
  } catch (err) {
    console.error(err);
  }
}

删除常用图片/背景/蒙版元素

在样式的图片或背景列表删除常用的图片或背景,如果删除失败将返回失败的图片或背景 URI。

接口请求参数和返回参数详见 OpenAPI: DeleteImageElements

const deleteImageElements = async () => {
  try {
    const res = await Client.DeleteImageElements({
      Type: "image",  //image 表示图片要素;background 表示背景要素;mask 表示蒙版要素。
      ImageList: ["your picture store uri"],   //待添加的图片URI列表
    });
    // do your work
    // ...
  } catch (err) {
    console.error(err);
  }
}

获取常用图片/背景/蒙版元素

在图片或背景列表通过指定要查询的要素类型(图片/背景),获取当前已添加为常用的该类型要素详情(如 URI 和添加时间等)。

接口请求参数和返回参数详见 OpenAPI: GetImageElements

const getImageElements = async () => {
  try {
    const res = await Client.GetImageElements({
      Type: "image",   //image 表示图片要素;background 表示背景要素;mask 表示蒙版要素。
      Offset: 0,   //分页偏移量
      Limit: 10,   //分页返回条数
    });
    // do your work
    // ...
  } catch (err) {
    console.error(err);
  }
}

添加常用颜色

通过输入待添加的常用颜色(RGB/RGBA 值),在颜色列表内添加对应的颜色。

接口请求参数和返回参数详见 OpenAPI: AddImageBackgroundColors

const addImageBackgroundColors = async () => {
  try {
    const res = await Client.AddImageBackgroundColors({
      Colors: ["#ffffff"],  // 待添加的颜色列表。以 # 开始,后面跟 RGB 的十六进制值。
    });
    // do your work
    // ...
  } catch (err) {
    console.error(err);
  }
}

删除常用颜色

通过输入待删除的颜色(RGB/RGBA 值),删除颜色列表内对应的颜色。

接口请求参数和返回参数详见 OpenAPI: DeleteImageBackgroundColors

const deleteImageBackgroundColors = async () => {
  try {
    const res = await Client.DeleteImageBackgroundColors({
      Colors: ["#ffffff"],
    });
    // do your work
    // ...
  } catch (err) {
    console.error(err);
  }
}

获取常用颜色

获取当前颜色列表内的所有颜色。

接口请求参数和返回参数详见 OpenAPI: GetImageBackgroundColors

const getImageBackgroundColors = async () => {
  try {
    const res = await Client.GetImageBackgroundColors();
    // do your work
    // ...
  } catch (err) {
    console.error(err);
  }
}