`
libudi
  • 浏览: 35750 次
  • 性别: Icon_minigender_1
  • 来自: 郑州
社区版块
存档分类
最新评论

为 KindEditor 实现图片上传

阅读更多

用 Lysee 开发了一个 BBS,发贴和回复用的是 KindEditor ,图片上传这块用 Lysee 照抄了 upload.php,经测试没有问题,发上来大家看看。

 

<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8">';
<title>{:bbsys::SITE_NAME:} - Insert Image</title>
</head>
<body>  
<!--{:
string image_save_path(string file_sum)
{
  int hv = file_sum.hash();
  string rv = format("%.3d", [(hv % 256) + 1]);
  string sv = format("%.3d", [(hv \ 256) % 256 + 1]);
  string path = incPD(web_upload_path + rv) + sv;
  sys::mkdir(path);
  return incPD(path);
}

string img_URL = "";  
string tmp_file = ${request.imgFile->file};
string ext = ${request.imgFile}.fileExt().lower();
if (ext in [".jpg", ".jpeg", ".png", ".gif"]) { 
  string sum = tmp_file.md5sum(true);
  string path = image_save_path(sum);
  string img_file = path + sum + ext;
  if (isfile(img_file) or sys::cp(tmp_file, img_file))
    img_URL = veryUD(img_file.copy(length(web_path), length(img_file)));
}

= """<script language="javascript">"""; 
= (img_URL) ? @"""parent.KE.plugin["image"].insert("%{request.id}", 
                  "%(img_URL)", "%{request.imgTitle}", "%{request.imgWidth}",
                  "%{request.imgHeight}", "%{request.imgBorder}");"""
              :"""alert("Failed inserting image!");history.back();""";
= """</script>""";
:}-->
</body>
</html>
 
0
0
分享到:
评论
1 楼 libudi 2009-09-26  
引用
JavaEye 的编辑器还有问题,重新编辑 BLOG 内容时如果原文最后是代码,新打开的编辑器光标无法移动到代码的后边


补充显示 upload.php 作作对照。

<?php

//文件保存目录路径
$save_path = './../attached/';
//文件保存目录URL
$save_url = './../attached/';
//定义允许上传的文件扩展名
$ext_arr = array('gif', 'jpg', 'jpeg', 'png', 'bmp');
//最大文件大小
$max_size = 1000000;
//更改目录权限
@mkdir($save_path, 0777);

//有上传文件时
if (empty($_FILES) === false) {
    //原文件名
    $file_name = $_FILES['imgFile']['name'];
    //服务器上临时文件名
    $tmp_name = $_FILES['imgFile']['tmp_name'];
    //文件大小
    $file_size = $_FILES['imgFile']['size'];
    //检查文件名
    if (!$file_name) {
        alert("请选择文件。");
    }
    //检查目录
    if (@is_dir($save_path) === false) {
        alert("上传目录不存在。");
    }
    //检查目录写权限
    if (@is_writable($save_path) === false) {
        alert("上传目录没有写权限。");
    }
    //检查是否已上传
    if (@is_uploaded_file($tmp_name) === false) {
        alert("临时文件可能不是上传文件。");
    }
    //检查文件大小
    if ($file_size > $max_size) {
        alert("上传文件大小超过限制。");
    }
    //获得文件扩展名
    $temp_arr = explode(".", $file_name);
    $file_ext = array_pop($temp_arr);
    $file_ext = trim($file_ext);
    $file_ext = strtolower($file_ext);
    //检查扩展名
    if (in_array($file_ext, $ext_arr) === false) {
        alert("上传文件扩展名是不允许的扩展名。");
    }
    //移动文件
    $file_path = $save_path . $file_name;
    if (move_uploaded_file($tmp_name, $file_path) === false) {
        alert("上传文件失败。");
    }
    $file_url = $save_url . $file_name;
    //插入图片,关闭层
    echo '<html>';
    echo '<head>';
    echo '<title>Insert Image</title>';
    echo '<meta http-equiv="content-type" content="text/html; charset=utf-8">';
    echo '</head>';
    echo '<body>';
    echo '<script type="text/javascript">parent.KE.plugin["image"].insert("' . $_POST['id'] . '", "' . $file_url . '","' . $_POST['imgTitle'] . '","' . $_POST['imgWidth'] . '","' . $_POST['imgHeight'] . '","' . $_POST['imgBorder'] . '");</script>';
    echo '</body>';
    echo '</html>';
}

//提示,关闭层
function alert($msg)
{
    echo '<html>';
    echo '<head>';
    echo '<title>error</title>';
    echo '<meta http-equiv="content-type" content="text/html; charset=utf-8">';
    echo '</head>';
    echo '<body>';
    echo '<script type="text/javascript">alert("'.$msg.'");history.back();</script>';
    echo '</body>';
    echo '</html>';
    exit;
}
?>

相关推荐

    kindEditor+图片批量上传

    "KindEditor图片批量上传工具"是一款专为网页设计者和内容创作者打造的高效图片上传解决方案。这款工具允许用户在Web界面一次性上传多张图片,极大地提升了工作效率,特别是对于那些需要频繁处理文字和图像,比如...

    kindeditor图片上传携带token字段

    本文将详细讲解如何在KindEditor中实现图片上传时携带token字段,以确保数据的安全性和完整性。 首先,理解“token”在Web开发中的作用至关重要。Token通常用于验证客户端请求的合法性,防止跨站请求伪造(Cross-...

    kindeditor上传图片自动压缩过大的图片

    首先,我们需要了解KindEditor的图片上传流程。当用户在编辑器中选择图片并提交上传时,KindEditor会调用预设的上传处理程序,通常是通过一个服务器端脚本,如`upload_json.ashx`。这个脚本负责接收图片数据,验证,...

    vue 使用kindeditor粘贴复制图片上传给自己服务器,单独图片上传

    vue 使用kindeditor粘贴复制图片上传给自己服务器,单独图片上传,避免用户到处寻找,解决了用户粘贴复制截图时候,图片变成base64,上传给后台的时候长度过于长,所以在粘贴的时候就上传给服务器,最后以形式显示在富...

    KindEditor-4.1.9批量上传图片完整示例(可以上传到image目录下的子目录中,可返回上一级目录,并实现了按名称、大小、类型排序的功能)

    这是本人写的一个基于KindEditor-4.1.9的Java项目,采用Struts2框架,实现了KindEditor单张图片上传、批量图片上传,可以上传到image目录下的子目录中,可返回上一级目录,并实现了按名称、大小、类型排序的功能。...

    kindeditor上传视频、图片功能实现

    1. **KindEditor的图片上传功能**: KindEditor内建了图片上传的功能,用户可以通过点击编辑器内的“图片”按钮打开图片上传对话框。这个功能通常通过Ajax异步方式与服务器进行交互,将图片文件上传到指定的服务器...

    kindeditor多图上传H5版

    在H5版的KindEditor中,图片上传功能将基于HTML5的File API和FormData对象来实现,这使得用户无需Flash插件也能进行文件上传。 3. **File API**:这是HTML5引入的一套接口,允许JavaScript操作本地文件,包括读取、...

    优化kindeditor,修改flash批量上传图片方式为H5上传

    对于上传本地视频,处理方式类似图片上传,只不过需要考虑视频文件的格式和大小限制。 “添加手机尺寸预览”意味着在编辑器中,用户可以看到内容在不同移动设备屏幕尺寸下的效果。这可能通过CSS媒体查询实现,根据...

    KindEditor图片上传相关问题

    本文将深入探讨与KindEditor图片上传相关的问题,并结合提供的`UploadService.java`文件,解析图片上传服务的实现细节。 首先,我们需要了解KindEditor的图片上传流程。当用户在编辑器中选择插入图片时,KindEditor...

    kindEditor4.1版修改上传图片宽高(图片自适应)

    ### kindEditor4.1 版本中实现图片自适应的方法 #### 一、问题背景与需求分析 在使用kindEditor4.1版本时,我们可能会遇到一个常见的问题:上传的图片无法很好地适配不同大小的屏幕,导致在某些设备上出现拉伸或...

    kindeditor编辑器,可上传多图片,文件上传等功能

    KindEditor是一款开源的Web富文本编辑器,专为网页设计和开发者提供便利。它支持多图片上传、文件上传等丰富的功能,广泛应用于个人项目和公司项目。在ASP.NET环境中,KindEditor能很好地集成到Web应用中,提供一个...

    kindeditor上传图片Demo

    这个"kindeditor上传图片Demo"是一个示例项目,旨在演示如何在KindEditor中集成图片上传功能。在开发过程中,开发者可能会遇到各种问题,比如权限设置、服务器端处理、前端交互等。在这个Demo中,作者可能已经解决了...

    kindeditor添加图片压缩功能(Asp.net版)

    KindEditor是一款开源的在线富文本编辑器,常...总的来说,通过这个项目,你可以了解到如何在Asp.net环境中结合KindEditor实现图片上传和压缩的完整流程,这对于开发任何涉及用户上传图片的Web应用都是十分有价值的。

    jquery + kindEditor 单个图片上传

    为了实现图片上传功能,需要配置KindEditor的相关选项,并利用jQuery处理表单提交过程中的数据交互。 1. **启用图片上传**: - 在创建编辑器实例时设置`allowImageUpload`选项为`true`。 - 指定图片上传接口的URL...

    KindEditor 4.1.11 完整图片上传 表单提交Demo

    KindEditor 4.1.11 是一个流行的开源富文本编辑器,专为网页内容编辑设计,支持多种功能,如图片上传、URL回显、图片预览等。在这个"完整图片上传 表单提交Demo"中,我们主要关注的是如何在Java环境下,特别是在...

    kindEditor批量传图配置

    其中,`uploadJson`参数非常重要,它指定了图片上传的服务器端处理脚本地址。这里需要注意的是,实际开发中需要将`'{url:/block/upload_img_from_editor}'`替换为实际的服务器端处理脚本地址。 3. **解决常见问题*...

    kindeditor富文本,多图上传,去除flash插件,解决无法展示选择图片按钮问题,以及添加上传后结果展示

    KindEditor提供了一套回调机制,可以在图片上传成功后执行自定义函数。在这个函数中,你可以解析服务器返回的数据,创建代表每个图片的HTML元素,并将其插入到编辑器的适当位置。服务器返回的数据通常包括图片的URL...

    优化kindeditor,修改flash批量上传图片方式为H5上传,添加第三方视频代码功能,添加手机尺寸预览,粘

    随着Flash技术的逐渐淘汰,将KindEditor中原有的基于Flash的图片批量上传方式替换为H5(HTML5)上传,这是一个必要的优化步骤。HTML5引入了File API,使得在浏览器中处理文件变得更加便捷和安全。通过使用`...

    kindeditor--自定义添加网络视频插件,修改批量图片上传方式flash为h5

    这个压缩包文件的内容显然是关于如何在KindEditor中自定义添加网络视频插件以及将原有的Flash批量图片上传方式替换为H5(HTML5)上传方式。下面我们将深入探讨这两个主题。 首先,让我们了解网络视频插件的自定义...

Global site tag (gtag.js) - Google Analytics