const expressSanitizer = require("express-sanitizer"), app.use(expressSanitizer());
// Only requirement is expressSanitizer should be used after bodyParser
In the next lecture, around the 4 minute and 10 second mark, Colt cuts the sanitizer code from the create (post) route. You should leave this code there and copy it instead. Both the create and update routes need the sanitization code.
Also, if you get the Cannot read property 'substring' of undefined error then you have Blog post(s) in the database that don't have a body property. This can be fixed by removing the existing blogs from the database (mongo shell). You can also add client side validation to the form to ensure that the body property gets added by adding the required attribute to the opening <textarea> tag.
(node:11676) DeprecationWarning: Mongoose: `findOneAndUpdate()` and `findOneAndDelete()` without the `useFindAndModify` option set to false are deprecated. See:https://mongoosejs.com/docs/deprecations.html#findandmodify
a) node js에서 호출하는 부분에 옵션 추가
mongoose.connect("mongodb://localhost:27017/restful_blog_app", {useNewUrlParser: true, useUnifiedTopology: true, useFindAndModify: false}); 부분을 app.js에 추가한다.
<div class="description">
<p><%- blog.body.substring(0, 100) %>...</p> <!-- This only shows 100 character of the body-->
</div>
#SHOW time * Add Show route * Add show template * Add links to show page * Style show template
1. Add /blogs/:id route to the app.js
app.get("/blogs/:id", (req, res) => {
// 1) connection test
// res.send("SHOW PAGE!");
// 2) get Id of a particular item and respose, render "show" page for showing detail info of the item
Blog.findById(req.params.id, (err, foundBlog) =>{
if(err){
console.log(err)
res.redirect("/blogs");
} else {
res.render("show", {blog: foundBlog}) // send the particular item's info(name, body, id etc) to show page as name of the blog
}
}) // take 2 arguments(id, callBack)
})
2. Add "More info" button on the index.ejs
: checkout lesson 322
3. Add getting Id info function to the app.get("blogs/:id")
: checkout 1
4. Create show page for showing more info for particular data and design
5. change index for showing only small preview as other websites do
<%= blog.body.substring(0, 100) %>...
<!-- DB에 저장된 blog.body의 일부(0~100번째 글자) 만 출력한다.
미리보기 개념으로 사용하여 사용자에게 일부 내용을 보여준다.-->
6. <html> 태그가 blog.body(text content)에 사용될 수 있도록 하여 모든 글이 하나의 문단으로 출력되는 것을 방지
1) tag change this code
<p><%- blog.body.substring(0, 100) %>...</p> <!-- This only shows 100 character of the body-->
2) Issue of the allow to use <%- %>
<script>alert("I HACKED YOU")</script>
<!--
<html>태그를 사용할 수 있도록 하여 텍스트의 가독성을 높였지만, 반대로 <script>태그가
이용가능해짐에 따라 보안에 문제가 생긴다. 이는 expressSanitizer를 이용하여 방지한다(322강 참조)
-->
Hi Everyone! In the next lecture Colt will introduce a way to shorten text with the .substring() method.
Due to the way the app has been built thus far, this may cause an error for you.
If you get the following error: Cannot read property 'substring' of undefined then you have Blog post(s) in the database that don't have a body property.
This can be fixed by removing the existing blogs from the database (mongo shell).
You can also add client side validation to the form to ensure that the body property always gets added by adding the required attribute to the opening <textarea> tag.
Also, if you're confused on how to traverse folders using the following syntaxes: ./, ../, and /, then see below:
/ means go back to the root folder, then traverse forward/downward.
./ means begin in the folder we are currently in (current working directory) and traverse forward/downward in the tree.
../ means go up one directory, then begin the traverse.
In the next lecture Colt introduces a new format for sending data to the server from a form. Up to this point you have used the name attribute like so:
<'input type="text" name="title"> Now Colt will write it like this: <'input type="text" name="blog[title]">
What this will do is, instead of making the value for title available directly from req.body.title it will put it inside of an object, like so: req.body.blog.title
Now all of the values from the inputs in the form get added into one object (req.body.blog) and you can easily input that data into the database simply by passing in req.body.blog to Blog.create()
Once in the POST route, the req.body.blog object will look something like this: { title: "Hello world", description: "This is a blog post" } I've commented on this further here, including the reason why we use the name="blog[title]" syntax instead of name="blog['title']" or name="blog.title" TL;DR: this syntax is specific to body-parser.
Please let me know if you have any questions by replying to the thread linked above. cheers, Ian
