TypeScript中的JQuery POST请求

Question

我正在尝试使用TypeScript和JQuery(来自Definitely Typed)与API进行交谈.

let ajaxsettings: JQueryAjaxSettings = {
    url: this.url,
    contentType: "application/json",
    type: "POST",
    data: JSON.stringify(this.apiRequest),
    processData: false,
    success: ( data, textStatus, jQxhr ) => {
        console.log("Response:" + JSON.stringify(data));
    },
    error: ( jqXhr, textStatus, errorThrown ) => {
        console.log("Error Response; " + JSON.stringify(jqXhr));
    },
    headers: {
        "X-UserName": "blahblah",
        "X-Password": "blahblah"
    },
    beforeSend: (request) => {
        request.setRequestHeader("X-APIKey", "blahblahblah");
    }
};
$.ajax(ajaxsettings);

提出请求并查看Fiddler捕获的内容是相当奇怪的.

错误的HTTP谓词和标头包含在Access-Control-Request-Headers中,而不是标准标头.

JQuery 3.2.0,以及来自Definitely Typed的最新index.d.ts .

我可以在Fiddler中创建一个HTTP请求:

我正在尝试创建的请求:

更新

我已经尝试过使用dataType来解决预检检查:

contentType : "text/plain",
method: "POST",
type: "post",
dataType: "json",

更新2

API由Visual Studio 2017(使用.NET Core)托管在IIS Express中,并且使用lite-server托管网站.取出自定义标题时,此代码可以正常工作.

Answer 1

这只是正常的CORS工作.确保您从API所在的相同URL /端口提供包含脚本的html站点.例如:

您的Html /脚本应位于

HTTP://本地主机:1234 /网络/ index.html的

然后是一个AJAX调用

HTTP://本地主机:1234/API /控制器

应该没问题,因为发出请求的脚本来自同一个URL /端口,不需要进行检查.

这样,您应该避免需要对浏览器进行飞行前检查,以确定是否根据CORS授予了访问权限.

或者,在您的API中启用CORS,但请确保您不要将API从每个可能的(Web)客户端公开,以防止滥用.

获得对URL的更多控制的另一种可能途径可能是甚至在你的DEV机器上切换到完整的IIS,但可能有其他/更好的方法来实现这一点(我自己没有那么深入托管.NET Core ATM到提供更好的样本,但其他人可能)