当前位置: 首页 > 编程笔记 >

ssm框架上传图片保存到本地和数据库示例

艾照
2023-03-14
本文向大家介绍ssm框架上传图片保存到本地和数据库示例,包括了ssm框架上传图片保存到本地和数据库示例的使用技巧和注意事项,需要的朋友参考一下

本文介绍了ssm框架上传图片保存到本地和数据库示例,主要使用了Spring+SpringMVC+MyBatis框架,实现了ssm框架上传图片的实例,具体如下:

1、前台部分

<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%> 
<!DOCTYPE html> 
<html> 
<head> 
  <meta charset="UTF-8"> 
  <title>Title</title> 
  <script src="resources/jquery/jquery-3.0.0.js"></script> 
</head> 
<body> 
<img id="image"src=""/> 
<br/> 
<input type="file"onchange="selectImage(this);"/> 
<br/> 
<input type="button"onclick="uploadImage();"value="提交"/> 
<script> 
  var image = ''; 
  function selectImage(file){ 
    if(!file.files || !file.files[0]){ 
      return; 
    } 
    var reader = new FileReader(); 
    reader.onload = function(evt){ 
      document.getElementById('image').src = evt.target.result; 
      image = evt.target.result; 
    } 
    reader.readAsDataURL(file.files[0]); 
  } 
  function uploadImage(){ 
    image = JSON.stringify(image) 
    $.ajax({ 
 
      type:'POST', 
 
      url: '/blog/test', 
 
      data: {base64: image 
      }, 
 
      async: false, 
 
      dataType: 'json', 
 
      success: function(data){ 
alert(data.success) 
        if(data.success){ 
 
          alert('上传成功'); 
 
        }else{ 
 
          alert('上传失败'); 
 
        } 
 
      }, 
 
      error: function(err){ 
 
        alert('网络故障'); 
 
      } 
 
    }); 
 
  } 
</script> 
<script src="jquery-1.11.1.min.js"></script> 
</body> 
</html> 

2、controller

@Inject 
  private IUserService userService; 
  @RequestMapping(value="test") 
  @ResponseBody 
  public ConsoleResult test(String base64){ 
//   自定义返回前台数据格式 
    ConsoleResult res = new ConsoleResult(); 
//   去掉base64数据头部data:image/png;base64,和尾部的” " “ 
    String[] ww= base64.split(","); 
    base64 = ww[1]; 
    String[] aa = base64.split("\""); 
    base64 = aa[0]; 
    try { 
//     将图片插入数据库 
      userService.base64test(base64); 
//     图片保存到本地 
      String path = "D:/asdfasdf.jpg"; 
      Base64File file = new Base64File(); 
      file.decoderBase64File(base64, path); 
//     成功标识 
      res.setStatus(ConsoleResult.successStatus); 
    } catch (Exception e) { 
      res.setStatus(ConsoleResult.faultStatus); 
    } 
    return res; 
  } 

3、base64

/** 
   * 将base64字符解码保存文件 
   * 
   * @param base64Code 
   * @param targetPath 
   * @throws Exception 
   */ 
 
  public static void decoderBase64File(String base64Code, String targetPath) { 
    byte[] buffer; 
    FileOutputStream out = null; 
    try { 
      buffer = new BASE64Decoder().decodeBuffer(base64Code); 
      out = new FileOutputStream(targetPath); 
      out.write(buffer); 
    } catch (IOException e) { 
      e.printStackTrace(); 
    } finally { 
      try { 
        if (out != null) { 
          out.close(); 
        } 
      } catch (IOException e) { 
        e.printStackTrace(); 
      } 
    } 
  } 

4、mapper.xml

<update id="base64Test" parameterType="String"> 
  update t_user set U_ABOUT = #{base64} where u_name = '971171444' 
 </update> 

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持小牛知识库。

 类似资料:
  • 本文向大家介绍php实现上传图片保存到数据库的方法,包括了php实现上传图片保存到数据库的方法的使用技巧和注意事项,需要的朋友参考一下 php实现上传图片保存到数据库的方法。分享给大家供大家参考。具体分析如下: php 上传图片,一般都使用move_uploaded_file方法保存在服务器上。但如果一个网站有多台服务器,就需要把图片发布到所有的服务器上才能正常使用(使用图片服务器的除外) 如果把

  • 问题内容: 我想将图像的下载URL放入Firebase数据库中。我可以将图像上传到存储中,但无法弄清楚如何将URL与其余的“帖子”一起放入数据库。 问题答案: 像这样组织您和func: 接下来,只需连接并保存到您的节点即可。 您也可以查看我有关上传数据并将URL保存到数据库的答案 希望能帮助到你

  • 本文向大家介绍SSM框架+Plupload实现分块上传大文件示例,包括了SSM框架+Plupload实现分块上传大文件示例的使用技巧和注意事项,需要的朋友参考一下 关于Plupload的介绍,相信它的官网http://www.plupload.com/已经给得很详细了。Plupload的上传原理简单点说,就是将用户选中的文件(可多个)分隔成一个个小块,依次向服务器上传,这是它能驾驭上传大文件的原因

  • 本文向大家介绍SpringMVC框架实现上传图片的示例代码,包括了SpringMVC框架实现上传图片的示例代码的使用技巧和注意事项,需要的朋友参考一下 一.创建图片虚拟目录 在上传图片之前,先要设置虚拟目录(以IDEA为例) 打开工具栏的运行配置Edit Configurations 添加物理目录和并设置虚拟目录路径 添加img图片在img文件夹内 测试访问:http://localhost:80

  • 本文向大家介绍iOS archive保存图片到本地的方法,包括了iOS archive保存图片到本地的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例为大家分享了iOS保存图片到本地的具体代码,供大家参考,具体内容如下 一、工程图 二、代码 RootViewController.h RootViewController.m 以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持

  • element plus上传本地图片显示404 我试过后端路由更改没有效果