javascript 无法在 Chrome 中加载资源 + $.ajax 调用

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/9213829/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-26 05:56:59  来源:igfitidea点击:

Failed to load resource + $.ajax call in Chrome

javascriptjqueryajaxgoogle-chrome

提问by TheWebGuy

I am having a very strange issue with Chrome and AJAX, I have an autocomplete form that has been working for a while. I fired up Visual Studio this morning and it doesn't work anymore. It works fine in production (with Chrome) and works fine locally if I use Firefox or IE, for chrome it doesn't!

我在使用 Chrome 和 AJAX 时遇到了一个非常奇怪的问题,我有一个已经工作了一段时间的自动完成表单。我今天早上启动了 Visual Studio,但它不再工作了。如果我使用 Firefox 或 IE,它在生产中运行良好(使用 Chrome)并且在本地运行良好,对于 chrome 则不行!

I get the error:

我收到错误:

Failed to load resource

无法加载资源

in Developer tools, When I expand on the error I get:

在开发人员工具中,当我扩展错误时,我得到:

f.support.ajax.f.ajaxTransport.sendjquery-1.7.1.min.js:4
f.extend.ajaxjquery-1.7.1.min.js:4
$.autocomplete.sourceCreate:217
a.widget._searchjquery-ui-1.8.17.custom.min.js:127
a.widget.searchjquery-ui-1.8.17.custom.min.js:127
(anonymous function)jquery-ui-1.8.17.custom.min.js:127

I placed a breakpoint in the callback function on the server but it doesn't even make it to the server. The error is definitely on the client side, here is the client-side code:

我在服务器上的回调函数中放置了一个断点,但它甚至没有到达服务器。错误肯定是在客户端,这里是客户端代码:

$("#LocationTxt").autocomplete({
            minLength: 4,
            source: function (req, resp) {
                $.ajax({
                    type: "GET",
                    url: "/Ad/SearchLocations",
                    data: "term=" + req.term,
                    contentType: "application/json; charset=utf-8",
                    success: function (data) {
                        resp($.map(data, function (value, key) {
                            return { data: value, label: data[key].Name, value: data[key].Name };
                        }));
                    }, 
                   error: function (data) {
                       alert(data.statusText);
                   }
                });
            },
            select: function (e, ui) {
                var cityId = ui.item.data.Id;
                $('#AdListing_LocationID').val(cityId);
            }
        });

Also the error event gets triggered, and the statusText property is simply "error". Not very helpful. I am running Chrome version: 17.0.963.46 (I have the latest version as on 2/9/2012). I believe my Chrome updated this morning when I fired up my PC, but I am not sure. Is there a log to tell when my chrome was updated?

错误事件也被触发,statusText 属性只是“错误”。不是很有帮助。我正在运行 Chrome 版本:17.0.963.46(我有 2/9/2012 的最新版本)。我相信我的 Chrome 今天早上在我启动我的电脑时更新了,但我不确定。是否有日志可以说明我的 chrome 何时更新?

回答by Kevin B

If you are working on a local copy of the code, make sure you are working from within a web-server such as localhost. If you are working directly from the file system, google chrome will not allow you to make ajax requests to files on the file system for security reasons.

如果您正在处理代码的本地副本,请确保您在网络服务器(例如 localhost)中工作。如果您直接从文件系统工作,出于安全原因,谷歌浏览器将不允许您向文件系统上的文件发出 ajax 请求。

A few more things...

还有几件事...

Remove this:

删除这个:

contentType: "application/json; charset=utf-8",

You aren't sending json, you are sending a GET request. Instead, add this

您不是在发送 json,而是在发送 GET 请求。相反,添加这个

dataType: "json",

so that jQuery expects to receive json.

以便 jQuery 期望接收 json。

It also may help to have your server return headers setting the contentType to application/jsonwith the proper charset utf-8.

让您的服务器返回标头将 contentType 设置application/json为正确的 charset也可能有所帮助utf-8