2020.09.12_django_summernote

2020.09.12_django_summernote적용_정리노트

 

출처 - summernote

 

오늘은 글을 입력받을 때 아무래도 글을 입력받는 느낌이 안들어서 장고에서 만들어진 위젯을 사용하여, 붙여주기로 했다.

 

 

시작을 해봅씨다.. 과연 제대로 할 수 있을 것인가.

 

 

 summer note 설치

 

 

 

pip install django-summernote 를 사용하여, 설치를 해주고, settings.py의 INSTALLED_APPS 으로 가서

 

 

 

 

 

이렇게 django_summernote 를 추가해줌미다

 

 

또한 django 3.X.X 버전 부터 새로 추가된 옵션이 있는데,

 

클릭재킹이라는 옵션에 대한 기본 설정 변경으로 하나를 더 settings.py 에 추가해주어야하는데,

 

 

클릭재킹

UI 수정공격이라고도 하는데, 사용자가 자신이 클릭하고 있다고 인지하는 것과 다른 어떤 것을 클릭하게 해서 속이는 악의적인 기법. 잠재적으로 공격자는 비밀 정보를 유출 시키거나 그들의 컴퓨터에 대한 제어를 획득하게 되는 브라우저 보안 이슈

 

이러한 악용하는 사람들을 막기 위해 django 3 이상 버전에서는 옵션들이 변경되어서 이걸 허용해주어야 한다.

 

setting.py

 

 

settings.py 에 들어가서 이 옵션을 추가해주게 되면, summernote의 로드가 허용된다. 

 

 

 

 

앱을 깔아줬다면!?!??! url로 가서 연결을 해주어야겠쥬 그래서 전체 프로젝트 url을 가서 include 해주었음.

 

media도 사용하기 때문에 media 루트 설정과 밑의 +static 부분을 보고 싶다면, 

 

korinkorin.tistory.com/9

2020.08.27 _Django_ Static , Media _정리

 

 

여기로 가면 자세히 나와있으니 오늘은 생략!

 

 

이제 모델에 적용을 해주기 ㄱㄱ

 

 

admin.py로 가서 admin에서도 관리할 수 있게 해주기

 

 

 

이렇게 해주면 여러 필드 중 content 라는 필드에만 summer 노트가 작동하게 된다. 

 

 

 

 

admin에서 우리가 생성해준 모델인 Post에  확인해보면 잘 뜨는데, 클릭해서 들어가면, 

 

 

 

이렇게 content 부분이 잘 들어간 것을 볼 수가 있음

 

 

근데 그 밑에 Attachments 들어가면 이렇게 뜨게 되는데, 

 

 

 

테이블 오류가 뜨게 된다. 그래서 흠.. 모델을 건드려준게 없는데 어케 마이그레이션을 해주지?

 

 

 

ㅇㅎ 변경내용이 없으니까 그냥 바로 데이터 베이스에 적용해주면 된다. ( 포스팅 적어놓고 한참 헤맸... )

 

바로 python manage.py migrate ㄱㄱ 

 

마이그레이션, 마이그레이트 내용은 요기 밑에 포스팅

 

korinkorin.tistory.com/14

2020.09.01_django_makemigrations,migrate

 

이렇게 바로 데이터 베이스에 적용하게 되면, 

 

 

오류 없이 잘뜬다 ㅎㅁㅎ!! 

 

굿굿 여기는 summernote 모델인데, 나중에 위젯에 속성을 추가하여 추가 매개 변수를 이 모델에 전달할 수 있다. 이 때 data 로 시작하는 모든 속성들은  ** kwargs로 사용자 지정 Attachments 모델의 save (...) 메서드에 전달 된다!

 

쉽게 말해 summernote 의 모델이고 사용자 지정을 이 모델을 통해 해줄 수 있는 뜻인듯 ㅎㅁㅎ 머 다음에 해볼 수 있겠지...ㅎ

 

 

 

 

 

이제 우리 폼상에서도 띄워줘야지! 후후 이렇게 form.py 로 들어가서 딕셔너리 형태로 사용해주게 되면, 

 

 

 

와씨 망할 css .........ㅋㅋㅋㅋㅋㅋㅋ큐ㅠㅠ이 편집기의 높이와 넓이를 설정해주는 방법은 settings에서 기본적으로 주어져있는 SUMMERNOTE_CONFIG 옵션 파일을 가져와서 오버라이딩 해주는 방법과, forms 에서 직접해주는 방법이 있는데 나는 forms로 가서 일단 높이 넓이만 직접 넣어줘보겠음..^)^

 

 

 

 

 

 

이렇게 하게 되면,

 

 

 

허허ㅓ허허허 ㅓ 어제 내가 영혼을 갈아만든 css 는 무시해주시고...쥬륵... 이렇게 높이가 잘 커스텀된다. 이제 작성 테스트

 

작성해주고 게시판으로 가게 되면,

 

 

 

 

 

 

 

오잉 이렇게 html 태그와 함께 뜨게 된다. 이런 html 태그 이스케이핑을 방지하기 위해서 

 

 

 

 

filter safe 를 통해 없애줄수가 있음!  ( 맥북에는 엔터위, 없으면, shift + \ 키 또는 역슬래쉬 ) 

 

 

이렇게 하면,

 

 

 

 

 

html 태그가 사라지게 된다.

 

 

 

홓홓 이제 조금 게시판 느낌 나올 수 있지 않을까 기대하며 이제 게시판 글 생성 꾸미기는 끝일덧 !_! ㅎㅁㅎ 아마도.. 오늘 포스팅 끝끝