Flask error: Method Not Allowed The method is not allowed for the requested URL

Everytime I register a new person in my website, it appears the “Method Not Allowed The method is not allowed for the requested URL.” Page. Can anyone help me? /// Toda vez que eu cadastro uma nova pessoa no meu site, aparece a página “Method Not Allowed. The method is not allowed for the requested URL.” Alguém pode me ajudar?

main.py:

from flask import Flask, render_template, redirect, request
from flask_sqlalchemy import SQLAlchemy

app = Flask(__name__)
app.config['SQLALCHEMY_DATABASE_URI'] = 'sqlite:///bancodados.db'

db = SQLAlchemy(app)

class Contato(db.Model):
    id = db.Column('id', db.Integer, primary_key=True, autoincrement=True)
    nome = db.Column(db.String(100))
    email = db.Column(db.String(100))

    def __init__(self, nome, email):
        self.nome = nome
        self.email = email

@ app.route('/', methods=['GET', 'POST'])
def home():
    if request.method == 'POST':
        contato = Contato(request.form['nome'], request.form['email'])
        db.session.add(contato)
        db.session.commit()
        return redirect('https://salvacontato.rj.r.appspot.com/lista')
    return render_template('add.html')

@ app.route('/lista')
def lista():
    return render_template('lista.html')

if __name__ == "__main__":
    db.create_all()
    app.run(debug=True)

add.html:

<!DOCTYPE html>
<html lang="pt-BR">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Registrar Contato</title>
    <style>
        #log {
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            padding: 50px;
            position: absolute;
            color: white;
            background-color: rgba(0, 0, 0, 0.808);
            border-radius: 30px;
            font-family: sans-serif;
        }
        body {
            background-image: linear-gradient(25deg, rgb(167, 167, 245), rgb(86, 86, 255));
        }
        input {
            padding: 13px;
            outline: none;
        }
        button {
            background-color: dodgerblue;
            border: none;
            border-radius: 15px;
            padding: 15px;
            width: 100%;
        }
    </style>
</head>
<body>
    <div id="log">
        <h2>Registrar Contato</h2>
        <form action="lista" method="POST">
            <input type="text" name="nome" id="nome" placeholder="Nome do Contato">
            <br><br>
            <input type="text" name="email" id="email" placeholder="Email do Contato">
            <br><br>
            <button type="submit">Enviar</button>
        </form>
    </div>
    
</body>
</html>

lista.html:

<!DOCTYPE html>
<html lang="pt-BR">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Contatos</title>
</head>

<body>
    <h1>Lista de contatos</h1>
    <a href="/">Adicionar Contato</a>
    <table>
        <thead>
            <tr>
                <th>Nome</th>
                <th>Email</th>
            </tr>
        </thead>
        <tbody>
            {% for e in contatos %}
            <tr>
                <td>{{e.nome}}</td>
                <td>{{e.email}}</td>
            </tr>
            {% endfor %}
        </tbody>
    </table>
        
</body>

</html>

Answer

You have

<form action="lista" method="POST">

so you send form to /lista but you should send it to /

<form action="/" method="POST">

You can even skip action="/" and it should send back to /

<form method="POST">

Advertisement

Answer