Spring boot Controler参数解释,VUE调用POST、GET各种参数写法实现,记录一下方便后面使用

总体情况

        最近在为新的用户中心迁移新的前端,架构方面已定好,前使用VUE,但是后台不变,我负责前端的一小部分,在下载附件这块遇到不少的问题,本来后端接口标准写法是没有问题的,但是以前的项目每个开发的人员都不太一样,所以会遇到各种问题,这里都一一解决,并通过实践上一个通用的写法。

后端

1、注解说明

这里要特别注意添加ResponseBody和不添加的区别。

添加了:Spring MVC将会处理方法的返回值,并使用合适的HttpMessageConverter将返回值写入输出流。这通常用于返回JSON或XML等数据格式。

不添加:表示返回的是页面,所以在浏览器上会返回404,是因为找不到页面。所以如果是前后端分离的话,基本上都是要加的。

@GetMapping("/parametertestone")//声明是get
    @ResponseBody//Spring MVC将会处理方法的返回值,并使用合适的HttpMessageConverter将返回值写入输出流。这通常用于返回JSON或XML等数据格式。
    public String  parameterTestOne(
            //
            @RequestParam(name="number") String number,
            String name) {
        return number + " goodluck";
    }

下面是带说明的详细代码:

package com.springstudy.controller;

import java.io.OutputStream;
import java.util.HashMap;
import java.util.Map;

import javax.servlet.http.HttpServletResponse;

import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.data.redis.core.RedisTemplate;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestBody;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestParam;
import org.springframework.web.bind.annotation.ResponseBody;

import com.springstudy.domain.User;
import com.springstudy.service.IExcelService;

@Controller//标识是
@RequestMapping("/exceldemo")//整体标识
public class ExcelDemoController {
	
	//解决一些问题
	private final IExcelService excelService;
	
	public ExcelDemoController(IExcelService excelService) {
		this.excelService = excelService;
	}

	@PostMapping("/downloadexcel")
	public void downloadExcel(HttpServletResponse response,@RequestBody User user) {

		byte[] excelBytes = excelService.downloadExcelDemo(user);
		OutputStream out = null;
		try {
			response.setContentType("application/vnd.ms-excel;");
			response.setCharacterEncoding("UTF-8");
			response.setHeader("Content-Disposition", "inline");
            response.setHeader("myfilename", "excelDownloadDemo.xlsx");
            response.setHeader("flag", "1");
			out = response.getOutputStream();
			out.write(excelBytes);
		} catch (Exception e) {
			//e.printStackTrace();
		}finally {
			try {
				if(out!=null) out.close();
			} catch (Exception e) {
				//e.printStackTrace();
				//logger.error("print price error 6 : {}",e);
			}
		}
	}
	
	// localhost:8089/myspringdemo/exceldemo/parametertestone
	@GetMapping("/parametertestone")//声明是get
	@ResponseBody//Spring MVC将会处理方法的返回值,并使用合适的HttpMessageConverter将返回值写入输出流。这通常用于返回JSON或XML等数据格式。
	public String  parameterTestOne(
			//name和value的效果一样.required默认为true,如果不是必须输入的则可设置为false
			@RequestParam(name="number",required=false) String number,
			String name) {
		return number + " goodluck";
	}
	
	@PostMapping("/parametertesttwo")//声明是Post
	@ResponseBody
	public String  parameterTestTwo(@RequestParam(name="number") String number) {
		return number + " goodluck";
	}
	
	@PostMapping("/parametertestthree")
	@ResponseBody
	public String  parameterTestThree(@RequestBody User user) {
		return " goodluck";
	}


}

前端代码:

downlaodExcel: function() {
      
      var _this = this;
      this.$message({
          showClose: true,
          message: 'Hello World!',
          type: 'info'
        });

      var user = {
          "aid": 1
        };

        this.$axios.post("/exceldemo/downloadexcel",user,{responseType: 'arraybuffer'}).then((res)=>{
          
            //let ct = res.ContentType;
            console.log(res);
            var fileName = res.headers['myfilename'];
            var contenttype = res.headers['content-type'];
            
            console.log(fileName);
            const blob = new Blob([res.data],{
              type: contenttype
            });
            var body = document.getElementsByTagName('body')[0];
            const a = document.createElement('a');
            a.download = fileName;
            a.href = URL.createObjectURL(blob); //创建连接
            body.appendChild(a); //添加a标签
            a.click();
            body.removeChild(a); //移除a标签
            URL.revokeObjectURL(a.href); //关闭连接

        }).catch(() => {
                  _this.$message({
                  type: 'info',
                   message: 'CheckOut Cancel1'
                    });
              });
    },
parameterTest: function() {

      this.$axios.get("/exceldemo/parametertestone" + "?number=gl").then((res)=>{
          
            this.$message({
                  type: 'info',
                   message: res.data
                    });

        }).catch(() => {
                  this.$message({
                  type: 'info',
                   message: 'CheckOut Cancel1'
                    });
          });
          
      
      let data = {
        number : "glkk"
      };
      this.$axios.post("/exceldemo/parametertesttwo?number=kkk" ).then((res)=>{
          
            this.$message({
                  type: 'info',
                   message: res.data
                    });

        }).catch(() => {
                  this.$message({
                  type: 'info',
                   message: 'CheckOut Cancel1'
                    });
          });

      let user = {
        anumber : "glkk"
      };
      this.$axios.post("/exceldemo/parametertestthree",user ).then((res)=>{
          
            this.$message({
                  type: 'info',
                   message: res.data
                    });

        }).catch(() => {
                  this.$message({
                  type: 'info',
                   message: 'CheckOut Cancel1'
                    });
          });

    }

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值