vue圖片獲取與展示


后端代碼
@ApiOperation(value = "返回圖片流") @RequestMapping(value = "/baseinfo") public void infoHe(HttpServletResponse response) { InputStream in = null; try{ //從minio文件服務器上獲取圖片流 in = minioClient.getObject(bucketName, "company/template_back_20200627160552.png"); response.setContentType("image/png"); OutputStream out = response.getOutputStream(); byte[] buff = new byte[100]; int rc = 0; while ((rc = in.read(buff, 0, 100)) > 0) { out.write(buff, 0, rc); } out.flush(); } catch (Exception e) { log.error(e.getMessage(), e); PropertiesConfig.globalResponse(ResultCode.FAILED); // return ResponseResult.success(); }finally { } }

前端代碼
axios.request({ url: 'file/baseinfo', responseType: 'blob', method: 'post', params:{ fileName:fileName } }).then(res => { let blob = new Blob([res.data],{type: "image/png"}); let url = window.URL.createObjectURL(blob); this.imgSrc=url; }), (error) => { this.$message({ type: 'warning', message: '系統錯誤,請聯系管理員!' }); }

 


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM