TinyMCE富文本上传图片的案例

TinyMCE是一款常用的富文本编辑器，它提供了丰富的功能，包括上传图片的功能。下面是一个上传图片的案例：

1. 在页面中引入TinyMCE编辑器的JS和CSS文件：

<!-- 引入TinyMCE编辑器的JS和CSS文件 -->
<script src="//cdn.tinymce.com/4/tinymce.min.js"></script>
<link href="//cdn.tinymce.com/4/skins/lightgray/skin.min.css" rel="stylesheet" />

2. 初始化TinyMCE编辑器，并设置上传图片的配置：

tinymce.init({
  selector: '#editor',  // 编辑器的选择器
  height: 400,  // 编辑器的高度
  plugins: [
    'advlist autolink lists link image charmap print preview anchor',
    'searchreplace visualblocks code fullscreen',
    'insertdatetime media table contextmenu paste code'
  ],
  toolbar: 'undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image',
  // 设置上传图片的配置
  images_upload_url: 'upload.php',  // 上传图片的URL
  images_upload_base_path: '/images/',  // 图片保存的基本路径
  images_upload_credentials: true,  // 是否允许携带cookie等凭据
  images_upload_handler: function (blobInfo, success, failure) {
    // 上传图片的处理函数
    var xhr, formData;
    xhr = new XMLHttpRequest();
    xhr.withCredentials = true;
    xhr.open('POST', 'upload.php');
    xhr.onload = function() {
      var json;
      if (xhr.status != 200) {
        failure('HTTP Error: ' + xhr.status);
        return;
      }
      json = JSON.parse(xhr.responseText);
      if (!json || typeof json.location != 'string') {
        failure('Invalid JSON: ' + xhr.responseText);
        return;
      }
      success(json.location);
    };
    formData = new FormData();
    formData.append('file', blobInfo.blob(), blobInfo.filename());
    xhr.send(formData);
  }
});

3. 编写上传图片的处理函数upload.php：

<?php
if ($_FILES['file']['error'] === UPLOAD_ERR_OK) {
  // 上传成功
  $tmp_name = $_FILES['file']['tmp_name'];
  $name = $_FILES['file']['name'];
  $path = '/images/' . $name;
  move_uploaded_file($tmp_name, $path);
  // 返回上传成功的信息
  $result = array('location' => $path);
  echo json_encode($result);
} else {
  // 上传失败
  echo json_encode(array('error' => '上传失败'));
}
?>

以上就是一个上传图片的TinyMCE富文本编辑器的案例。需要注意的是，上传图片的处理函数需要根据实际情况修改，比如需要对上传的图片进行校验、压缩等处理。