Home > Web Front-end > JS Tutorial > nodejs integrates kindEditor to implement image upload_node.js

nodejs integrates kindEditor to implement image upload_node.js

WBOY
Release: 2016-05-16 16:16:06
Original
1710 people have browsed it

The kindEditor official website provides integrated applications related to ASP, ASP.NET, and JSP. http://kindeditor.net/docs/upload.html can refer to the integration of nodejs and find that it is easier to use nodejs

Environment:
unbuntu 14.10
nodejs 0.10.35
express 4.11.2
formidable 1.0.16
kindEditor 4.1.10
webStorm 8

1. Create a project named test through IDE or terminal

2. Edit package.json to add formidable dependencies. The 1.0.16 version is used here, and then execute npm install through the terminal to complete the installation of dependencies

3. Place the entire kindEditor directory under test/public/lib

4. Modify index.ejs and index.js files
Integrate kindEditor in index.ejs:
​​​Set the uploadJson of kindEditor to the routing url provided by nodejs for processing image uploads. The /uploadImg
is used here. Add the routing url to handle image uploads in index.js:
                  Add the post processing method corresponding to /uploadImg,
The code is as follows:

index.js

Copy code The code is as follows:




<%= title %>

        

<script><br>         var options = {<br>                uploadJson: '/uploadImg'<br>            };<br> KindEditor.ready(function(K) {<br>                   window.editor = K.create('#editor', options);<br>            });<br> </script>


<%= title %>






index.js

Copy code The code is as follows:
var express = require('express');
var router = express.Router();
var formidable = require('formidable');
/* GET home page. */
router.get('/', function(req, res, next) {
res.render('index', { title: 'Image upload' });
});
router.post('/uploadImg', function(req, res, next) {
var form = new formidable.IncomingForm();
Form.keepExtensions = true;
Form.uploadDir = __dirname '/../public/upload';
Form.parse(req, function (err, fields, files) {
If (err) {
                throw err;
}
      var image = files.imgFile;
      var path = image.path;
Path = path.replace('/\/g', '/');
          var url = '/upload' path.substr(path.lastIndexOf('/'), path.length);
        var info = {
"error": 0,
"url": url
        };
          res.send(info);
});
});
module.exports = router;

After that, start the test project through IDE or terminal, and access the page through

http://localhost:3000 to upload images

Related labels:
source:php.cn
Statement of this Website
The content of this article is voluntarily contributed by netizens, and the copyright belongs to the original author. This site does not assume corresponding legal responsibility. If you find any content suspected of plagiarism or infringement, please contact admin@php.cn
Popular Tutorials
More>
Latest Downloads
More>
Web Effects
Website Source Code
Website Materials
Front End Template