JQuery .ajax没有发送请求

时间:2016-09-06 22:33:11

标签: jquery html ajax post

我无法使用jquery发送POST / Get请求。我有一个python Flask服务器设置。卷曲请求工作完美。我可以看到请求命中服务器,但这些ajax请求没有命中服务器。以下是我一直在努力的代码。

<!DOCTYPE html>
<html>
   <head>
      <meta charset="utf-8">
      <meta name="viewport" content="width=device-width">
      <title>JS Bin</title>
      <script src="https://code.jquery.com/jquery-1.9.1.js"></script>
      <script>
      $(document).ready(function() {

         $("#b1").click(function() {
             $.ajax({
                 type: 'post',
                 url: 'http://np.mystiq.xyz/paste',
                 complete: function(response) {
                     $('#output').html(response.responseText);
                 },
                 error: function() {
                     $('#output').html('Bummer: there was an error!');
                 },
             });
         });
     });

   </script>
   </head>
   <body>
  <button id="b1">test success </button>
  <div id="output"/>
   </body>
</html>

但是这个小提琴似乎有用http://jsfiddle.net/zc59uLnc/所以问题在于JQuery。不确定究竟是什么问题。非常感谢任何帮助。

2 个答案:

答案 0 :(得分:0)

将错误更改为:

error: function(xhr, textStatus, error){
    $('#output').html('Bummer: there was an error!  Check the console for details.');
    console.log(xhr.statusText);
    console.log(textStatus);
    console.log(error);
}

它应该指向你的解决方案。

答案 1 :(得分:0)

您确定您的视图接受POST HTTP方法吗?你使用curl时用POST或GET测试了吗?

以下代码适用于我:

<强> app.py:

from flask import Flask, jsonify, render_template

app = Flask(__name__)


@app.route('/', methods=['GET'])
def index():
    return render_template('index.html')


@app.route('/hello', methods=['POST'])
def hello():
    return jsonify({'test': 'test message'})


if __name__ == "__main__":
    app.run(host="0.0.0.0", debug=True)

templates / index.html 中,我只是粘贴了您的模板并将您的网址更改为:

url: 'http://my_vm_ip:5000/hello'

而不是:

url: 'http://np.mystiq.xyz/paste'

如果您遇到跨域问题,请将以下代码添加到您的app.py文件中:

@app.after_request
def after_request(response):
    response.headers.add('Access-Control-Allow-Origin', '*')
    response.headers.add('Access-Control-Allow-Headers', 'Origin, X-Requested-With, Content-Type, Accept')
    response.headers.add('Access-Control-Allow-Methods', 'GET, PUT, POST, DELETE, OPTIONS')
    return response