广告
返回顶部
首页 > 资讯 > 前端开发 > node.js >node.js中实现kindEditor图片上传功能的方法教程
  • 680
分享到

node.js中实现kindEditor图片上传功能的方法教程

图片上传功能方法 2022-06-04 17:06:44 680人浏览 安东尼
摘要

前言 最近由于工作需要使用在线编辑器,找了几个对比了下KindEditor还是不错的,国产的但文档还是不全,还好能参考官方插件,kindEditor官网上中提供了ASP,asp.net,jsP相关的整合应用

前言

最近由于工作需要使用在线编辑器,找了几个对比了下KindEditor还是不错的,国产的但文档还是不全,还好能参考官方插件,kindEditor官网上中提供了ASP,asp.net,jsP相关的整合应用

可以参照官方文档实现nodejs的kindEditor上传功能:Http://kindeditor.net/docs/upload.html

在线下载kindEditor编辑器:http://www.lsjlt.com/codes/36131.html

实现方法:

1.在客户端js中定义uploadJSON为fORM post的action地址


var options = {
 uploadJson: '/uploadImg'
};
KindEditor.ready(function(k){
 editor = k.create('#post',options);
});

2.在nodejs中配置文件上传地址


var express = require('express');
var bodyParser = require('body-parser');
app.use(express.bodyParser({uploadDir:'./public/upload'}));

3.通过路由将请求交给uploadImg方法来处理


