反射在基于ajax的应用中的意义



Ajax和反射

我正在开发一个基于ajax的应用程序,想知道反射在这里扮演或可能扮演什么角色?

也许最重要的是我在问自己,如果这将是一个好方法

  • 通过单个处理程序处理所有ajax响应,
  • 反映或解释数据或错误
  • 根据分析委派进一步的处理(例如在哪里注入html)。

这是一个萌芽过程吗?你想到了什么利弊?

额外clearification

我目前的实现是这样的,这是我不满意的。

  • 为用户操作注册事件处理程序,这会导致ajax请求。
  • 对于每个请求:
    • 确定哪个容器是新内容的目标
    • 验证ajax响应
    • 如果一切如预期的那样,将结果传递给适当的渲染函数

下面是一个例子

function setGamedayScoringChangeHandlers() {
    $("#community").delegate("div.community div.nav", "click", function() {
        var orderId = $(this).html();
        var communityId = $(this).closest('.communityView ').dashId();
        requestGamedayScoringByOrderId(communityId, orderId);
    });
}
function requestGamedayScoringByOrderId(communityId, orderId) {
    var $targetContainer = $('#community-' + communityId + '-gameday');
    $.ajax({
        url: '?api=league&func=getGamedayScoringByCommunityIdAndOrderId',
        data: {
            communityId : communityId,
            orderId : orderId
        },
        success: function(result) {
             // custom indicator, that sth. didn't work as supposed 
             if (result.success === false) {
                 // a php error couldn't be handled as expected
                 if (result.error === 'phpRuntimeError') {
                      // ..
                 }
             // ..
             }
             else {
                 renderGamedayScoring(result, $targetContainer);
             }
        }
    });
 }

问题

如何简化这个,特别是冗余的错误检查?从某种意义上说,"这个反应有效吗?"错误信息是怎么说的或者数据是什么样子的?一个合理的结构如何处理这个问题?另外:实际ajax请求的"耦合"和确定$targetContainer是一个"正常"过程吗?

许多谢谢,


罗布森

是的,我认为通过一个管道注册ajax处理程序是一种好方法,因为它更容易控制,您将拥有更少的冗余代码和更少的boarding效果。如果我看看你的代码注释,似乎响应不是你所期望的。我曾经这样做来控制一组ajax请求与服务器脚本对话。我构建一个请求对象,如:

    // myscript.js
var rqPHP = {
            url:'php/dispatcher.php', type:'POST', dataType:'json',
            success:function(json, status, jXHR){
                //console.log('rqPHP.succes : ', json);
                if(!json)   return console.warn('[rqPHP.success] json is null');
                if(!json.cmd)   return console.warn('[rqPHP.success] json.cmd is null');
                if(!json.res)   return console.warn('[rqPHP.success] json.res is null');
                if(json.err && json.err.length){        console.warn('[rqPHP.success errors cmd:'+json.cmd+'] '+json.err);}
                // so if no errors, dispatch actions based on original command asked
                switch(json.cmd){
                    case 'loadfile' :
                        // do whatever with response
                        break;
                    case 'savefile' :
                        // do whatever with response
                        break;
                }
            },
            error:function(jXHR, status, err){
                console.warn('[rqPHP.error] ', status,',',err,',',jXHR.responseText);
            }
        };

则当使用这个对象遍历所有不同的操作组时,我精确地传递了哪些操作和参数。我使用请求json数据,因此我能够接收到一个简单的解析响应,因此我能够返回所请求的原始命令,以及可能发生的错误的一些详细信息,例如,当我需要触发请求时:

// myscript.js
rqPHP.data = {'cmd':'loadfile', 'filename':'file.dat', 'arg2':'other argument'};
$.ajax(rqPHP);

然后是一个服务器脚本的示例,它将响应:

// dispatcher.php    
    $pv = $_POST;
    $res = '';
    $err = array();
    // you check the command asked for :
    switch(strtolower($pv['cmd'])){
      case 'savefile' :
        // do whatever
        break;
      case 'loadfile' :
        // do whatever
        if(any error){
          $err[] = $loadError;// push error with whatever details you'll retrieve in javascript
       }else{
         $res = ',"res":"'.$dataLoaded.'"';// format json response so you'll check the var exist
        }
        break;
    }
    $jsonRes = '{"cmd":"'.$pv['cmd'].'"'.$res.',"err":"'.implode('|', $err).'"}';// json result
    print $jsonRes;

它们可能有一些错误,这只是为了原则,我希望这将帮助,只是一些最后的建议:

    你最好使用requestObject。而不是像你那样设置url,这更容易,因为jQuery做正确的编码工作
  • 你可以使用POST,所以url保持干净,POST变量是'隐藏'
  • 在你的情况下,因为你可能想用一个服务器脚本集中服务器操作,你应该使用'json'作为数据类型,因为它更容易从响应中检索细节,这样的错误。你必须区分当url不存在或访问被拒绝时触发的ajax错误,当服务器响应时,它只是无法响应此请求,并区分服务器脚本的正确响应,我的意思是脚本响应良好,但它可能发生命令错误,例如对于'loadfile'命令,参数fileUrl可能是错误的或不可读的,所以操作完成,但响应将对你无效…

如果你计划为不同的部分触发许多加载(我的意思是你可能不会在加载一个新的ajax之前等待响应),最好设置主要的成功和错误函数来保持集中,然后在每次加载

时构建一个新的请求对象。
function rqSuccess(json, status, jXHR){
   // put same checking code as before, then you can also retrieve some particular variables
   // here, 'this' should correspond to the request object used for the $.ajax so :
   console.log('myTarget is : ', this.myTarget, ' , myVariable is : ', this.myVariable);
}
function rqError(jXHR, status, err){
   // put same checking code 
}
// then each time you want make one or many independant calls, build a new request object
var myRq = {url:'dispatcher.php',type:'POST',dataType:'json',
    success:rqSuccess,
    error:rqError,
    myTarget:$('#myblock'),// any variable you want to retrieve in response functions
    myVariable:'Hello !',// after all it is an object, you can store anything you may need, just be carefull of reserved variables of the ajax object (see jQuery $.ajax doc)
    // the data object is sanitized and sended to your server script, so put only variables it will need
    data : {'cmd':'loadfile',...}
}
$.ajax(myRq);
// you may load an other independant one without waiting for the response of the first
var myRq2 = {...myTarget:$('#anotherblock'), data:{'cmd':'anotheraction'}...}
$.ajax(myRq2);

作为第一步,您应该更改服务器端的错误处理,以便对错误情况产生非ok/200响应,例如抛出500。然后在客户端将其与其他错误一起作为实际错误处理,而不是通过success-回调处理。

这样你就可以使用jQuery的抽象来处理全局错误:http://api.jquery.com/ajaxError

相关内容

  • 没有找到相关文章

最新更新