vue 前端传图片文件，后端接收

た入场券 2022-02-04 01:09 1125阅读 0赞

--------------------

### **vue端** ###

1、在 main.js 文件中添加

const upload = axios.create({
      //这里配置你自己的url
      baseURL: 'http://localhost:8096/reconciliation/',
      timeout: 50000,
    });
    Vue.prototype.$upload = upload;

2、在需要上传文件的vue文件中

uploadImg(file){
        var _this = this;
        var formData = new FormData();
        formData.append("file", file.raw);
        _this.$upload.post("file/upload", formData)
        	.then(res => {
    		    _this.$message(res.data.userInfo, 'success');
    	    }).catch(data=>{
    		    console.log(data);
    	    })
    }

3、在后台controller中

@RestController
    @RequestMapping("file")
    public class FileDataController {
        @RequestMapping(value = "/upload", method = RequestMethod.POST)
        public String handleFileUpload(@RequestParam("file") MultipartFile file) throws IOException {
            // 将图片转为base64
            BASE64Encoder encoder = new BASE64Encoder();
            String imgData = encoder.encode(file.getBytes());
            String url = null;
            //这里要进行的图片操作
            return url1;
        }
    }

发表评论取消回复

表情：

评论列表（有 0 条评论，1125人围观）

还没有评论，来说两句吧...

相关阅读

相关 springboot后端接收前端传数组参数方法

1:：前端传数组参数用ids,不要用ids\[\],因为是传数组会自动加上\[\] @ApiOperation(value = "批量删除", notes = "

落日映苍穹つ/ 2024年03月27日 15:55/ 0 赞/ 90 阅读

相关文件上传--前端Vue后端springboot

前端调用： <template> <div> <el-upload class="upload-demo"

朴灿烈づ我的快乐病毒、/ 2024年03月22日 13:11/ 0 赞/ 96 阅读

相关前端给后端发送数据，后端接收

在具体的前后端分离项目中，我们经常会遇到点击表格中的某一行的按钮，获取这一行的某一项值的需求，前端点击拿到这个值，再传给后端使用例如：在此例中点击同步的按钮，需要获取到表格

╰半橙微兮°/ 2023年10月02日 23:47/ 0 赞/ 45 阅读

相关 java后端接收map参数vue前端传递

1、vue前端 export default { name: 'downcardlist', data() {

野性酷女/ 2023年09月30日 10:24/ 0 赞/ 44 阅读

相关 Vue前端接收后端返回的图片、验证码图片

[https://blog.csdn.net/qq\_43477721/article/details/106100824][https_blog.csdn.net_qq_43

柔光的暖阳◎/ 2022年11月11日 05:16/ 0 赞/ 208 阅读

相关 html里传输文件到后端,前端js上传文件到后端接收文件

packagecom.zj.sample;importjava.io.File;importjava.io.IOException;importjava.util.Iterat

超、凢脫俗/ 2022年10月06日 11:48/ 0 赞/ 303 阅读

相关 JAVA springMVC前端传参到后端和接收

例子一： var bean=new Object();//对象 bean.clientName='你好'; bean.st

╰+攻爆jí腚メ/ 2022年06月17日 06:43/ 0 赞/ 301 阅读

相关 SpringMVC前端传json后端用对象接收,后端传json给前端

ResponseBody和RequestBody @ResponseBody把后台pojo转换成json对象 @RequestBody接收前台json数据,把json数

浅浅的花香味﹌/ 2022年03月31日 11:18/ 0 赞/ 447 阅读

相关 vue 前端传图片文件，后端接收

-------------------- vue端 1、在 main.js 文件中添加 const upload = axios.create({

た入场券/ 2022年02月04日 01:09/ 0 赞/ 1126 阅读

相关 java后端导出excel文件流，前端vue接收下载

1.后端excel导出工具类主要依赖  <dependency>

港控/mmm°/ 2021年09月03日 09:09/ 0 赞/ 1062 阅读