完全同时从ajax调用发送的重复webClient请求

Question

我面临的问题是，webClient.UploadData方法会立即从ajax请求中触发两次。但是同一webClient.UploadData方法在从aspx页面调用时只触发一次。从日志中我可以看到，发送的两个请求的时间完全相同。2016-06-23 05:54:48.477

下面是代码片段-

var DTO = JSON.stringify({Date: date, Month: month, AgeRange: ageRange, MethodName: "Enroll" });

$.ajax({
   type: "POST",
   contentType: "application/json; charset=utf-8",
   url: "/mypath/TasksHandler.ashx",
   data: DTO,
   async: true,
   success: function(result) {
   ......
   }

TasksHander将调用以下方法-

using (var client = new WebClient())
{
  client.Headers[HttpRequestHeader.ContentType] = "application/json";
  client.Headers[HttpRequestHeader.Accept] = "application/json";
  var data = Encoding.UTF8.GetBytes(dataInput);
  byte[] result = client.UploadData(url, "POST", data);
  output = Encoding.UTF8.GetString(result, 0, result.Length);
 }

我猜测这可能是因为在ajax调用中将异步属性设置为true吗？如果对此有任何想法，请告知。

Answer 1

代码中的问题是有两个地方在HTML中有一个CSS类“道布”，而jquery代码中有$(“.dob”).each(函数(elem，val){.}这个函数导致ajax调用.

Answer 2

可能是使用ajax调用发出了飞行前请求。

在这种情况下，浏览器将在HTTP OPTIONS请求之前发出带有Access-Control-Request-Method头的POST请求。

您能检查服务器上的两个请求或浏览器网络控制台上的HTTP Method吗？正如我所说的，它可能是第一个是OPTIONS，第二个是POST。

为了克服这一点，您有几个选项，可能最简单的方法是确保脚本和它调用的端点位于同一个域中。

如果做不到这一点，您只需执行一些条件检查，通过检查dataInput或data变量的值来确保要发送的字节。

如果这没有帮助，那么请提供关于设置的进一步信息，即脚本A位于服务器X，脚本B位于服务器Y，等等。

Answer 3

如果您使用的是单击事件，请确保事件只被触发一次。为了确保，首先取消绑定任何单击事件：

$(selector).unbind('click');

然后绑定处理程序：

$(selector).bind('click', function() {//...});

//You can chain calls !
$(selector).unbind('click').bind('click', function() {//...});

如果使用button或submit来触发ajax事件，请确保防止默认行为：

$(selector).submit(function(e){
    e.preventDefault();
    //Your ajax call 
    return false;
});