web_10&SmartUpload插件文件上传&富文本编辑器ckeditor

七野..

已于 2022-04-10 22:23:49 修改

阅读量120

点赞数

文章标签： web java

于 2022-04-10 22:22:20 首次发布

本文链接：https://blog.csdn.net/m0_64719055/article/details/124087315

版权

本文介绍了如何使用SmartUpload插件进行文件上传操作，包括环境配置、表单设置、上传规则定义及文件保存到服务器硬盘。同时，讲解了CKEditor的使用步骤，展示如何在网页中集成富文本编辑器，提升用户体验。

摘要由CSDN通过智能技术生成

1.SmartUpload插件

   文件路径保存到数据库中，而把文件上传到服务器【tomcat】的硬盘中。

[使用步骤]
①环境准备：使用SmartUpload组价需要在项目中引入jspsmartupload.jar文件
   --将jspsmartupload.jar添加到web-inf\lib目录下

②需要设置表单的enctype属性--设置enctype属性后表单必须以post方式提交。
   --<form enctype = "multipart/form-data" method = "post">

③jsp smartupload.jar包中的File类
   --封装了单个上传文件所包含的所有信息
   saveAS() | isMissing() | getFieldName() | getFileName()

----------------------------------------------------------------------------------------------------------------
案例：文件上传
<form action = "doAddFile.jsp" enctype="multipart/form-data" method = "post">
        <input type = "file" name = "file"/>
        <input type = "submit" value = "上传"/>    
</form>

<!-- 
    	1.设置编码格式
    	2.实例化SmartUpload对象
    	3.初始化该对象
    	4.定义好上传的规则（允许上传  不允许上传的    限制文件大小）
    	5.调用upload方法上传文件至web服务器内存中
    	6.获取到选中文件的路径
    	7.将web服务内存中的文件保存在指定的路径下
     -->
     <%
     	// 1.设置编码格式
     	request.setCharacterEncoding("utf-8");
     	response.setCharacterEncoding("utf-8");
    	// 2.实例化SmartUpload对象
    	SmartUpload su = new SmartUpload();
    	// 3.初始化该对象  pageContext属于九大内置对象之一 作用域仅限于当前压力
    	su.initialize(pageContext);
    	// 4.定义好上传的规则（允许上传  不允许上传的    限制文件大小）
    	su.setAllowedFilesList("jpg,png,gif,txt");//允许上传
    	su.setDeniedFilesList("exe,jsp,js,bat");//禁止上传
    	su.setMaxFileSize(1024*1024*2);//文件大小
    	su.setCharset("utf-8");//设置编码
    	// 5.调用upload方法上传文件至web服务器内存中
    	su.upload();
    	// 6.获取到选中文件的路径
    	/*
    	String path = "upload\\";
    	File file = su.getFiles().getFile(0);//得到第一个上传的文件
    	if(!file.isMissing()){//用户选择了文件的情况下
    		//file.setCharset("utf-8");
    		//拼接上文件名
    		path+=file.getFileName();
    		//保存在硬盘上
    		file.saveAs(path,SmartUpload.SAVE_VIRTUAL);
    	}
    	
    	out.print("文件路径: "+path);
    	*/
    	
    	//--------------------------------------------------------------
    	//②手动找到根目录
	 	String webPath = this.getServletContext().getRealPath("/");
	 	String path = webPath+"upload\\";
	 	File file = su.getFiles().getFile(0);
	 	if(!file.isMissing()){
	 		file.setCharset("utf-8");
	 		path+=file.getFileName();
	 		file.saveAs(path);//完整目录
	 	}
	 	//把path保存到数据库里的nfilePath
	 	out.print(path+"<br/>");
    	
	 	
	 	Request req = su.getRequest();
	 	String username = req.getParameter("username");
	 	out.print("<br/>"+username);
     %>

2.富文本编辑器ckeditor

CKeditor的使用步骤

   [步骤1] 官网https://ckeditor.com/ 下载-解压-引入
   [步骤2]
   <script type="text/javascript" src = "../ckeditor/ckeditor.js"></script>
   <script type="text/javascript">
       CKEDITOR.replace("ncontent");
   </script>