使用 JQuery 两次提交表单

Question

我是 UI 的新手，我们正在尝试使用 JQuery 实现网络调用，我们有观察者一个奇怪的网络调用问题，即当我们尝试执行post http 调用我们在服务器访问日志中有观察者首先进行 http post 调用，然后立即存在一个 http get 调用。

请在 .jsp 页面下方找到：

<html>

<head>
<script type="text/javascript"
    src="http://ajax.googleapis.com/ajax/libs/jquery/1.4/jquery.min.js"></script>
<%
    String urlVal = (String) request.getAttribute("dataURL");
%>
<%
    String emailID = (String) request.getAttribute("emailID") ;
%>

<script type="text/javascript">
var url="<%=urlVal%>";
alert(url);

     function navigateWithForm() {
        var form = $('<form></form>');
        form.attr({
            method: 'POST',

            action: url
        });
        form.append(getInput());
        form.appendTo('body').submit();

     }

     function getInput() {
         alert("<%=emailID%>");
        return $('<input type="hidden" />').attr({
            name: 'header',
            value: '<%=emailID%>'   
        });
    }

    $(document).ready(function() {
        navigateWithForm();
    });

</script>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>JSP Page</title>

</head>


</html>

后端服务部署在weblogic中，采用spring 2.5框架设计。我们有用于负载平衡的 apache 代理服务器。

任何帮助将不胜感激。

Answer 1

你问题中的代码没有什么特别的问题（除非你真的想使用 AJAX 但我觉得那是一个不同的问题）。

您的 server-side 代码似乎实现了典型的 Post/Redirect/Get 请求处理模式。

这似乎是正在发生的事情

Browser               |  Server
----------------------|-----------------------------
create form           |
  action=urlVal       |
  method=POST         |
                      |
submit form           |
  POST "urlVal" -------->
                      |
                      |  Process request
                      |
                    <--- Response
                      |    302 Found
                      |    Location: someUrl
                      |
GET "someUrl" ---------->
                      |
                    <--- Response
                      |    500 Internal Server Error

因此 URL 您的 server-side 代码添加到 302 Found 响应的 Location header，无法处理 GET 由该响应产生的请求。您需要修改您的 server-side 代码以处理 GET 请求或使用不同的 Location 响应。

例如 (Spring MVC)，假设您的 urlVal 是 "/foo" 并且您有

@RequestMapping("/foo")
public String handleFoo(@RequestParam String header) {
    // process, etc
    return "redirect:/foo";
}

返回一个 redirect 这样的响应告诉客户端（浏览器）通过响应 headers 执行 GET 请求...

302 Found
Location: /foo

注意该方法如何需要 header 请求参数。

浏览器将尝试通过 GET 请求 /foo，这将失败，因为没有带参数的请求 body（即没有 header）。

解决方案是：

重定向到响应 GET 请求的现有 URL

处理 GET 您要重定向到 URL 的请求

@RequestMapping(path = "/foo", method = RequestMethod.GET)
public String getFoo() { // note, no required parameters
    // etc
}

或者，

以不同的方式回应。即使是空响应也可以

@RequestMapping("/foo")
@ResponseBody
public ResponseEntity<Void> handleFoo(@RequestParam String header) {
    // process, etc
    return ResponseEntity.ok().build();
}

Answer 2

经过多日的奋斗，我终于找到了解决问题的方法。这确实是一个很小的变化。希望该解决方案对正在为该问题苦苦挣扎的其他人有用。实际问题是 Jquery 调用的 url/action。

URL 较早通过

上下文：root?param1=value¶m2=2

正确的 URL 通过是

上下文：root/?param1=value¶m2=2.

感谢 Phil，我必须在其中查看请求和响应的 header 以及位置、来源和引荐来源网址等其他信息

使用 JQuery 两次提交表单

twice Form submission using JQuery

javascript

java

jquery

spring-2.5