使用超时循环将数据加载到iframe的更好选项

Question

我不太确定如何恰当地标题这个问题.

我想讨论一下及时将POST/GET数据发布到另一个网站并使用jQuery作为主力的最佳方法.当然,我愿意接受有更好的方法和库的建议,尽管是基于Javascript或C#.

让我尝试设置方案.

这两个站点共享子域"a.company",但它们是两个独立的IIS7站点.

网站1

• a.company.com/products
• ASP MVC 5
• 包含'puesdo'购物车方法,用于收集想要传递给site2的产品.

网站2

• a.company.com/checkout
• 供应商预编译无法访问CS文件,但可以修改aspx/masterfile文件
• ASP Webforms
• 有限的API会将URL转换为产品并添加到购物车中.
• 示例a.company.com/checkout/product/qty

目前,当点击站点1上的"继续结账"按钮时,jQuery函数循环遍历每个购物车项目并生成类似于以下的URL :a.company.com/checkout/product/qty,然后将URL加载到iframe上该文件.这个循环也有setTimeout函数,

jQuery(function(){

  $('#proceed').on('click', function(){
       // set integer for timeout

       n = 2;

       $(cartobject).each(function(i){

              q = item.get('qty');
              p = item.get('productid');

              // delay loop
              setTimeout(function(){ 
                   ProceedItems(q,p) 
              }, 1000 * (i + 1));
              n = n + parseInt(i);
       });

       n = n * 2 + "000"; // from each function
       // delay redirect so loop can finish
       setTimeout(function(){
            RedirectCustomerToCheckout();
       }, n );


  });

  // Proceed each item to Checkout API
  function ProceedItems(quantity, productid)
  {
      $("#iframe").attr("src","http://a.company.com/checkout/" + productid + "/" + quantity);
  }

  // when loop as finished :: take customer to checkout process.
  function RedirectCustomerToCheckout()
  {
       window.location.href = "http://a.company.com/checkout";
  } 

});

这种方法是有效的,我欣赏,整个'如果它没有破坏' - 但我的焦虑在整个时间边缘,因为我认为必须有一个更好的方法.也许添加检查iframe已完成加载/回发的代码？

主要问题是: - iframe没有加载(并且没有生成任何反馈) - 页面重定向用户没有完成循环(因为连接速度慢)？

使用具有回复成功/失败/完成检查的Ajax POST/GET功能在确保加载完成方面将更加安全.

真的很喜欢一些建议.

Remote Address:10.0.0.100:800
Request URL:http://a.company.com/checkout/46026/1
Request Method:GET
Status Code:302 Found

GET /checkout/46026/1 HTTP/1.1
Host: a.company.com
Connection: keep-alive
Accept: */*
Origin: http://a.company.com
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/36.0.1985.125 Safari/537.36
Referer: http://a.company.com
Accept-Encoding: gzip,deflate,sdch
Accept-Language: en-US,en;q=0.8

Answer 1

我会假设iframe你的网站上隐藏了用户并没有真正看到它.
我肯定会使用ajax而不是使用iframe这个.

此示例将并行执行所有请求(在chrome中一次最多6个),然后将调用RedirectCustomerToCheckout它们是否全部成功完成,或者onFailedCheckout如果任何请求失败或通过默认的ajax超时,它将调用.

如果要使用每个请求超时$.ajax,$.get则可以使用而不是.

jQuery(function () {
    $('#proceed').on('click', function () {
        var checkouts = [];
        $(cartobject).each(function (item) {
            var q = item.get('qty');
            var p = item.get('productid');
            checkouts.push($.get('http://a.company.com/checkout/' + p + '/' + q));
        });
        // $.when will wait for all checkouts to complete
        $.when.apply($, checkouts)
           .done(RedirectCustomerToCheckout)
           .fail(function onFailedCheckout() {
                alert('stuff broke !');
           });
    });

    // when loop as finished :: take customer to checkout process.
    function RedirectCustomerToCheckout() {
        window.location.href = 'http://a.company.com/checkout';
    }
});