使用REST发送Ajax请求有效，但不适用于jQuery [英] Sending ajax request with a REST works but not with jQuery
问题描述
我正在尝试发送ajax调用.我使用了Chrome的REST测试扩展程序，称为Postman [链接到它] .当我发送带有扩展名的呼叫时，它可以工作，但是当我通过jQuery发送呼叫时，它不起作用，并且出现错误消息:错误0".
这是Postman工具发送到服务器的请求:
POST /form/front HTTP/1.1
Host: go.com
Cache-Control: no-cache
{ "sitename": "AAGx", "zone": 12, "sector": 34, "square": 7}
这是我向服务器发送请求的代码:
function insert_newform() {
form_data = {sitename: 'AAGx', zone: 12, sector: 34, square: 7}
$.ajax({
type: "POST",
url: 'http://go.com/form/front',
data: JSON.stringify(form_data),
success: function(result) { alert("good!") },
error: function(jqXHR, textStatus, errorThrown) { alert(textStatus) }
});
}
$("#show").click(function() {
insert_newform()
}
);
我无法确定我的电话出了什么问题！
go.com只是一个例子！
我要疯了.
Edit3:我更新了代码以添加JSON.stringify()
Edit4:当我将文件放在服务器上并运行脚本时，它运行良好，一切都很好！但是，当我在计算机上本地运行文件时，这些调用将不起作用，并且会出现该错误.我真的快要疯了！我不知道怎么了:(
Edit5:也许这与称为CORS的东西有关?但是，如何通过Chrome插件运行它却无法在我的本地脚本中运行呢?！
如果您的data属性是JavaScript对象，则jQuery会将其转换为表单数据以进行传输. Postman可能会将其作为实际字符串发送.尝试将data用单引号引起来:
data: '{"sitename": "AAGx", "zone": 12, "sector": 34, "square": 7}', ...
编辑:根据您的编辑，我几乎可以保证您是CORS或跨域资源共享问题.一般而言，AJAX和JavaScript受到各种安全性约束.限制JavaScript功能的最主要的安全概念之一是同一起源政策 .这个想法是为了防止XSS(跨站点脚本)的攻击.</p>
jQuery的AJAX函数如果遇到CORS问题，将给出错误代码0
关于如何更严格地保护本地文件，有详细的答案这里的约束条件可以完美地说明您的情况.
您的解决方案是发送 Access-Control-Allow-Origin 标头(如果您可以控制服务器).否则，您可以尝试使用不使用XMLHTTPRequest对象并且不受这些相同的安全性约束的JSONP.
I'm trying to send an ajax call. I used a REST test extension for Chrome called Postman [Link to it]. When I send the call with the extension it works, but when I send it via jQuery it doesn't work and I get as an error message: "error 0".
This is the request that the Postman tool sends to the server:
POST /form/front HTTP/1.1
Host: go.com
Cache-Control: no-cache
{ "sitename": "AAGx", "zone": 12, "sector": 34, "square": 7}
This is my code to send a request to the server:
function insert_newform() {
form_data = {sitename: 'AAGx', zone: 12, sector: 34, square: 7}
$.ajax({
type: "POST",
url: 'http://go.com/form/front',
data: JSON.stringify(form_data),
success: function(result) { alert("good!") },
error: function(jqXHR, textStatus, errorThrown) { alert(textStatus) }
});
}
$("#show").click(function() {
insert_newform()
}
);
I am unable to find out what's wrong with my call!
EDIT: go.com is just an example!
EDIT2: I'm going crazy.
Edit3: I updated my code to add JSON.stringify()
Edit4: when I put the files on the server and run the script it works great and everything is fine! But when I run the files locally on my machine, then the calls don't work and I get that error. I'm really going crazy! I can't figure out what's wrong :(
Edit5: maybe this has to do with this thing called CORS? But how does it come that it works from the Chrome Plugin but it doesn't work from my scripts locally?!!
If your data property is a JavaScript object, jQuery converts it to form data for transmission. It's possible that Postman is sending it as an actual string. Try wrapping your data in single quotes:
data: '{"sitename": "AAGx", "zone": 12, "sector": 34, "square": 7}', ...
Edit: In response to your edits, I can almost guarantee you it is a CORS, or cross-origin resource sharing, issue. AJAX and JavaScript in general are subject to various security constraints. One of the most central security concepts that limits the abilities of JavaScript is the Same Origin Policy. The idea is to prevent XSS (cross-site scripting) attacks.
jQuery's AJAX function will give an error code of 0 if it experiences CORS issues.
There's a detailed answer about how local files are under more strict security constraints here that explains your situation perfectly.
Your solutions are to send the Access-Control-Allow-Origin header from the server, if you have control of the server. Otherwise, you can try using JSONP which does not use the XMLHTTPRequest object and is not subject to those same security constraints.
这篇关于使用REST发送Ajax请求有效，但不适用于jQuery的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
