블로그에 포스팅한 글, SNS에 쓴 글 등은 수정하거나 삭제할 필요가 생긴다. 지난 포스팅(7.1)에서 글 쓰기 기능을 다루었으니 이번 포스팅에서는 글을 수정하거나 삭제할 수 있는 기능을 만들어보자.
7.2.1. 컨텐츠 수정
먼저 글을 수정하는 과정을 생각하고 정리해보자.
DB에서 글을 읽어온다.
↓
읽어온 글을 페이지에 수정 가능한 형태로 보여준다.
↓
수정된 글을 다시 DB에 저장한다.
웹 서비스로 구현하기 위해 위 과정을 모델/폼-뷰-로직(MVC 또는 MVL) 형태로 재구성 해보자.
● 모델/폼: DB에서 글을 읽어올 때 데이터의 틀인 모델이 필요하고, 페이지를 통해 수정된 내용을 입력받을 때 입력 틀인 폼이 필요하다. 하지만 수정의 대상은 저장되어 있는 글이다. 따라서 글을 생성할 때 정의했었던 모델과 폼을 그대로 적용하면 된다.
● 뷰: 포스팅에서 수정의 대상은 제목, 본문 등이다. 글 쓴 사람, 생성 시간 등은 기존의 데이터에서 변화가 없고, 더 추가되는 요소들도 없다. 따라서 글 쓰기 페이지를 다시 활용할 수 있다.
● 로직: '글 수정하기' 링크를 클릭하면 서버의 DB에서 글을 찾아서 가져오고 그 내용을 수정하기 페이지를 통해 보여준다. 그리고 사용자가 수정을 마치고 '수정하기' 버튼을 클릭하면 입력받은 내용을 다시 DB에 저장한다. 이 두 가지 기능을 수행할 로직을 새로 만들어야 한다.
이제 MVL 세 요소들을 실제 코드로 만들어 컨텐츠 수정 기능을 구현해보자.
기존의 05_posting 프로젝트를 그대로 이용하고 컨텐츠 수정 기능을 새로 추가할 것이다.
● 모델/폼
post 패키지의 폼 클래스(appmain/post/forms.py), 모델 클래스(appmain/post/models.py)를 그대로 사용하면 된다.
● 뷰
기존 글을 수정할 페이지는 글 쓰기 페이지(appmain/templates/create_post.html)를 다시 활용할 수 있다. 글 수정하기/삭제하기 버튼이 있는 글 관리 페이지가 필요하다. 글 제목을 클릭하면 글 관리 페이지로 이동할 수 있게끔 글 제목을 링크로 바꾸어 주자.
글 제목을 글 관리 페이지로 이동할 수 있는 링크로 바꾸기. 글은 서비스의 메인 페이지에 게시되므로 home.html 파일을 수정한다.
▶ appmain/templates/home.html
{%extends "layout.html"%}
{%block content%}
{%for post in posts%}
<!-- 하이퍼링크로 수정된 글 제목 -->
<h1><a href="/post/{{post.id}}">{{post.title}}</a></h1>
<!-- -->
<p>{{post.content}}</p>
<p>By {{post.author}} on {{post.datePosted}}</p>
{%endfor%}
{%endblock content%}
글 관리 페이지를 아래와 같이 구현하자.
▶ appmain/templates/post.html
{% extends "layout.html" %}
{% block content %}
<div>
<p>{{post.title}}</p>
<p>{{post.content}}</p>
<p>{{post.date_posted}}</p>
<!-- 로그인한 사용자가 글의 저자와 같을 때만 '수정하기' 링크를 보여준다. -->
{%if current_user.is_authenticated%}
{%if current_user.username == post.author%}
<div>
<a href="/post/{{post.id}}/update">Update Post</a>
</div>
{%endif%}
{%endif%}
</div>
{% endblock content %}
글 관리 페이지에서는 글의 내용을 보여주고 수정할 수 있는 'Update Post' 링크를 제공한다. 이 Update Post 링크는 로그인한 사용자가 글을 작성한 사람과 같은 경우에만 보여준다.
● 로직
글 수정하기 작업을 정리해보면 아래와 같은 과정으로 진행된다.
글의 제목을 클릭했을 때 글 관리 페이지(post.html)를 보여준다.
↓
글 관리 페이지에서 사용자가 '수정하기' 버튼을 클릭하면 글을 수정할 수 있는 뷰(create_post.html를 다시 활용한다)를 보여준다.
↓
글 수정을 마치고 '제출하기' 버튼을 클릭하면 그 내용을 DB에 저장하도록 구현한다.
컨텐츠 관리와 관련된 내용이므로 post 패키지의 페이지 처리 로직(appmain/post/routes.py)에 필요한 로직을 코딩하자.
▶ appmain/post/routes.py
from flask import render_template, url_for, redirect, request, abort, Blueprint
from flask_login import current_user, login_required
from appmain import db
from appmain.post.forms import PostForm
from appmain.post.models import Post
post = Blueprint('post', __name__)
@post.route("/post/new", methods=['GET', 'POST'])
@login_required
def newPost():
...
#### 글 제목 링크를 클릭하면 글 관리 페이지를 보여준다.
#### 제목 링크에 글의 ID(postId)를 포함하도록 만들어서 이 ID를 이용해서 DB에서 글을 가져온다.
@post.route("/post/<int:postId>")
def displayPost(postId):
content = Post.query.get_or_404(postId)
return render_template('post.html', title = content.title, post = content)
#### 글 관리 페이지에서 수정하기(update) 링크를 클릭하면 수정 페이지를 보여준다.
@post.route("/post/<int:postId>/update", methods=['GET', 'POST'])
####글 관리 페이지로 접근하기 전에 먼저 로그인되어 있는지 확인한다.
@login_required
def updatePost(postId):
#### 글을 가져온다. 글이 없다면 '페이지 없음(404)'오류를 발생시킨다.
content = Post.query.get_or_404(postId)
#### 글 저자와 로그인한 사용자가 다르다면 '권한없음(403) 오류를 발생시킨다'
if content.author != current_user.username:
abort(403)
form = PostForm()
#### 사용자가 '제출' 버튼(링크)을 클릭한 경우
if form.validate_on_submit():
content.title = form.title.data
content.content = form.content.data
db.session.commit()
print("A post is updated: ", content.title)
return redirect(url_for('main.home'))
#### '제출' 버튼(링크)이 클릭된 경우가 아니면 수정 페이지를 준비한다.
elif request.method == 'GET':
#### 이전에 썼던 글의 제목과 본문을 폼의 제목과 본문에 넣어 보여준다.
form.title.data = content.title
form.content.data = content.content
#### 글 수정 페이지를 보여준다.
return render_template('create_post.html', title='Update Post', form=form)
글에서는 모델/폼 - 뷰 - 로직 순서로 막힘없이 진행(서술)했지만 실제 실습을 해보면 아직 익숙하지 않은 부분들이 많아서 천천히 진행하게 될 것이다. 위 코드들을 참고해서 연습을 거듭하다보면 점점 더 익숙해져서 개발 속도도 빨라질것이다.
이제 프로젝트를 저장하고 구현한 글 수정하기 기능을 점검해보자.
프로제트를 실행시키고(프로젝트의 run.py 파일을 실행) 웹 브라우저로 127.0.0.1:5000 주소로 접근한다. 아래 그림은 글을 포스팅한 사용자로 로그인한 후 홈 페이지 화면이다.
글 제목을 클릭하면 아래 그림과 같이 글을 관리할 수 있는 페이지로 이동된다.
글 수정하기(Update Post) 링크를 클릭해서 글을 수정할 수 있는 페이지로 이동하자. 아래와 같이 글 내용을 한 번 수정해보자.
수정하기(Post) 버튼을 클릭하면 웹 서비스의 메인(홈) 페이지로 이동할 것이다. 글이 정상적으로 수정되었음을 확인해 볼 수 있다.
참고로 윈도우 커맨드 윈도우를 통해 DB에 접속해보면 내용이 수정되어 있음을 확인해 볼 수 있다.
■
'파이썬 웹 서비스 만들기' 카테고리의 다른 글
8. 컨텐츠를 여러 페이지로 나누어 보여주기 (0) | 2020.11.26 |
---|---|
7. 컨텐츠 포스팅 및 관리기능 - 7.3. 컨텐츠(글) 삭제기능 (0) | 2020.11.17 |
7. 컨텐츠 포스팅 및 관리기능 - 7.1. 포스팅 (0) | 2020.10.30 |
6. 파이참 프로젝트 실행 - Run 'run (x)' (0) | 2020.10.19 |
5. 계정 관리 페이지 - 5.3. 계정 삭제 기능 (0) | 2020.10.17 |
댓글