Question

我正在使用CKEditor，我已经成功实现了通常的自定义图像浏览器，它指向我的PHP脚本。但是，这会在一个丑陋的弹出窗口中打开。我想通过ajax将它打开到我页面上的某个div中，这样就可以滑出来并匹配我的cms的其余感觉。

我有两种方法可以做到这一点;

1）CKEditor的自定义插件按钮以某种方式打开我的对话框并以与弹出窗口相同的方式传回

2）通过其他方式打开我的对话框，然后通过单击图像或者在编辑器中拖动它来将图像细节传递给CKEditor！

如果有人这样做，请告诉我。

Answer 1

关于将图像从任何浏览器窗口拖动到编辑器时清理图像标记，以便CMS知道它是本地图像：

我已经实现了一个检查所有图像标记的解决方案，如果它不是本地图像，它会通过ajax请求和PHP将图像复制到服务器，让我向您推荐这个选项：

首先，您不应该立即从编辑器发布内容，而是将其附加到不同的隐藏div，以便您可以使用javascript对其进行分析，让我们将此div作为“descriptionDropPlace”的ID

然后，此代码将检查每个图像的URL，如果它与您的本地域（这里是mydomain）不匹配，它将发出ajax请求：

var images = $('descriptionDropPlaceimg');
$("descriptionDropPlace img").each(function(index){
    var ajaxDone = false;
    var src = $(this).attr("src");

        var domain = src.match(/^http:\/\/[^/]+/)[0];
        if(!domain.match("mydomain")){
            $.post('http://'+window.location.hostname+'/phpGetImage.php', { url: src }).done(function(result){
                $(images[index]).attr('src', result);
                var ajaxDone = true;
            });
        }
});

所以phpGetImage.php看起来像这样（有一些代码可以检测是否存在GET变量并消除它们自身，并检测是否有两个同名但具有不同目录的图像，并保存它们他们所在的整个角色转义网址的名称）：

    $url = $_POST["url"];
    $headers = get_headers($url, 1);
    if(!empty($headers['Location'])){
      $url = $headers['Location'];
    }
    $url = explode("?", $url);
    $url = $url[0];
    $replace = array("/", ".");
    $image = str_replace("http:--", "",str_replace($replace, "-", $url));
    $path = './uploads/yourImageDirectory/'.$image;

    $ch = curl_init($url);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, true);
    $data = curl_exec($ch);
    curl_close($ch);
    file_put_contents($path, $data);

    echo base_url().'uploads/yourImageDirectory/'.$image;

CKEditor自定义图像浏览器

1 个答案: