瀏覽器或代理發送了該服務器無法理解的請求，404 Bad request

Question

我是這個領域的初學者，正在使用 Flask、Python 和 SQLite 准備 CS50 課程的期末項目 3 當我嘗試刪除 position 在列表中排在第一位的問題時出現錯誤，但代碼適用於rest 在不同索引中的問題我不知道如何解決這個錯誤請幫助！！ 先感謝您

我試圖打印每個要刪除的問題的 id。 每個人都被打印出來，除了第一個打印無，這給了我錯誤，即使它出現在應用程序界面中。

這是我的 app.py 代碼

@app.route("/list", methods=["GET", "POST"])
def list():
    if request.method == "POST":
        category = request.form.get("language")
        if category == "All":
            data = db.execute("SELECT * FROM questions")
            question = []
            answer = []
            index = []
            for item in data:
                question.append(item["question"])
                answer.append(item["answer"])
                index.append(item["id"])
            return render_template("list.html", data=zip(question,answer,index))

        if request.form.get("language") == category:
            data = db.execute("SELECT * FROM questions WHERE language=?", category)
            question = []
            answer = []
            index = []
            for item in data:
                question.append(item["question"])
                answer.append(item["answer"])
                index.append(item["id"])
            return render_template("list.html", data=zip(question,answer,index))

    else:
        data = db.execute("SELECT * FROM questions")
        question = []
        answer = []
        index = []
        for item in data:
            question.append(item["question"])
            answer.append(item["answer"])
            index.append(item["id"])
        return render_template("list.html", data=zip(question,answer,index))

@app.route("/delete", methods=["GET", "POST"])
def delete():
    if request.method == "POST":
        index = request.form["delete"]
        print(index)
        db.execute("DELETE FROM questions WHERE id=?", index)
        flash("Questio deleted")
        db.execute("UPDATE questions SET id = id - 1 WHERE id >?", index)
        return redirect("/")
    else:
        data = db.execute("SELECT * FROM questions")
        question = []
        answer = []
        index = []
        for item in data:
            question.append(item["question"])
            answer.append(item["answer"])
            index.append(item["id"])
        return render_template("list.html", data=zip(question,answer,index))

這是我的清單。html

{% extends "layout.html" %}

{% block title %}
    list
{% endblock %}

{% block main %}
    <form action="{{ url_for('list')" method="POST">
        <div class="nestedGrid">
            <div class="language">
                <h2>Languages</h2>
                <button class="list-item" name="language" value="All">ALL</button> <br>
                <button class="list-item" name="language" value="python">PYTHON</button> <br>
                <button class="list-item" name="language" value="c">C</button> <br>
                <button class="list-item" name="language" value="javaScript">JS</button> <br>
                <button class="list-item" name="language" value="java">JAVA</button> <br>
            </div>
            <div class="question">
                <h2>Questions</h2>
                <ul class="list">
                    {% for i, j, z in data %}
                    <li class="list-item panel" name=question_deleted>{{ i }}
                        <span class="tooltiptext">Show answer</span>
                    </li>
                    <li class="list-item panel">{{ j }}</li>
                    <form action="{{ url_for('delete')" method="post">
                        <button class="list-item" name="delete" value="{{ z }}">{{ z }} <i class="fa fa-trash"></i> </button>
                    </form>
                    {% endfor %}
                </ul>
            </div>
        </div>
    </form>
{% endblock %}

我附上了我的代碼的屏幕截圖，我的前端應用程序在這個 repo 中：屏幕截圖

Answer 1

對於面臨相同問題的每個人，問題在於列表和刪除之間的請求重疊，因此我使用以下答案將它們組合在同一路徑中：

來自同一表單的多個請求

我的 app.py 將：

@app.route("/list", methods=["GET", "POST"])
def list():
    if request.method == "POST" and "language" in request.form:
        cat = request.form.get("language")

    if request.form['language'] == cat:
        if cat == 'All':
            data = db.execute("SELECT * FROM questions")
            item = []
            answer = []
            id = []
            for x in data:
                item.append(x["question"])
                answer.append(x["answer"])
                id.append(x["id"])
            return render_template("list.html", data=zip(item,answer,id))
        else:
            py = db.execute("SELECT * FROM questions WHERE language = ?", cat)
            py_ques = []
            py_answer = []
            py_id = []
            for i in py:
                py_ques.append(i["question"])
                py_answer.append(i["answer"])
                py_id.append(i["id"])
            return render_template("list.html", data=zip(py_ques,py_answer,py_id))

if request.method == "POST" and "deleted" in request.form:
    id = request.form.get("deleted")
    db.execute("DELETE FROM questions WHERE id=?", id)
    flash("question deleted")
    # rearange ids after deleting a question
    db.execute("UPDATE questions SET id = id - 1 WHERE id > ?", id)
    return redirect("/")

else :
    data = db.execute("SELECT * FROM questions")
    item = []
    answer = []
    index=[]
    for x in data:
        item.append(x["question"])
        answer.append(x["answer"])
        index.append(x["id"])
    return render_template("list.html", data=zip(item,answer,index))

和 list.html 將：

{% extends "layout.html" %}

{% block title %}
    LIST
{% endblock %}

{% block main %}
    <form action = "/list" method="post">
        <div class="nestedGrid">
            <div class="language">
                <h2>Languages</h2>
                <button class="list-item" name="language" value="All">ALL</button> <br>
                <button class="list-item" name="language" value="python">PYTHON <i class="fab fa-python"></i> </button> <br>
                <button class="list-item" name="language" value="C">C </button><br>
                <button class="list-item" name="language" value="javaScript">JS <i class="fab fa-js"></i></button><br>
                <button class="list-item" name="language" value="java">JAVA <i class="fab fa-java"></i></button><br>
            </div>
            <div class="question">
                <h2>Questions</h2>
                <ul class="list">
                    {% for i, j, z in data %}
                        <li class="list-item accordion" name="question_deleted" value="{{ i }}">{{ i }}
                            <span class="tooltiptext">Show answer</span>
                        </li>
                        <li class="list-item panel" value="{{ j }}">{{ j }}</li>
                        <button class="list-item" name="deleted" value="{{ z }}"><i class="fa fa-trash" ></i></button>
                    {% endfor %}
                </ul>
            </div>
        </div>
    </form>
{% endblock %}

我希望這有幫助