首页 > 解决方案 > 请求的 URL 不允许使用方法

问题描述

我不知道是什么导致了这个错误。也许我认为这是一件需要改变的小事,但我找不到这个。请帮助我完成这个。我想将文件地址发送到服务器并对其进行格式化,该代码我没有添加,但地址没有被格式化。帮助将不胜感激

    <div class="container">
         <form class="form-signin" method="post" role="form">
             <h2 class="form-signin-heading">Please Sign Up </h2>
             <div>
             <input type="text" name="address" placeholder="Drivers" class="form-control col-3 mr-4">
        </div>
        <div>
            <button class="btn btn-outline-light d-inline-block" style="width: 150px;float: left;" id="upload">Upload</button>
        </div>
        </form>
     </div>
$(function() {
     console.log("working")
    $('#upload').click(function() {
        console.log("inside is working")
        $.ajax({
            url: '/signUpUser',
            data: $('form').serialize(),
            type: 'POST',
            success: function(response) {
                console.log(response)
                console.log(data.address);
            },
            error: function(error) {
                console.log(error);
            }
        });
    });
});
@app.route('/')
def index():
    return render_template('index.html')

@app.route('/signUpUser', methods=['GET','POST'])
def signUpUser():
    if request.method=='POST':
        address=request.form['address']
    return jsonify({'address':address}); 

标签: javascriptpythonjqueryajaxflask

解决方案


问题是因为您没有阻止标准表单提交。这意味着您正在向当前页面发送标准表单请求,该页面未配置为接收 POST 请求,因此您会看到错误。

要解决此问题,请将submit事件处理程序附加到,form并调用preventDefault()作为处理程序函数的参数提供的事件;

$(function() {
  $('form.form-signin').on('submit', function(e) {
    e.preventDefault();

    $.ajax({
      url: '/signUpUser',
      data: $(this).serialize(),
      type: 'POST',
      success: function(response) {
        console.log(response)
        // console.log(data.address); < commented out as 'data' is not defined anywhere
      },
      error: function(x, s, e) {
        console.log(x, s, e);
      }
    });
  });
});

推荐阅读