jquery - $.ajax 使 API 调用两次，尽管它只被调用一次

Question

我面临着奇怪的问题。我正在实现一个 SPA。我使用的是MVC，Sammy路由器，这里需要JS和Knockout。

这是一个文件，我在其中定义了调用 API 的函数。

define(['jquery', 'UIBlock'], function ($) {
    var GlobalParameters = function () {
        this.Parameters;
        this.APIEndPoint = 'http://localhost:24774/API/';
    };

    GlobalParameters.prototype.AjaxCallToServer = function (url, requestType, data, successCallback) {
        $.blockUI();
        $.ajax({
            url: this.APIEndPoint + url,
            data: data,
            contentType: "application/json",
            type: requestType,
            statusCode: {
                500: function () {
                    $('#info').html('<p>An error has occurred while processing your request.</p>');
                    $('#info').show();
                },
                409: function (xhr, ajaxOptions, thrownError) {
                    var message = JSON.parse(xhr.responseText).ExceptionMessage;
                    $('#info').html(message);
                    $('#info').show();
                },
                204: function (data) {
                    $('#info').html('<p>No data found.</p>');
                    $('#info').show();
                }
            },
            dataType: 'json',
            success: successCallback,
            complete: function () {
                $.unblockUI();
                setTimeout(function () {
                    $('#info').hide();
                    $('#info').html("");
                }, 3000);
            }
        });
    };

    return {
        GlobalParameters: GlobalParameters
    }
});

我添加了调试器，发现它只被调用一次。

这是来自 Google Chrome 开发者工具的网络跟踪。

以下是每个请求的详细信息。

Answer 1

这是正常行为，称为预检请求。与简单请求不同，“预检”请求首先向其他域上的资源发送 HTTP OPTIONS 请求 header ，以确定实际请求是否可以安全发送

参见this了解更多详情。