AJAX 403 禁止，仅有时答案

【问题标题】：AJAX 403 Forbidden, only sometimesAJAX 403 禁止，仅有时
【发布时间】：2013-05-31 04:57:55
【问题描述】：

基本上我正在尝试检查是否使用了用户名，因为用户键入它会触发 ajax，并且在 keyup 上检查它是否被使用，如果是则突出显示输入红色。在谷歌浏览器中，我打开了错误控制台，有时我收到 403，有时没有。

当我开始点击删除或输入用户名太快时，我注意到了 403，其他时候无论我做什么都会发生，甚至更进一步，有时根本不会。文件权限正常，路径正确（我认为）。非常感谢任何帮助。

代码如下：

$(document).ready(function()
{
    $("#username").keyup(function()
    {
        $.ajax({
            url: '/resources/ajax/userCallbacks.php',
            type: 'post',
            data: 'checkName='+$(this).val(),
            success: function(response){

                // Check response
                switch(response)
                {
                    case 'taken':
                        $("#username").addClass('red-border');
                        break;
                    case 'available':
                        $("#username").removeClass('red-border');
                        break;
                }
            }
        });
    });
});

【问题讨论】：

您应该使用setTimeout 函数延迟您的ajax 调用，并保留超时的引用。当在超时结束之前触发第二个事件时，您只需取消超时（使用clearTimeout) 并重新创建它。这将允许您仅在用户停止写一点时运行 AJAX 调用，并且那么你就不会有请求泛滥的问题了。
看看节流和去抖动，你正在扼杀你可怜的服务器。 :(

标签： php jquery ajax

【解决方案1】：

请尝试一下超时，也许你在短时间内有很多请求......

var mytimeout = false;

$(document).ready(function()
{
    $("#username").keyup(function()
    {
    if(mytimeout != false) {
        window.clearTimeout(mytimeout);
    }
    mytimeout = window.setTimeout("doAjaxRequest()",500);
    });
});

function doAjaxRequest() {

        $.ajax({
            url: '/resources/ajax/userCallbacks.php',
            type: 'post',
            data: 'checkName='+$("#username").val(),
            success: function(response){

                // Check response
                switch(response)
                {
                    case 'taken':
                        $("#username").addClass('red-border');
                        break;
                    case 'available':
                        $("#username").removeClass('red-border');
                        break;
                }
            }
        });
}

【讨论】：

不确定$(this).val() 是否会返回该值，因为您不在正确的上下文中。您必须使用$("#username").val()
太好了，谢谢你们！我一定会在我未来的代码中使用它。再次感谢！

【解决方案2】：

这是我一直在使用的代码 sn-p，它可以防止同时触发太多请求。

这个想法是您将 ajax 调用的状态存储在 this.ajax 中。一旦请求新的调用，前一个调用将立即取消，从而防止网络服务器过载。

$(document).ready(function()
{
    $("#username").keyup(function()
    {
        if( this.ajax )
        {
            this.ajax.abort();
        }
        this.ajax = $.ajax({
            url: '/resources/ajax/userCallbacks.php',
            type: 'post',
            data: 'checkName='+$(this).val(),
            success: function(response){

                // Check response
                switch(response)
                {
                    case 'taken':
                        $("#username").addClass('red-border');
                        break;
                    case 'available':
                        $("#username").removeClass('red-border');
                        break;
                }
            }
        });
    });
});

【讨论】：