百度编辑器 配置如何上传图片

简介:

1.准备工作 

    下载地址  http://ueditor.baidu.com/website/  

    下载出来 你所需要的udditor版本

2.解压出来

3.导包 解压出来文件jsp下的lib导入  到项目中web-inif 下的lib中

    注意: 如果导入包仍然报 inser... server  ... 这种错误,把包导入 服务器 lib下

4.修改配置文件

 ueditor.config.js 

window.UEDITOR_HOME_URL = "/default/eos/";

从注释中取消 ,default是项目名称  eos是udditor存放的文件目录

如图wKiom1kmSJHhT_66AAEJ5LZxPsE996.png-wh_50

5.修改jsp下 config.json

"imageUrlPrefix": "http://localhost:8989/default",wKiom1kmSPLxK2ysAAGQj1GzWwE923.png-wh_50

注:如果想修改上传图片存放的路径

    修改下面

wKiom1kmSTeDMlZGAAFLjIXmpNw151.png-wh_50

6.测试页面 

<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>

<%

String path = request.getContextPath();

String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";

%>


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">

<html>

  <head>

   <script type="text/javascript" charset="utf-8" src="ueditor.config.js"></script>

    <script type="text/javascript" charset="utf-8" src="ueditor.all.min.js"> </script>

   <link rel="stylesheet" href="themes/default/css/ueditor.css">

</head>

  

<body>

<div align="center">

<textarea id="newsEditor" name="content">百度编辑器</textarea>

<br/>

<input type="submit" value="提交">

<script type="text/javascript">

var editor = new baidu.editor.ui.Editor();

editor.render("newsEditor");

</script>

</div>


  </body>

</html>

 

注意:过程如果报 资源错误,是jar包导入错了

 如果是路径不统一,是上面配置的路径问题有误


本文转自12691034博客51CTO博客,原文链接http://blog.51cto.com/12701034/1929261如需转载请自行联系原作者

笑容掩饰爱
相关文章
|
6月前
|
开发框架 JavaScript 前端开发
百度富文本编辑器配置(vue3)
百度富文本编辑器配置(vue3)
|
4月前
|
JSON JavaScript 数据格式
文本-----wangEditor的使用,设置和获取内容,展示HTML无样式怎么办????console同步展示怎样写,Vue的配置在Vue3配置文件中的配置,是editor中的v-model绑定的值
文本-----wangEditor的使用,设置和获取内容,展示HTML无样式怎么办????console同步展示怎样写,Vue的配置在Vue3配置文件中的配置,是editor中的v-model绑定的值
|
4月前
|
网络协议 Linux 开发工具
配置Linux固定IP地址,为什么要固定IP,因为他是通DHCP服务获取的,DHCP服务每次重启都会重新获取一次ip,VMware编辑中有一个虚拟网络编辑器
配置Linux固定IP地址,为什么要固定IP,因为他是通DHCP服务获取的,DHCP服务每次重启都会重新获取一次ip,VMware编辑中有一个虚拟网络编辑器
|
6月前
|
前端开发 数据可视化 API
前端react 18.2整合ckeditor富文本编辑器——配置插件、自定义toolbar工具栏(二)
前端react 18.2整合ckeditor富文本编辑器——配置插件、自定义toolbar工具栏
420 0
前端react 18.2整合ckeditor富文本编辑器——配置插件、自定义toolbar工具栏(二)
|
6月前
|
Unix Shell Linux
在 Linux 上把 Vim 配置为默认编辑器
在 Linux 上把 Vim 配置为默认编辑器
|
6月前
|
前端开发 JavaScript CDN
前端react 18.2整合ckeditor富文本编辑器——配置插件、自定义toolbar工具栏(一)
前端react 18.2整合ckeditor富文本编辑器——配置插件、自定义toolbar工具栏
221 0
|
6月前
|
Linux 开发工具 C++
Linux编辑器vim(含vim的配置)
Linux编辑器vim(含vim的配置)
88 0
|
6月前
|
存储 Linux 编译器
vim编辑器和gcc/g++编辑器的使用讲解
vim编辑器和gcc/g++编辑器的使用讲解
154 2
|
4月前
|
开发工具
vi编辑器,现在vi\vim是文本文件进行编辑的最佳选择,Vim是vi的加强的版本,兼容vi的所有指令,vim编辑器有三种工作模式,一开始进入的是命令模式,命令模式i是插入的意思,两下y+p复制内容
vi编辑器,现在vi\vim是文本文件进行编辑的最佳选择,Vim是vi的加强的版本,兼容vi的所有指令,vim编辑器有三种工作模式,一开始进入的是命令模式,命令模式i是插入的意思,两下y+p复制内容
|
5月前
|
开发工具
Vim 编辑器:高效文本编辑的瑞士军刀
**Vim 概览:** Vim 是一个功能丰富的文本编辑器,以其高度可定制性著称。文章介绍了 Vim 的高效使用技巧,包括快捷打开文件、命令行模式下的常用命令、查找与替换、删除和复制文本。还讨论了配置 `.vimrc` 文件以自定义设置,如改变 leader 键、设置缩进和高亮,并展示了安装插件如 vim-airline 和 vim-snazzy 的方法。通过这些技巧,用户能提升 Vim 使用效率。
68 5