SpringMVC框架五:图片上传与JSON交互

在正式图片上传之前,先处理一个细节问题:

每一次发布项目,Tomcat都会重新解压war包,之前上传过的图片会丢失

为了解决这个问题:可以不在Tomcat下保存图片,而是另找一个目录。

上传图片:

<form method="post" enctype="multipart/form-data">
   <input type="file" name="pictureFile">
</form>

在上传图片之前,需要在springMVC.xml中配置:

    <!-- 上传图片配置实现类 -->
    <bean id="multipartResolver"
        class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
        <!-- 上传图片的大小(单位:字节)-->
        <property name="maxUploadSize" value="5000000" />
    </bean>

注意:这个id不能改成其他的,否则无效

除了上传文件大小以外,还有其他几个参数,这里就不一一展示了

保存图片到F:/upload:

    @RequestMapping(value = "/upload")
    public ModelAndView upload(MultipartFile pictureFile) {
        // 保存图片

        // 防止重复,给图片id设为UUID
        String id = UUID.randomUUID().toString().replace("-", "");

        String exName = FilenameUtils.getExtension(pictureFile.getOriginalFilename());

        String name = id+"."+exName;

        try {
            pictureFile.transferTo(new File("F:\\upload\\" + name));
        } catch (Exception e) {
            e.printStackTrace();
        }

        //保存ID到数据库
        //userService.savePicture(id);

        ModelAndView mav = new ModelAndView();
        mav.setViewName("success");
        return mav;
    }

为了方便获得文件扩展名,这里用了其他的包,如果自己写稍显麻烦:

JSON交互:

首先要导入JSON需要的包:

前端AJAX:

<script type="text/javascript">
$(function(){
    var params = ‘{"id": 1,"name": "测试商品","price": 99.9,"detail": "测试商品描述","pic": "123456.jpg"}‘;
    $.ajax({
        url : "${pageContext.request.contextPath }/json.action",
        data : params,
        contentType : "application/json;charset=UTF-8",
        type : "post",
        dataType : "json",
        success : function(data){
            alert(data.name);
        }
    });
});
</script>

Controller:

    //json交互
    @RequestMapping(value = "/json.action")
    public @ResponseBody
    Items json(@RequestBody Items items) {
        //RequestBody注解,可以将json字符串解析到Items对象中
        //注意:Items的属性名必须和json的Key一致
        System.out.println(items);

        Items responseItem = new Items();
        items.setName("success");
        //ReponseBody注解:自动将对象封装成JSON字符串返回

        return responseItem;
    }

原文地址:https://www.cnblogs.com/xuyiqing/p/9441657.html

时间: 2024-08-05 11:51:23

SpringMVC框架五:图片上传与JSON交互的相关文章

springmvc图片上传、json

springmvc的图片上传 1.导入相应的pom依赖 <dependency> <groupId>commons-fileupload</groupId> <artifactId>commons-fileupload</artifactId> <version>1.3.3</version> </dependency> 2.添加springmvc-servlet.xml里面的配置 <bean id=&q

基于nodeJs express 框架的图片上传和编辑(引用美图编辑工具)上传小示例

唉,由于近期工作中对于新知识的运用相对较少,也导致小码哥少有更新鄙人心得的机会.还望路过的基友们不要抱怨,勿喷,,,,, 本篇文章,是基于NodeJs Express框架完成的一个用于项目中图片上传和编辑上传的小示例,当然,由于项目工期不禁,都是在非工作时间慢慢完成的,导致至今该图片上传功能也未能插入项目中真正的验证最终效果.不过就小码哥感觉,基本思路及基本功能算是完成了. 下面便由小码哥来给基友们稍微讲解改功能的实现过程及其中用到的一些技术等等. 首先,说说NodeJs Express框架的搭

ssm框架实现图片上传显示并保存地址到数据库

本案例是通过springmvc+spring+mybatis框架以商品上传为例,实现的图片上传功能,并把图片的地址保存到数据库并在前台显示上传的图片. 本项目是使用maven搭建的项目,首先看下项目结构 相关配置自行搜索,下边直接实现上传功能 1.创建数据库 DROP TABLE IF EXISTS `product`; CREATE TABLE `product` ( `pid` int(11) NOT NULL AUTO_INCREMENT, `pimage` varchar(255) DE

springMVC和ckeditor图片上传

1.下载ckeditor后将文件夹放在webroot的js目录下: 2.springmvc配置静态文件访问 在web.xml中添加: <servlet-mapping> <servlet-name>default</servlet-name> <url-pattern>*.css</url-pattern> </servlet-mapping> <servlet-mapping> <servlet-name>d

SpringMvc入门五----文件上传

? 知识点: SpringMvc单文件上传 SpringMvc多文件上传 ? 这里我直接演示多文件上传,单文件的上传就不说了,不过代码都是现成的. 效果预览: ? DEMO图: ? ? 添加文件上传jar包: Web.xml配置文件:添加spring Servlet ????<servlet> ????????<servlet-name>springmvc</servlet-name> ????????<servlet-class>org.springfra

SpringMVC框架简单实现上传Excel文件,并将Excel中的数据导入mySQL数据库

第一步 配置DispathcherServlet文件 第二步 配置applicationContext文件 第三步 在index.jsp中 第四步 在HelloSpringmvc.java中写入方法 第五步:与数据库进行连接 第六步 mySQL实体类 第七步 操作excel表 第八步 Dao文件 第九步 测试

springMVC框架下——通用接口之图片上传接口

我所想要的图片上传接口是指服务器端在完成图片上传后,返回一个可访问的图片地址. spring mvc框架下图片上传非常简单,如下 1 @RequestMapping(value="/uploadImg", method=RequestMethod.POST) 2 @ResponseBody 3 public String uploadImg(@RequestParam(value="img")MultipartFile img){ 4 File f = new Fi

百度UEditor图片上传、SpringMVC、Freemarker、Tomcat、Nginx、静态资源

个人官网.公司项目都需要 可视化编辑器,百度UEditor做得很不错,就用的这个.项目后台用到了SpringMVC.Freemarker,开发过程中部署在Jetty,线上部署用Tomcat,最后可能配置Nginx代理.     在实际使用过程中,遇到了太多的问题,因此有必要梳理和总结下. 1. 先说百度UEditor在Java环境中的使用:1.1   Html页面或者Freemarker模版里,引入百度UEditor的相关JS和CSS,如下 <script type="text/javas

springmvc上传图片并显示图片--支持多图片上传

实现上传图片功能在Springmvc中很好实现.现在我将会展现完整例子. 开始需要在pom.xml加入几个jar,分别是: [java] view plain copy <dependency> <groupId>commons-fileupload</groupId> <artifactId>commons-fileupload</artifactId> <version>1.3.1</version> </dep