使用keystone时遇到一个问题：keystone后台使用tinymce做富文本编辑器，但其只提供了插入网络图片的功能，而不能上传和管理本地图片，好在keystone提供了选项来为tinymce添加插件，so~开搞

一、 在编辑器中添加插件

1. 上传图片插件

并放到静态目录下

2. 配置

在keystone.init()中增加如下配置项：

{  'wysiwyg additional plugins': 'uploadimage',  'wysiwyg additional buttons': 'uploadimage',  'wysiwyg additional options': {    'uploadimage_form_url': '/api/admin/upload-image', //上传图片的API    'relative_urls': false,    'external_plugins': { 'uploadimage': '/js/uploadimage/plugin.min.js' }, // 上传图片插件  }}

二、后台API

1. 监听路由

在路由文件中增加如下代码：

var router = express.Router();var keystone = require('keystone');var importRoutes = keystone.importer(__dirname);var routes = {  api: importRoutes('./api'),};router.post('/api/admin/upload-image', keystone.middleware.api, routes.api.upload_image);module.exports = router;

我们将API放到api/upload_image.js中，注意新增的API需要添加keystone.middleware.api中间件

2. 建立新域来管理图片

models/FileUpload.js：

var keystone = require('keystone');var Types = keystone.Field.Types;/** * File Upload Model * =========== * A database model for uploading images to the local file system */var FileUpload = new keystone.List('FileUpload');var myStorage = new keystone.Storage({  adapter: keystone.Storage.Adapters.FS,  fs: {    path: keystone.expandPath('public/uploads'), // required; path where the files should be stored    publicPath: 'uploads', // path where files will be served  }});FileUpload.add({  name: { type: Types.Key, index: true},  file: {    type: Types.File,    storage: myStorage  },  createdTimeStamp: { type: String },  alt1: { type: String },  attributes1: { type: String },  category: { type: String },      //Used to categorize widgets.  priorityId: { type: String },    //Used to prioritize display order.  parent: { type: String },  children: { type: String },  url: {type: String},  fileType: {type: String}});FileUpload.defaultColumns = 'name';FileUpload.register();

3. API细节

api/upload_image.js实现细节：

var  keystone = require('keystone'),  fs = require('fs'),  path = require('path');var FileData = keystone.list('FileUpload'); module.exports = function (req, res) {  var    item = new FileData.model(),    data = (req.method == 'POST') ? req.body : req.query;    // keystone采用的老版multer来解析文件，根据req.files.file.path将文件从缓冲区复制出来  fs.copyFile(req.files.file.path, path.join(__dirname, '../../public/uploads', req.files.file.name), function (err) {    var sendResult = function () {      if (err) {        res.send({ error: { message: err.message } });      } else {        // 按插件要求的返回格式返回URL        res.send({ image: {          url: "\/uploads\/" + req.files.file.name        } });      }    };    // TinyMCE upload plugin uses the iframe transport technique    // so the response type must be text/html    res.format({      html: sendResult,      json: sendResult,    });  })}