Ajax的三種傳值方式\文件上傳\

本文轉載自查看原文 2018-03-22 18:21 1219

Spring mvc的ajax驗證，處理json請求

前台提交傳遞單個值

function checkName() {
    $.ajax({
        type: "POST",
        url: "${pageContext.request.contextPath }/user/checkName.action",
        dataType: "json",
        data : {
            "name" : $("#name").val()
        },
        success: function(result){
            if(result.flag>0){
                $("#name").focus();
                $("#msg").html(result.msg);
            }else{
                $("#msg").html("");
            }
        }
    });
}

傳遞多個值

前台

alert($("#loginForm").serialize());數據格式不是json格式，是key=value

function checkName() {

    $.ajax({
        type: "POST",
        url: "${pageContext.request.contextPath }/user/checkName.action",
        dataType: "json",
        data: $("#loginForm").serialize(),
        success: function(result){
            if(result.flag>0){
                $("#name").focus();
                $("#msg").html(result.msg);
            }else{
                $("#msg").html("");
            }
        }
    });
}

@RequestMapping(value = "/checkName")
public @ResponseBody Result checkName(User user, HttpServletRequest request){
    Result result = new Result();
    if(user.getName().equals("wyg")||user.getName().equals("jinc")){
        result.setFlag(1);
        result.setMsg("該用戶已經注冊");
    }else{
        result.setFlag(0);
    }
    return result;
}

以json方式傳遞多個數據

前台序列化成json格式

function checkName() {
    alert(JSON.stringify($('#loginForm').serializeJSON()));
    $.ajax({
        type: "POST",
        url: "${pageContext.request.contextPath }/user/checkName.action",
        contentType:'application/json;charset=utf-8',
        data:JSON.stringify($('#loginForm').serializeJSON()),//json串
        success: function(result){
            if(result.flag>0){
                $("#name").focus();
                $("#msg").html(result.msg);
            }else{
                $("#msg").html("");
            }
        }
    });
}

后台
@RequestMapping(value = "/checkName")
public @ResponseBody Result checkName(@RequestBody User user, HttpServletRequest request){
    Result result = new Result();
    if(user.getName().equals("wyg")||user.getName().equals("jinc")){
        result.setFlag(1);
        result.setMsg("該用戶已經注冊");
    }else{
        result.setFlag(0);
    }
    return result;
}

Json字符串和對象互換

var msg = JSON.stringify($('#loginForm').serializeJSON());
var obj = JSON.parse(msg);
alert(obj.name);
var msg1 = JSON.stringify(obj);
alert(msg1);

Spring mvc的文件上傳

RequestParam：映射請求參數類型

Maven工程pom文件添加commons-fileupload依賴包

<dependency>
  <groupId>org.apache.commons</groupId>
  <artifactId>commons-lang3</artifactId>
  <version>${commons-lang3.version}</version>
</dependency>
<dependency>
  <groupId>org.apache.commons</groupId>
  <artifactId>commons-io</artifactId>
  <version>${commons-io.version}</version>
</dependency>
<dependency>
  <groupId>commons-net</groupId>
  <artifactId>commons-net</artifactId>
  <version>${commons-net.version}</version>
</dependency>
<dependency>
  <groupId>commons-fileupload</groupId>
  <artifactId>commons-fileupload</artifactId>
  <version>${commons-fileupload.version}</version>
</dependency>

Spring mvc添加文件上傳解析器


<bean id="multipartResolver"
      class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
    
    <property name="defaultEncoding" value="UTF-8"></property>
    
    <property name="maxUploadSize" value="5242880"></property>
</bean>

Jsp頁面form表單設置enctype參數修改成post方式

<form id="loginForm" name="loginForm" action="/user/add.action" method="post" enctype="multipart/form-data" >
    name:<input type="text" name="name" id="name" onblur="checkName()"/><br/>
    pwd:<input type="text" name="pwd"/><br/>
    birthday:<input type="text" name="birthday"/><br/>
    pic:<input type="file" name="pic"/><br/>
    <input type="submit" value="注冊" />
</form>

Controller層通過RequestParam參數獲取文件上傳的信息

RequestParam：設置參數是否必須要默認值請求參數和獲取參數之間的對應關系

RequestMapping還可以限定請求的具體方法

