KindEditor Image Upload with Node.js Tutorial
To implement KindEditor’s image uploading function in node.js, you can follow these steps:
- Install the Express framework and the Multer module.
npm install express multer
- Create a route file (such as upload.js) in the project for uploading images and add the following code to it.
const express = require('express');
const multer = require('multer');
const router = express.Router();
const storage = multer.diskStorage({
destination: function (req, file, cb) {
cb(null, 'uploads/') // 指定图片上传的目录
},
filename: function (req, file, cb) {
cb(null, file.originalname) // 使用原始文件名作为上传后的文件名
}
})
const upload = multer({ storage: storage });
router.post('/upload', upload.single('file'), (req, res) => {
const file = req.file;
res.json({
url: `/uploads/${file.filename}`
});
});
module.exports = router;
- Include and use the route file in the main file (such as app.js).
const express = require('express');
const app = express();
const uploadRouter = require('./routes/upload');
app.use('/api', uploadRouter);
app.listen(3000, () => {
console.log('Server is running on port 3000');
});
- In the front-end page, use KindEditor to upload images and save them to the directory specified in the above route (uploads/). Then, return the URL of the uploaded image to KindEditor for display.
The above are the basic steps to implement the image upload function of KindEditor using node.js. You can make appropriate modifications and extensions according to your specific needs.