Метод не разрешен для запрошенного URL

Question

Я не понимаю, в чем причина этой ошибки. Может быть, я думаю, что это небольшая вещь, которую нужно изменить, но я не могу ее найти. Пожалуйста, помогите мне в этом. То, что я хочу, чтобы отправить адрес файла на сервер и отформатировать его для чего-то, этот код я не добавил, но адрес не форматируется. Помощь будет оценена

    <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}); 

Answer 1

Проблема в том, что вы не помешали отправке стандартной формы. Это означает, что вы отправляете стандартный запрос формы на текущую страницу, который не настроен на получение запросов 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);
      }
    });
  });
});

Answer 2

Метод не разрешен означает, что маршрут не был настроен для GET или, скорее всего, POST, эта ошибка исходит из вашего API, то есть вы не указали в своем маршруте, каким должен быть метод, чтобы он не работал. Я почти уверен, что по умолчанию GET, но если вы звоните POST, он будет жаловаться на вас с этой ошибкой. Не видя ваш API-код, это примерно столько, сколько мы можем оказать.