Question

当使用带有返回JSON数据的URL源的YUI3自动完成小部件时，是否有一种检测HTTP错误响应的简单方法？

示例：

Y.one('#ac-input').plug(Y.Plugin.AutoComplete, {
    resultHighlighter : 'phraseMatch',
    source : "http://example.com/api/item/search/?q={query}",
});

（例如，如果用户未在该服务器上进行身份验证，则自动完成窗口小部件会收到401响应并以静默方式失败，但会将错误记录到控制台。）

我已经搜索过但没有找到特定于此问题的文档 - 源头潜水也没有帮助。我想我必须滚动自己的数据源对象，这样我才能发出请求并检测错误。

或者是否有更简单的方法将错误事件处理程序传递给此类数据源的YUI3自动完成窗口小部件？

修改：有关使用Y.on('io:failure')的简单解决方案，请参阅my follow-up answer。

Answer 1

我认为Y.DataSource是传递错误处理程序的简单方法。您应该可以执行以下操作：

var ds = new Y.DataSource.IO({
  source: 'http://example.com/api/item/search/'
});

ds.set('ioConfig', {
    on: {
        failure: function (transactionID, ioResponseObj, args) {
            ...
        }
    }
};

Y.one('#ac-input').plug(Y.Plugin.AutoComplete, {
  requestTemplate: '?q={query}',
  source: ds
});

这是通过查看failureHandler末尾的'apply'函数调用。

当然请注意Same Origin policies适用。

Answer 2

一个简单的解决方案：使用全局IO故障事件处理程序。它的工作原理没有this answer中描述的DataSource.IO对象的复杂性。

虽然我宁愿在AutoComplete小部件事件处理程序中本地处理错误，但是，我还没有找到一种简单的方法。

使用Y.on('io:failure')事件处理可能是一种更直接的方法，如果您只需要显示有关通信错误的信息。

//
// Handle IO failure event
function ioFailureFunction(transaction, xhrObject) {
    errCode = xhrObject.status;
    // Insert the current error status into an HTML element...
    Y.one('#error').setContent(errCode);
};
Y.on('io:failure', ioFailureFunction);

基本原理：我发现使用this answer中概述的DataSource.IO方法可能会带来极大的复杂性，因此如果您有简单的需求，这种方法很方便，并且工作简单自动完成配置 - 因此您可以保持AutoComplete配置简单并仍然处理IO错误......

如何使用YUI3自动完成小部件处理远程数据源错误？

2 个答案: