稿定编辑器 SDK 接入说明

稿定编辑器 SDK 是对稿定能力的封装，以实现对设计服务的无缝对接，目前支持以下服务：

• 平面编辑器
• 图片编辑器
• TODO: H5编辑器
• TODO: 打通用户登录, 请联系定制

NPM 包参见：@gaoding/editor-sdk

平面编辑器

1. 海量创意模板快速生成
2. 支持指定数十种主流模板场景类目 (https://gaoding.com/templates)

图片编辑器

• 1. 图片剪裁功能
• 2. 图片增强、图片滤镜效果
• 3. 图片添加水印、添加相框、添加文字
• 4. 海量创意素材（文字、贴纸、边框、水印...）
• 5. 马赛克、涂鸦
• 6. 批量编辑

在接入前，要做什么？

请先与我们联系（邮箱：bd@gaoding.com）， 我们需要合作方提供企业以及接入域名等信息， 以便我们安排专人接待，为合作方预设一些关键数据，如： APPID、模板类目ID

对接与调试

如合作方已经依本文档的定义实现了接口，我们需要合作方提供接入的域名信息，并记录到稿定的系统中，然后，由专人负责与合作方对接调试

安装

npm i @gaoding/editor-sdk
# or
yarn add @gaoding/editor-sdk

cdn 使用方式

<scriptsrc="./jquery.min.js"></script><scriptsrc="https://cdn.dancf.com/editor-sdk@0.2.5/dist/gd-editor-sdk.min.js"></script><script>vargdEditor=newGdEditorSdk({// 区分编辑器类型 (图片编辑器、平面编辑器、H5编辑器)appId: '由SDK方提供',// onCompleted 执行后，是否自动关闭弹窗，默认为 trueautoClose: true,// 完成按钮文案默认“完成”buttonText: '完成',// 0.2.4 版本以上支持onCompleted: function(params){// 上传的例子constform=newFormData();form.append('file',params.blob,'gaoding.jpg');$.ajax({url: 'url',type: 'post',contentType: 'multipart/form-data',data: form,success: function(res){alert("ok")}});},// 自定义iFrame样式style: {}});gdEditor.open({ext: {third_cate_id: 356}});</script>

npm 使用方式

import{GdEditorSdk}from'@gaoding/editor-sdk';constgdEditorSDK=newGdEditorSdk({// 区分编辑器类型 (图片编辑器、平面编辑器、H5编辑器)appId: '由SDK方提供',// onCompleted 执行后，是否自动关闭弹窗，默认为 trueautoClose: true,// 完成按钮文案默认“完成”buttonText: '完成',// 完成编辑器下载时触发onCompleted({ blob, workId, sourceId }){// 直接展示consturl=window.URL.createObjectURL(blob);constimg=document.createElement('img');img.src=url;document.body.append(img);// 上传的例子constform=newFormData();form.append('file',blob,'gaoding.jpg');axios.post('url',form,{headers: {'Content-Type': 'multipart/form-data'}}).then(res=>{alert('上传成功');}).catch(error=>{alert(error.message);})},// 自定义iFrame样式style: {}});// 打开弹窗gdEditorSDK.open({ext: {// 指定海报模板类目(图片、简历、GIF、LOGO、海报、表情头像、文章配图、适配封面。。。)// ps: 使用场景为平面编辑器, 分类 ID 由 SDK方提供// third_cate_id: '',// 指定编辑器底图// ps: 使用场景为图片编辑器，需开启 CORS 跨域访问，稿定域名为 *.gaoding.comurl: 'https://st-gdx.dancf.com/materials/115030/shots/20190830-155521-WWU47.png'}});// 关闭弹窗gdEditorSDK.close();