Web應(yīng)用基于Ajax進(jìn)行前后端數(shù)據(jù)交互,一般利用Get或者Post方式來實現(xiàn)。比較流行的做法是前端提交表單數(shù)據(jù),后端處理完畢后返回Json數(shù)據(jù)到前端進(jìn)行顯示。
(1)前端:
<script src="{{url_for('static',filename='js/jquery.js')}}"></script><!--Get請求--><script> var data={ 'name':'kikay', 'age':18 } $.ajax({ type:'GET', url:'{{url_for("test.test_get")}}', data:data, dataType:'json',//希望服務(wù)器返回json格式的數(shù)據(jù) success:function(data){ alert(JSON.stringify(data)); alert(data['test']) } });</script>(2)后端:
@test.route('/test_get/',methods=['POST','GET'])def test_get(): #獲取Get數(shù)據(jù) name=request.args.get('name') age=int(request.args.get('age')) #返回 if name=='kikay' and age==18: return jsonify({'result':'ok'}) else: return jsonify({'result':'error'})抓包:

(1)前端:
<script src="{{url_for('static',filename='js/jquery.js')}}"></script><!--Post請求--><script> var data={ 'name':'kikay', 'age':18 } $.ajax({ type:'POST', url:'{{url_for("test.test_post")}}', data:data, dataType:'json',//希望服務(wù)器返回json格式的數(shù)據(jù) success:function(data){ alert(JSON.stringify(data)); } });</script>(2)后端:
@test.route('/test_post/',methods=['POST','GET'])def test_post(): #獲取POST數(shù)據(jù) name=request.form.get('name') age=int(request.form.get('age')) #返回 if name=='kikay' and age==18: return jsonify({'result':'ok'}) else: return jsonify({'result':'error'})抓包:

(1)前端:
如果前端要向后端提交Json格式的數(shù)據(jù),需要設(shè)置content-type參數(shù)為application/json,并且將data參數(shù)設(shè)置為字符串形式。
<script src="{{url_for('static',filename='js/jquery.js')}}"></script><!--Json--><script> var data={ 'name':'kikay', 'age':18 } $.ajax({ type:'POST', url:'{{url_for("test.test_json")}}', data:JSON.stringify(data), //轉(zhuǎn)變傳遞的參數(shù)為字符串格式 contentType:'application/json; charset=UTF-8', //指定傳遞給服務(wù)器的是Json格式數(shù)據(jù) dataType:'json',//希望服務(wù)器返回json格式的數(shù)據(jù) success:function(data){ alert(JSON.stringify(data)); } });</script>(2)后端:
@test.route('/test_json/',methods=['POST','GET'])def test_json(): #獲取JSON數(shù)據(jù) data=request.get_json() name=data.get('name') age=int(data.get('age')) #返回 if name=='kikay' and age==18: return jsonify({'result':'ok'}) else: return jsonify({'result':'error'})抓包:

新聞熱點
疑難解答