@RequestMapping(value = "/add",method={RequestMethod.POST})
public String add(@RequestParam(value = "pic", required = false) MultipartFile file, User user, HttpServletRequest request) throws Exception{
    if (file != null && file.getBytes().length > 0) {
        // 先上傳文件
        String path = request.getSession().getServletContext()
                .getRealPath("upload");
        path = URLDecoder.decode(path, "UTF-8");

        String fileName = System.currentTimeMillis()+file.getOriginalFilename();
        System.out.println(path);
        File targetFile = new File(path, fileName);
        if (!targetFile.exists()) {
            targetFile.mkdirs();
        }

        // 保存
        try {
            file.transferTo(targetFile);
        } catch (Exception e) {
            e.printStackTrace();
        }
    }

    int flag = userService.add(user);
    if(flag>0){
        return "redirect:/user/queryAll.action";
    }else{
        return "error";
    }
}

Spring mvc中restful參數處理：微服務架構單體式架構

以前傳遞參數 add.action?name=value&pwd=value

Rest風格 add/wang/12345.action

前台傳遞參數

var url = "${pageContext.request.contextPath }/user/addByRestful/"+$("#name").val()+"/"+$("#pwd").val()+"/"+$("#birthday").val()+".action";
$.ajax({
type: "POST",
url: url

});

后台java類
@RequestMapping(value = "/addByRestful/{name}/{pwd}/{birthday}")
public String addByRestful(@PathVariable String name,@PathVariable String pwd,@PathVariable Date birthday, HttpServletRequest request) throws Exception{
    User user = new User();
    user.setName(name);
    user.setPwd(pwd);
    user.setBirthday(birthday);
    int flag = userService.add(user);
    if(flag>0){
        return "redirect:/user/queryAll.action";
    }else{
        return "error";
    }
}

Spring處理全局異常

Web處理異常
<error-page>
  <exception-type>java.lang.Exception</exception-type>
  <location>/error.jsp</location>
</error-page>
<error-page>
  <error-code>500</error-code>
  <location>/error.jsp</location>
</error-page>

Spring mvc方式

定義異常處理類
public class ExceptionHandler implements HandlerExceptionResolver {

    public ModelAndView resolveException(HttpServletRequest request,
                                         HttpServletResponse response, Object handler, Exception ex) {
        ModelAndView mv = new ModelAndView();
        mv.setViewName("error");
        return mv;
    }

}

在mvc容器里面注入異常類
<bean id="exceptionResolver" class="com.wanho.exceptions.ExceptionHandler"/>

Spring攔截器:

用戶如果已經在session作用域存在，可以查看所有人信息

如果不存在，請登錄或注冊

1、寫攔截器類

public class PermissionInterceptor implements HandlerInterceptor {
    public boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {
        User loginUser = (User)request.getSession().getAttribute("user");
        if(loginUser!=null){
            return true;
        }else{
            response.sendRedirect(request.getContextPath()+"/index.jsp");
            return false;
        }
    }

    public void postHandle(HttpServletRequest request, HttpServletResponse response, Object handler, ModelAndView modelAndView) throws Exception {

    }

    public void afterCompletion(HttpServletRequest request, HttpServletResponse response, Object handler, Exception ex) throws Exception {

    }
}

2、在xml文件注冊攔截器

<mvc:interceptors>
    <mvc:interceptor>
        <mvc:mapping path="/**" />
        <mvc:exclude-mapping path="/**/add.action" />
        <bean class="com.wanho.interceptor.PermissionInterceptor" />

    </mvc:interceptor>
</mvc:interceptors>

攔截器和過濾器的差異？

攔截器只能針對spring的Handler對象（業務控制器），可以精細化到方法一級

過濾器：可以針對所有請求的資源，也可以通過url地址來分析

Spring定時器：

免責聲明！

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

猜您在找 Ajax上傳數據和上傳文件（三種方式） Django——三種方式上傳文件/數據 (form ajax json) 三種ajax上傳文件方法 django-Ajax發送POST請求（csrf跨站請求的三種方式），文件的上傳 SpringMVC上傳文件的三種方式 SpringMVC上傳文件的三種方式三種方式上傳文件-Java python文件上傳的三種方式簡述三種異步上傳文件方式 SpringMVC上傳文件的三種方式