module.exports = function (app, routes) {
 app.post('/uploadImg',routes.uploadImg);
};
exports.uploadImg = function(req, res) {
 var fname = req.files.imgFile.path.replace("public\upload\", "").replace("public/upload/", "");
 var info = {
  "error": 0,
  "url": "/upload/"+fname
 };
 res.send(info);
}

这样就可以在kindEditor中使用图片上传和图片批量上传的功能了

查看图片

总结

以上就是这篇文章的全部内容了,希望本文的内容对大家的学习或者工作能带来一定的帮助,如果有疑问大家可以留言交流,谢谢大家对编程网的支持。

--结束END--

本文标题: node.js中实现kindEditor图片上传功能的方法教程

本文链接: https://www.lsjlt.com/news/12659.html(转载时请注明来源链接)

有问题或投稿请发送至: 邮箱/279061341@qq.com    QQ/279061341

本篇文章演示代码以及资料文档资料下载

下载Word文档到电脑,方便收藏和打印~

下载Word文档
猜你喜欢
  • node.js中实现kindEditor图片上传功能的方法教程
    前言 最近由于工作需要使用在线编辑器,找了几个对比了下KindEditor还是不错的,国产的但文档还是不全,还好能参考官方插件,kindEditor官网上中提供了ASP,ASP.NET,JSP相关的整合应用...
    99+
    2022-06-04
    图片上传 功能 方法
  • 微信小程序图片上传功能的实现方法
    目录前言首先是静态布局和样式部分下面是js的部分,我已详细备注~~~总结前言 最近做了个小程序,涉及到了图片上传的功能,今天给大家详细介绍下如何实现小程序图片上传,话不多说先上代码 ...
    99+
    2022-11-13
  • Java KindEditor粘贴图片自动上传到服务器功能怎么实现
    这篇文章主要介绍了Java KindEditor粘贴图片自动上传到服务器功能怎么实现的相关知识,内容详细易懂,操作简单快捷,具有一定借鉴价值,相信大家阅读完这篇Java KindEditor粘贴图片自动上传到服务器功能怎...
    99+
    2023-07-06
  • uniapp小程序上传图片功能的实现
    目录前言正文1、首先看官网2、案例代码演示前言 本篇文章我们研究一下,在移动端开发过程中经常使用到的图片上传功能。在大多数小程序或者APP中都会遇到一些实名认证或者头像上传的功能。u...
    99+
    2023-01-10
    uniapp小程序 上传图片 uniapp小程序 上传 uniapp上传图片
  • 微信小程序实现上传图片的功能
    本文实例为大家分享了微信小程序实现上传图片的具体代码,供大家参考,具体内容如下 效果图 WXML <view class="img-wrap"> <vie...
    99+
    2022-11-12
  • 微信小程序实现图片上传功能
    微信小程序实现图片上传功能随着移动互联网的发展,微信小程序已经成为了人们生活中不可或缺的一部分。微信小程序不仅提供了丰富的应用场景,还支持开发者自定义功能,其中包括图片上传功能。本文将介绍如何在微信小程序中实现图片上传功能,并提供具体的代码...
    99+
    2023-11-21
    微信小程序 图片上传 功能实现
  • Node.js如何实现图片上传和显示方法
    小编给大家分享一下Node.js如何实现图片上传和显示方法,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!具体如下:index.j...
    99+
    2022-10-19
  • html+css实现自定义图片上传按钮功能的方法
    小编给大家分享一下html+css实现自定义图片上传按钮功能的方法,相信大部分人都还不怎么了解,因此分享这篇文章给大家参考一下,希望大家阅读完这篇文章后大有收获,下面让我们一起去了解一下吧!普通的input[type=&lsquo;...
    99+
    2023-06-09
  • vue中实现图片和文件上传功能
    本篇文章为大家展示了vue中实现图片和文件上传功能,内容简明扼要并且容易理解,绝对能使你眼前一亮,通过这篇文章的详细介绍希望你能有所收获。html页面<input type="fi...
    99+
    2022-10-19
  • 微信小程序实现上传图片小功能
    本文实例为大家分享了微信小程序实现上传图片的具体代码,供大家参考,具体内容如下 用到的apiwx.chooseMedia(); 用于拍摄或从手机相册中选择图片或视频 功能:点击上传图...
    99+
    2022-11-13
  • uniapp上传图片和上传视频的实现方法
    目录上传图片上传视频扩展补充:上传文件实例总结基于 uniapp 的应用上传图片/视频 资源的实现: 功能涉及的主要 uniapp API 如下: 1.选择图片:uni.choose...
    99+
    2023-01-17
    uniapp上传视频文件 uniapp 上传图片 vue视频上传
  • html5中怎么实现图片上传预览功能
    今天就跟大家聊聊有关html5中怎么实现图片上传预览功能,可能很多人都不太了解,为了让大家更加了解,小编给大家总结了以下内容,希望大家根据这篇文章可以有所收获。<!DOCTYPE html&...
    99+
    2022-10-19
  • 微信小程序图片上传功能怎么实现
    这篇文章主要介绍“微信小程序图片上传功能怎么实现”,在日常操作中,相信很多人在微信小程序图片上传功能怎么实现问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”微信小程序图片上传功能怎么实现”的疑惑有所帮助!接下来...
    99+
    2023-06-30
  • Golang实现图片上传功能的示例代码
    目录1.前端代码2.JS代码3.后端代码该代码为使用beego实现前后端图片上传。话不多说,直接上代码。 1.前端代码 html代码: <div class="col-5 f...
    99+
    2022-11-13
  • Springboot实现图片上传功能的示例代码
    首先对图片进行UUID 防止图片被覆盖以及爬图 UUID的生成规则:日期时间,MAC地址,HashCode,随机数(多种之一) 开发上传接口,两处红字意思是生成文件夹和生成目标文件,...
    99+
    2022-11-13
  • Android编程实现图片的上传和下载功能示例
    本文实例讲述了Android编程实现图片的上传和下载功能。分享给大家供大家参考,具体如下: 在实现一个Android的WEB服务客户端,比如微博,论坛客户端时,经常会使用到图片...
    99+
    2022-06-06
    示例 图片 Android
  • Android中怎么实现图片压缩与上传功能
    Android中怎么实现图片压缩与上传功能,很多新手对此不是很清楚,为了帮助大家解决这个难题,下面小编将为大家详细讲解,有这方面需求的人可以来学习下,希望你能有所收获。首先需要对图片进行压缩,这方面可以使用第三方的库,我在实际的开发中使用的...
    99+
    2023-05-30
    android
  • 微信小程序实现图片裁剪并上传功能
    微信小程序实现图片裁剪并上传功能随着微信小程序的快速发展,越来越多的开发者开始关注微信小程序的开发技巧和功能实现。其中,图片裁剪并上传功能是一个常见的需求,本文将介绍如何在微信小程序中实现图片裁剪并上传的功能,并提供具体的代码示例。一、功能...
    99+
    2023-11-21
    微信 小程序 图片裁剪 上传
  • 自己动手打造ajax图片上传的方法教程
    这篇文章主要介绍“自己动手打造ajax图片上传的方法教程”,在日常操作中,相信很多人在自己动手打造ajax图片上传的方法教程问题上存在疑惑,小编查阅了各式资料,整理出简单好用的操作方法,希望对大家解答”自己...
    99+
    2022-10-19
  • 如何使用express+multer实现node中的图片上传功能
    小编给大家分享一下如何使用express+multer实现node中的图片上传功能,希望大家阅读完这篇文章之后都有所收获,下面让我们一起去探讨吧!具体内容介绍如下所示:在前端中,我们使用ajax来异步上传图...
    99+
    2022-10-19
软考高级职称资格查询
编程网,编程工程师的家园,是目前国内优秀的开源技术社区之一,形成了由开源软件库、代码分享、资讯、协作翻译、讨论区和博客等几大频道内容,为IT开发者提供了一个发现、使用、并交流开源技术的平台。
  • 官方手机版

  • 微信公众号

  • 商务合作