一、API Spec - API 规格(Photopea API 文档翻译)

3,534 阅读3分钟
  • API Spec 规格
    • Environment 环境
    • Live Messaging 即时通讯
    • Plugins 插件
  • Playground
  • Accounts

向 Photopea 传送数据

Photopea可以使用哈希符号后面的参数进行配置。

https://www.photopea.com#STRING_VALUE

这样的 URL 可以直接打开,也可以用作 iframe 的 src。字符串值使用查询参数的经典编码(空格为% 20等)编码到 URL 中。它对应于 Javascript 中的 encodeURI ()或 PHP 中的 urlencode ()。这个字符串包含一个 JSON 对象。

JSON 配置对象

JSON 对象必须具有以下结构:

{
	"files" : [
		"https://www.mysite.com/images/design.psd",
		"https://www.mysite.com/images/button.png",
		"data:image/png;base64,iVBORw0KGgoAAAAN..."
	],
	"resources" : [
		"https://www.xyz.com/brushes/Nature.ABR",
		"https://www.xyz.com/grads/Gradients.GRD",
		"https://www.xyz.com/fonts/NewFont.otf"
	],
	"server" : {
		"version" : 1,
		"url"     : "https://www.myserver.com/saveImage.php",
		"formats" : [ "psd:true", "png", "jpg:0.5" ]
	},
	"environment" : {...},
	"script" : "app.activeDocument.rotateCanvas(90);"
}

所有参数都是可选的。可以使用数据 URI -- 文件可以在请求中传递(测试)。

参数

  • Files-文件数组,在 Photopea 启动时加载
  • Resources-资源数组(渐变、画笔、字体... ...)
  • Server- 参数,用于将文档保存回服务器
    • version-API 的版本
    • url-服务器的地址
    • formats-应该被发送到服务器的文档的格式。字符串格式对应于 [saveToOE](Photopea - Scripts)
  • Environment-环境的参数,请参见 [Environment](Photopea API)
  • Script- 脚本,应该在加载每个文件之后执行(可以很长)

保存到服务器

如果在对 Photopea.com 的请求中指定了 server 参数,那么在 Photopea 打开的每个文档都会有 File-Save 选项。用户单击文档数据后,文档数据将通过 HTTP 请求(使用 POST 方法的http请求)发送到服务器。

Photopea 将向您的服务器发送二进制数据(字节序列) ,该服务器由两部分组成:

  • 2000字节 - JSON 数据
  • 其余 - 一个或多个图像文件

JSON 的结构如下:

{
	"source" : "https://www.mysite.com/images/button.png",
	"versions" : [
		{"format":"psd", "start":      0, "size": 700000 },
		{"format":"jpg", "start": 700000, "size": 100000 },
		...
	]
}
  • Source- 如果文件是从服务器加载的,则该值是此文档的 URL。否则(打开本地文件,创建一个空文件) ,它包含“ local,X,NAME”,其中 X 是文档的整数 ID,NAME 是文档的名称
  • versions 文档的不同版本
    • format - 文件格式,从Photopea导出
    • Start、 size - 文件偏移量和 size (relative,从JSON末尾开始)

下面是一个简短的 PHP 示例,它接受来自 Photopea 的文件。

$fi = fopen("php://input", "rb");  
$p = JSON_decode(fread($fi, 2000));
// getting file name from "source"

$fname = substr ($p->source, strrpos($p->source,"/")+1);  
$fo = fopen("img/".$fname,"wb");

while($buf=fread($fi,50000)) 
fwrite($fo,$buf);
fclose($fi);  
fclose($fo);

你的回应

在服务器接收到文件之后,它可以发回 JSON 响应(这个JSON 是带有可选 String 参数的):

  • message- 指定后,将向用户显示片刻
  • script- 当指定时,将被执行(例如,您可以调用app.echoToOE("saved");)
  • newSource- 指定后,将用作“source”的新值,以便将来保存到服务器(当在Photopea中创建文件时:“source”是“local,...” 可能很有用)

跨域资源共享

出于安全原因,web应用只能访问来自同一域的文件。为了让 Photopea 加载你的文件,你的服务器的响应必须包含以下标头:

Access-Control-Allow-Origin: *

有关详细信息,请参阅 CORS 规范或 enable-cors.org

价格

Photopea API的使用是完全免费的。请记住,PP处于开发的早期阶段,可能存在严重的错误。对于Photopea编辑或生成的文档,我们不承担任何责任。

如果要隐藏广告和“彩色按钮”,并使用白标模式,请查看分销商帐户