溫馨提示×

溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務條款》

利用ssm框架如何實現(xiàn)將上傳的圖片保存到本地數(shù)據(jù)庫中

發(fā)布時間：2020-11-11 16:24:10 來源：億速云 閱讀：283 作者：Leah 欄目：編程語言

今天就跟大家聊聊有關(guān)利用ssm框架如何實現(xiàn)將上傳的圖片保存到本地數(shù)據(jù)庫中，可能很多人都不太了解，為了讓大家更加了解，小編給大家總結(jié)了以下內(nèi)容，希望大家根據(jù)這篇文章可以有所收獲。

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('網(wǎng)絡故障'); 
 
      } 
 
    }); 
 
  } 
</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){ 
//   自定義返回前臺數(shù)據(jù)格式 
    ConsoleResult res = new ConsoleResult(); 
//   去掉base64數(shù)據(jù)頭部data:image/png;base64,和尾部的” " “ 
    String[] ww= base64.split(","); 
    base64 = ww[1]; 
    String[] aa = base64.split("\""); 
    base64 = aa[0]; 
    try { 
//     將圖片插入數(shù)據(jù)庫 
      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>

看完上述內(nèi)容，你們對利用ssm框架如何實現(xiàn)將上傳的圖片保存到本地數(shù)據(jù)庫中有進一步的了解嗎？如果還想了解更多知識或者相關(guān)內(nèi)容，請關(guān)注億速云行業(yè)資訊頻道，感謝大家的支持。

向AI問一下細節(jié)

免責聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點不代表本網(wǎng)站立場，如果涉及侵權(quán)請聯(lián)系站長郵箱：is@yisu.com進行舉報，并提供相關(guān)證據(jù)，一經(jīng)查實，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手