Ajax 请求未收到任何响应

Question

我为我正在开发的一个小项目编写了一个 ajax 函数，但无法让它运行 .done() 函数内的代码。该函数应该从 php 接收一个 json 对象（我通过 cURL 获得响应），但是似乎没有给出任何响应。该项目是使用 SBAdmin 2 (Bootstrap) 和 jQuery 3.5.1 编写的。

这是ajax部分：

<script src="https://code.jquery.com/jquery-3.5.1.min.js"></script>

    <!-- Bootstrap core JavaScript-->
    <script src="../resources/vendor/bootstrap/js/bootstrap.bundle.min.js"></script>

    <!-- Core plugin JavaScript-->
    <script src="../resources/vendor/jquery-easing/jquery.easing.min.js"></script>

    <!-- Custom scripts for all pages-->
    <script src="../resources/js/sb-admin-2.min.js"></script>

    <script>

        $(document).ready(function() {
            $("#btnLogin").click(function() {
                console.log('clicked');
                var uname = document.getElementById('inpUsername').value;
                var pwd = document.getElementById('inpPassword').value;  
    
                $.ajax({
                    type: 'POST',
                    url: 'resources/php/functions/main-functions.php?',      
                    data: "inpUsername="+uname+"&inpPassword="+pwd,
                    dataType: 'json'
                })
                .done(function(data, textStatus, jqXHR){
                    console.log('Response received:', data); // Log the entire response
                        if (data.status === 'success') {
                            console.log('Authentication successful:', data.message);
                        } else {
                            console.log('Authentication failed:', data.message);
                        }
                })
                .fail(function(jqXHR, textStatus, errorThrown){
                    console.log('AJAX Error:', textStatus); // Log the error status
                    console.log('Error details:', errorThrown); // Log the error details
                });
    
                $(location).prop('href', '/index.php?view=loggedin');
                location.reload();
            });
        });

这是 php 后端：

if(!empty($_POST['inpUsername']) && !empty($_POST['inpPassword'])){
    if(authUser()) {
        header('Content-Type: application/json');
        die(json_encode(['status' => 'success', 'message' => 'User authenticated']));
    } else {
        header('Content-Type: application/json');
        die(json_encode(['status' => 'error', 'message' => 'Invalid credentials']));
    }
}

在浏览器中运行请求会显示正在执行的 .fail() 函数内的代码。我还收到状态“NS_BINDING_ABORTED”

有人知道我遗漏了什么吗？

顺便说一句，我是新手:)

我已经将 ajax 函数从成功和错误更改为完成和失败 - 没有效果。 我还尝试使用 devtools 手动运行请求 - 在 cURL 中有效，但在浏览器中无效。 我重新排列了包含 jQuery 的部分（在 ajax 部分之前或之后） - 没有效果。

Answer 1

除了人们在评论中指出的问题之外，我认为您可能会 ping 错误的网址。您的其他资产使用此路径：

../resources/foldername etc

虽然您的 AJAX 针对的是这个：

 url: 'resources/php/functions/main-functions.php?',

如你所见，AJAX中的resources文件夹前面没有“..”（两个点）。

除非根文件夹中还有另一个 resources 文件夹，否则您可能应该使用此网址：

url: '..resources/php/functions/main-functions.php?',

另外，只是一个挑剔，但由于您发送的是 POST 请求，而不是 GET，所以不使用查询参数可能是更好的做法。我个人会选择这样的东西：

$.ajax({
    type: 'POST',
    url: '..resources/php/functions/main-functions.php',
    data: {
        inpUsername: uname,
        inpPassword: pwd
    },
    dataType: 'json'
});