我有以下代码从简单的3输入表单中检索值:
//retrieves data from a form
var $form = $( this ),
prgname= $form.find('input[name="prg"]').val(),
startDate = $("#startdate").datepicker({ dateFormat: 'yy-mm-dd' }).val(),
endDate = $("#enddate").datepicker({ dateFormat: 'yy-mm-dd' }).val();
以下代码将请求发送到服务器:
var request = $.ajax({
url: "/prg/",
type: "post",
data: JSON.stringify({prg: prgname, start:startDate, end:endDate}),
contentType: 'application/json',
dataType: 'json',
success: function() {},
error: function (jqXHR, textStatus, errorThrown){};
在服务器端使用python和webapp2我做了以下,(这里是我不确定的事情)
import json
class PrgHandler(webapp2.RequestHandler):
def post(self):
prg= cgi.escape(self.request.POST['prg'])
start_date = cgi.escape(self.request.POST['start'])
end_date = cgi.escape(self.request.POST['end'])
#some code to write to db here
....
#if successful return a success message
if success:
success_msg = [{'class': 'success', 'msg': 'Successfully saved to the database'}]
else:
success_msg = [{'class': 'error', 'msg': 'Could not saved to the database'}]
data_string = json.dumps(success_msg)
self.response.headers.add_header('content-type', 'application/json', charset='utf-8')
self.response.write(data_string)
当我收到回复时,它会跳过成功函数并直接转错。
记录错误值我没有任何意义:
the error is:
The text status is:error
The jqXHR is:[object Object]
Chrome的控制台正在向我显示错误:
Resource interpreted as Document but transferred with MIME type application/json:
我查了一下,SO上的解决方案不起作用,我认为这是服务器端代码的错误:
self.response.headers.add_header('content-type', 'application/json', charset='utf-8')
如果我注释掉上面一行,我在chrome中没有错误,我只是按照以下格式在空白页面上找回具有正确值的响应:
[{"msg": "Successfully saved to the database", "class": "success"}]
在上面的情况下,它会保存到数据库中,所以除了标题之外我似乎找不到任何错误,只是不知道如何继续!
修改 似乎是从服务器端我删除了以下行的错误: event.preventDefault();
来自我的脚本,它至少引起了所有问题,我至少可以清楚地看到问题所在。这是错误地获取发布的数据,我将如何正确地做到这一点?我尝试了以下方法:
json_data = self.request.GET.items()
decoded = json.loads(json_data)
但我得到一个TypeError:预期的字符串或缓冲区在以下行: json_data = self.request.GET.items()
答案 0 :(得分:4)
查看调试器。您在帖子中收到一个JSON字符串(webapp2 multidict)。您必须使用json.loads解码此字符串,从而生成python对象。
这是我发送和接收json的jquery代码:
function gaeQuery(request) {
var url = "/query";
var payload = {'jsondata' : JSON.stringify(request)};
$.post(
url,
payload,
function(response) {
procesResponse(response);
}, // succes response callback
'json', // response contains JSON content, and will be decoded in a js object
{
contentType: "application/json;charset=utf-8", // send JSON content
timeout: 20000,
tryCount: 0,
retryLimit: 3, // max 3 retries
error: function(xhr, textStatus, errorThrown) { // error handling callback
if (textStatus === 'timeout') {
this.tryCount++;
if (this.tryCount <= this.retryLimit) { //try again until retryLimit
$.ajax(this);
return;
}
alert('We have tried ' + this.retryLimit + ' times and it is still not working. We give in. Sorry.');
return;
}
if (xhr.status === 500) { // internal server error
alert('Oops! There seems to be a server problem, please try again later.');
}
else {
alert('Oops! There was a problem, sorry.'); // something went wrong
}
}
}
);
}
答案 1 :(得分:3)
好的,所以我设法解决这个问题,并认为我会发布有助于我帮助任何人寻找此信息的答案,因为webapp2文档在“获取”发布的json数据时没有那么有用。
在客户端我做了以下事情:
var request = $.ajax({
url: "/some/url/",
type: "POST",
data: JSON.stringify([{someval: val1, someval2:val2, someval3:val3}]),
contentType: "application/json",
dataType: 'json',
beforeSend: function() {
$('#loading-div').show();
},
complete: function(){
$('#loading-div').hide();
},
success: function(response, textStatus, jqXHR){}
});
我无法立即解决问题的原因是因为我删除了以下行以及一些注释掉的行,这会阻止页面在发布后重定向。这是所有奇怪的,无关的和无用的错误消息的来源:
event.preventDefault();
服务器端的将json数据发布到appengine,执行以下操作:
jdata = json.loads(cgi.escape(self.request.body))
for vals in jdata:
val1 = vals['someval']
val2 = vals['someval2']
val3 = vals['someval3']
上面是问题的根源我没做正确,如果没有客户端上一行,就没有办法搞清楚。
无论如何,一旦你有数据做了你需要做的任何处理,一旦你完成并需要发回一个json响应添加以下行:
//the data would look something like this
data = {'return_value': val1, 'return_value2': val2,
'return_value3': val3, 'return_value4': val4}
return_data = json.dumps(data)
self.response.headers.add_header('content-type', 'application/json', charset='utf-8')
self.response.write(return_data)
几乎忘了客户端再次访问从服务器发回的变量,jquery非常直接...做类似的事情:
success: function(response, textStatus, jqXHR){
console.log(response.return_value);
console.log(response.return_value2);
console.log(response.return_value3);
}
希望这有助于寻求此信息的人。