J'ai écrit un fichier server.py qui peut enregistrer les noms, les numéros d'index et les notes moyennes des étudiants. Lorsque j'exécute le fichier client.html, que je saisis les données et que je clique sur Ajouter un étudiant, il indique que l'étudiant a été ajouté avec succès, mais lorsque j'entre son index pour utiliser la fonction Obtenir des étudiants, il indique 404 Student Not Found.
Voici le code du fichier server.py :
from flask import Flask, request, jsonify
import pickle
app = Flask(__name__)
try:
with open('students.pickle', 'rb') as f:
students = pickle.load(f)
except FileNotFoundError:
students = {}
@app.route("/")
def index():
with open("client.html") as f:
return f.read()
@app.route('/add_student', methods=['POST'])
def add_student():
name = request.form.get('name')
surname = request.form.get('surname')
index = request.form.get('index')
grade = request.form.get('grade')
students[index] = {'name': name, 'surname': surname, 'index': index,'grade': grade}
with open('students.pickle', 'wb') as f:
pickle.dump(students, f)
return jsonify(message='Student added successfully'), 201
@app.route('/get_student/<int:index>', methods=['GET'])
def get_student(index):
student = students.get(index)
if student:
return jsonify(student)
else:
return 'Student not found', 404
if __name__ == '__main__':
app.run(host='localhost', port=8000, debug=True)
Voici le code du fichier client.html :
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-3.6.0.min.js"></script>
<script>
$(document).ready(function() {
function getStudent() {
var index = $("#index").val();
$.ajax({
type: "GET",
url: "http://localhost:8000/get_student/" + index,
success: function(data) {
$("#student-info").text(JSON.stringify(data));
},
error: function() {
$("#student-info").text("Student not found");
}
});
}
function addStudent() {
var data = new FormData();
data.append("name", $("#name").val());
data.append("surname", $("#surname").val());
data.append("index", $("#index").val());
data.append("grade", $("#grade").val());
$.ajax({
type: "POST",
url: "http://localhost:8000/add_student",
data: data,
processData: false,
contentType: false,
success: function(data) {
$("#add-student-result").text("Student added");
},
error: function() {
$("#add-student-result").text("Error adding student");
}
});
}
$("#get-student-form").submit(function(e) {
e.preventDefault();
getStudent();
});
$("#add-student-form").submit(function(e) {
e.preventDefault();
addStudent();
});
});
</script>
</head>
<body>
<form id="get-student-form">
<label for="index">Index:</label>
<input type="text" id="index" name="index">
<button type="submit">Get Student</button>
</form>
<div id="student-info"></div>
<br>
<form id="add-student-form">
<label for="name">Name:</label>
<input type="text" id="name" name="name">
<br>
<label for="surname">Surname:</label>
<input type="text" id="surname" name="surname">
<br>
<label for="index">Index:</label>
<input type="text" id="index" name="index">
<br>
<label for="grade">Grade:</label>
<input type="text" id="grade" name="grade">
<br>
<button type="submit">Add Student</button>
</form>
<div id="add-student-result"></div>
</body>
</html>
![[Web front-end] Démarrage rapide de Node.js](https://img.php.cn/upload/course/000/000/067/662b5d34ba7c0227.png)
Dans la page html, vous avez donné le même identifiant aux deux éléments (index set box et get box), donc le code ne recherche que le premier élément, donc l'index dans le dictionnaire sera égal à " " et le code ne recherche pas Je ne le trouve pas.
EDIT : Un autre bug est que l'index doit être une chaîne, dans la fonction get, il doit s'agir d'une chaîne. [Faites simplement index = str(index)]
J'espère que cela vous aidera.