我正在尝试实现这样的功能,允许用户将在画布元素上生成的png保存到WordPress媒体库中,或者至少在服务器上(这是在facebook上共享图像的中间步骤,这需要一个有效的图像URL)。
到目前为止,我一直在使用JavaScript完成所有工作,并尝试使用AJAX调用将图像保存到服务器。到目前为止,这是我的AJAX:
$(document).on('click','.facebook',function(e){
var image = document.getElementById("canvas");
var imageURL = image.toDataURL();
$.ajax({
type: "POST",
url: "http://myexample.com",
data: {
imgBase64: imageURL
}
}).done(function(o) {
console.log('saved');
});我想我也有点不确定我的url里应该放些什么……我试着在我的实际媒体库中使用图片的路径,但是当我试图执行这个命令时,得到了一个"permission denied“错误。
有人能帮上忙吗?
发布于 2018-10-17 08:39:13
应该有管理ajax网址。您可以使用ajaxurl javascript变量来引用admin-ajax.php文件。但是,这个变量不是在前端声明的。在前端声明它很简单,只需将以下内容放入主题的header.php中即可。
<script type="text/javascript">
var ajaxurl = "<?php echo admin_url('admin-ajax.php'); ?>";
</script>然后在脚本中使用它,如下所示:
$(document).on('click','.facebook',function(e){
var image = document.getElementById("canvas");
var imageURL = image.toDataURL();
$.ajax({
type: "POST",
url: ajaxurl,
data: {
imgBase64: imageURL
}
}).done(function(o) {
console.log('saved');
});发布于 2018-10-17 09:36:33
我不确定WordPress是否有REST API来上传图像,所以这里有另一种方法:您可以使用以下操作register_rest_route创建自定义端点
在该函数中,您可以处理图像上传,这里有一个如何创建自定义REST端点(类型为POST的http://example.com/imageHandler/v1/upload)的示例。
add_action( 'rest_api_init', function () {
register_rest_route( '/imageHandler/v1', '/upload', array(
'methods' => 'POST',
'callback' => 'uploadImage',
) );
} );
function uploadImage($request) {
$base64Image = $request['imgBase64'];
}在uploadImage函数中,您可能想尝试这个上传base64图像的解决方案:https://gist.github.com/tjhole/3ddfc6cbf6da01c7ce0f,因为单独的WordPress不能处理base64上传。
上传后,您可以通过调用:wp_get_attachment_url返回图像url
https://stackoverflow.com/questions/40617208
复制相似问题