所以我有一项让用户发布书评的服务。我自己也发过两篇。在我的数据库中,我跟踪他们在提交帖子时输入的用户名。
出于某种奇怪的原因,它会让我在“主页”上过滤我在自己的计算机上本地创建的任何作者姓名的评论,但不能过滤外国用户输入的任何作者的评论。有人有什么想法吗?
这是我后端的相关代码:
//Get All Posts
app.get("/", async (req, res) =>{
let data = await db.query("SELECT * FROM posts");
posts = data.rows;
console.log(posts);
res.render("index.ejs",{
posts: posts,
});
});
//Get all posts in order of ascending ID
app.get("/asc", async (req, res) =>{
let data = await db.query("SELECT * FROM posts ORDER BY id ASC");
posts = data.rows
console.log(posts)
res.render("index.ejs",{
posts: posts,
});
});
// Get all posts in order of descending ID
app.get("/desc", async (req, res) =>{
let data = await db.query("SELECT * FROM posts ORDER BY id DESC");
posts = data.rows
console.log(posts)
res.render("index.ejs",{
posts: posts,
});
});
// Load the new entry page
app.get("/add", async (req, res) =>{
res.render("new.ejs")
});
// Add entry to database
app.post("/submit", async (req, res) =>{
let author = req.body.author;
let book = req.body.book;
let review = req.body.review;
let rating = req.body.rating;
const result = await axios.get(`https://openlibrary.org/search.json?q='%'||${book}||'%'&limit=1`);
let coverID = result.data.docs[0].cover_edition_key;
const fullDate = new Date()
const day = fullDate.getDate()
const month = fullDate.getMonth() + 1
const year = fullDate.getFullYear()
let date = `${day}/${month}/${year}`
await db.query("INSERT INTO posts (author, date, descr, rating, book_auth, cover_id) VALUES ($1, $2, $3, $4, $5, $6)",
[author, date, review, rating, book, coverID] );
res.redirect("/");
});
//Load the update page
app.get("/update:id", async (req, res) =>{
let id = req.params.id;
let data = await db.query("SELECT * FROM posts WHERE id = ($1)",[id]);
let posts = data.rows[0];
res.render("new.ejs", {
posts: posts,
});
console.log(posts)
});
//Update post
app.post("/edit:id", async (req, res) =>{
let id = req.params.id;
let author = req.body.author;
let book = req.body.book;
let review = req.body.review;
let rating = req.body.rating;
await db.query("UPDATE posts SET author = ($1), descr = ($2), rating = ($3), book_auth = ($4) WHERE id = ($5)", [author, review, rating, book, id]);
res.redirect("/");
})
//Filter by author of Review
app.get("/author/:auth", async (req, res) =>{
let author = req.params.auth;
let data = await db.query("SELECT * FROM posts WHERE author ILIKE ($1) AND author IS NOT NULL AND author != ''", [author]);
let posts = data.rows;
console.log(author);
res.render("index.ejs", {
posts: posts,
});
});
//Delete post
app.get("/delete:id", async (req, res) =>{
let id = req.params.id;
await db.query("DELETE FROM posts WHERE id = ($1)", [id]);
res.redirect("/");
});
这是我的index.EJS中的代码:
<% posts.forEach(post => { %>
<section class="Posts">
<div class="leftSide">
<!--If coverID = Null, render a placeholder cover saved in public images folder-->
<% if(post.cover_id === null){ %>
<img class="book-cover" src="/images/images.png">
<!--Otherwise, fetch the cover for the book using the open library API-->
<% } else { %>
<img class="book-cover" src="https://covers.openlibrary.org/b/olid/<%= post.cover_id %>-L.jpg" alt="Book Cover">
<% } %>
</div>
<!--On right side, EJS templating displays the details for each post-->
<div class="rightSide">
<div class="postContainer">
<a class="authorTag" href="/author/<%= post.author %>"><h3 class="author"><%= post.author %>'s</a> Review of:</h3>
<h2 class="book-author"><%= post.book_auth %></h2>
<div class="divider"></div>
<p class="review"><%= post.descr %></p>
<div class="divider"></div>
<div class="rating-updateBox">
<p class="rating">Rating: <%= post.rating %>/10</p>
<a href="/update<%= post.id %>"><button class="update-Button">Update</button></a>
</div>
<div class="date-deleteBox">
<p class="date"><%= post.date %></p>
<a href="/delete<%= post.id %>"><button class="delete-Button">Delete</button></a>
</div>
</div>
</div>
</section>
<% });%>
这是我的new.EJS,其中添加了新帖子
<!--If there is a post, render the update post form instead of the new post form-->
<% if(locals.posts){ %>
<form action="/edit<%= posts.id %>" method="post">
<div id="infoBox">
<p class="info">Your Name</p>
<p class="info">Book Name</p>
</div>
<div id="auth-titleBox">
<input id="newAuthor" type="text" name="author" placeholder="Write YOUR name here." required value="<%= posts.author %>">
<input id="newTitle" type="text" name="book" placeholder="Write the name of the book here." required value="<%= posts.book_auth %>">
</div>
<div class="divider"></div>
<textarea id="newDesc" name="review" placeholder="Write your review here." required><%= posts.descr %></textarea>
<div class="divider"></div>
<input id="rating" name="rating" type="number" min="0" max="10" placeholder="Rating" required value="<%= posts.rating %>">
<input id="submit" type="submit">
</form>
<% } else { %>
<!--New post form-->
<form action="/submit" method="post">
<div id="infoBox">
<p class="info">Your Name</p>
<p class="info">Book Name</p>
</div>
<div id="auth-titleBox">
<input id="newAuthor" type="text" name="author" placeholder="Write YOUR name here." required>
<input id="newTitle" type="text" name="book" placeholder="Write the name of the book here." required>
</div>
<div class="divider"></div>
<textarea id="newDesc" name="review" placeholder="Write your review here." required></textarea>
<div class="divider"></div>
<input id="rating" name="rating" type="number" min="0" max="10" placeholder="Rating" required>
<input id="submit" type="submit">
</form>
<% } %>
在前端显示帖子详细信息时,每个帖子的顶部都会显示评论的作者姓名。该名称是一个 href,其中包含帖子作者的姓名作为参数。然后,在后端,我解析该参数并渲染数据库中作者姓名与解析的参数匹配的所有帖子。这有效,但仅适用于我在我的机器上创建的作者。不适用于其他用户创建的任何作者名称,尽管这些作者值已保存到我的数据库中,因为我可以在表中的 pgAdmin 中看到它们。
我发现了问题。只是想我会发布这个以防有人遇到同样的问题。
用户输入了作者姓名,并在姓名的最后一个字符后添加了空格。这导致了这个问题。我刚刚在变量末尾添加了一个 .trim() 方法,该方法解析了将帖子添加到数据库的路线中的作者输入。这已经解决了问题。
// Add entry to database
app.post("/submit", async (req, res) =>{
let author = req.body.author.trim();
谢谢