我正在将Adobe Creative SDK产品应用到我的网站上,用于管理。管理员可以访问特定的图片(用于主页幻灯片),进行编辑和保存。
问题在于Adobe关于如何利用onSave()回调函数的文档非常模糊。我不得不去旧网站Aviary寻找答案,但即使在那里也很模糊。
首先,我通过MySql DB查询从服务器取出图像(至少有2个图像在幻灯片上,所以我希望这是数据库驱动而不是静态的)。这些图像作为文件存储,并在数据库中引用它们。
其次,一旦图像显示在页面上(所有图像都显示在管理页面上,包括文本覆盖层、链接等),管理员可以单击图像,调用Adobe Creative SDK并显示编辑窗口。一切正常。
第三,编辑完成后,管理员可以点击“保存”,他的编辑将暂时保存到Adobe云中(并替换页面上的原始图像)。我需要的是,图像还要保存在我的服务器上,覆盖原始图像(我不想做一个数据库更新——太多额外的工作)。
这就是Adobe和Aviary的模糊说明没有帮助的地方。
以下是我的代码...
(这些是来自Adobe Creative SDK的函数):
基本上,每加载一张图片都会在
这会调用launchEditor函数并显示编辑器。 点击保存按钮时,除了其他一些操作外,将触发onSave()回调,并且在该回调函数中,我可以在本地保存图像。
但是Adobe只提供以下示例来完成此操作,它们对我来说没有什么意义:
首先,似乎需要将此添加到onSave()函数中:
我假设 '/save' 实际上是我用来处理工作的 php 脚本,或者它是保存图像的服务器位置,但我不确定。'postdata' 表示它需要 "对原始图像的某些引用",但我不知道如何获得它。我尝试使用 launchEditor() 函数中的 "url",因为它似乎被传递到了 featherEditor,但这并没有起作用,当我执行 alert() 时,它只返回了一个空值。
如果有人能帮我解决这个问题,我可以轻松处理服务器端的 php,以完成保存操作。但我不知道如何获取 Adobe 保存的新图像以覆盖我的服务器上旧图像。谢谢!
问题在于Adobe关于如何利用onSave()回调函数的文档非常模糊。我不得不去旧网站Aviary寻找答案,但即使在那里也很模糊。
首先,我通过MySql DB查询从服务器取出图像(至少有2个图像在幻灯片上,所以我希望这是数据库驱动而不是静态的)。这些图像作为文件存储,并在数据库中引用它们。
其次,一旦图像显示在页面上(所有图像都显示在管理页面上,包括文本覆盖层、链接等),管理员可以单击图像,调用Adobe Creative SDK并显示编辑窗口。一切正常。
第三,编辑完成后,管理员可以点击“保存”,他的编辑将暂时保存到Adobe云中(并替换页面上的原始图像)。我需要的是,图像还要保存在我的服务器上,覆盖原始图像(我不想做一个数据库更新——太多额外的工作)。
这就是Adobe和Aviary的模糊说明没有帮助的地方。
以下是我的代码...
(这些是来自Adobe Creative SDK的函数):
var featherEditor = new Aviary.Feather({
apiKey: 'myapikey',
theme: 'dark', // Check out our new 'light' and 'dark' themes!
tools: 'all',
appendTo: '',
onSave: function(imageID, newURL) {
var img = document.getElementById(imageID);
img.src = newURL;
},
onError: function(errorObj) {
alert(errorObj.message);
}
});
function launchEditor(id, src) {
featherEditor.launch({
image: id,
url: src
});
return false;
}
基本上,每加载一张图片都会在
<img>
标签中包含一个 onclick 事件,它看起来像这样:<a href="#" onclick="return launchEditor('editableimage<?php echo $srow->id ?>', 'http://www.3yearlectionary.org/assets/slider/<?php echo $srow->sld_image ?>');"><img id="editableimage<?php echo $srow->id ?>" src="assets/slider/<?php echo $srow->sld_image ?>" /></a>
这会调用launchEditor函数并显示编辑器。 点击保存按钮时,除了其他一些操作外,将触发onSave()回调,并且在该回调函数中,我可以在本地保存图像。
但是Adobe只提供以下示例来完成此操作,它们对我来说没有什么意义:
首先,似乎需要将此添加到onSave()函数中:
$.post('/save', {url: newURL, postdata: 'some reference to the original image'})
我假设 '/save' 实际上是我用来处理工作的 php 脚本,或者它是保存图像的服务器位置,但我不确定。'postdata' 表示它需要 "对原始图像的某些引用",但我不知道如何获得它。我尝试使用 launchEditor() 函数中的 "url",因为它似乎被传递到了 featherEditor,但这并没有起作用,当我执行 alert() 时,它只返回了一个空值。
如果有人能帮我解决这个问题,我可以轻松处理服务器端的 php,以完成保存操作。但我不知道如何获取 Adobe 保存的新图像以覆盖我的服务器上旧图像。谢谢!