TIL | 11.8.화 [Django : DRF]

- Django Rest Framework

🔥 사용자가 선택한 노래 장르를 기반으로 비슷한 장르의 노래 추천시스템 프로젝트

해당 프로젝트 Git link : https://github.com/wonprogrammer/B2_IIEII_DRF.git

---

[프로젝트를 진행하면서 생겼던 문제]

트러블 슈팅

목차

1. 플레이 리스트 생성 문제
2. many to many 필드 serializer
3. 플레이리스트 상세페이지 이동 시 id값 특정
4. 프론트 페이지 이동 문제
5. 한 페이지에서 serializer 2개 이상의 데이터 받아오기
6. base.html

---

1. 플레이 리스트 생성 문제

1. 문제

• 사용자가 여러개의 플레이리스트를 가질 수 있지만 메인페이지에서 노래를 추천받기 위해서 사용자의 메인 플레이리스트 라는 개념이 필요

2. 해결

• 로그인 후 처음 노래를 고르는 페이지에서 생성되는 플레이리스트를 대표 플레이 리스트로 지정하고 이것을 구분하기 위해 boolean Field로 is_main이라는 필드 생성

user_musicplaylist_create_serializer.save(playlist_user=request.user, is_main=True)

---

2. many to many 필드 serializer

1. 문제

• 데이터를 보낼 때 ID값으로 보내짐

2. 해결

• 해당 필드에 대한 serializer를 한번 더 진행

 

---

3. 플레이리스트 상세페이지 이동 시 id값 특정

1. 문제

• 플레이리스트 개별 조회시 playlist_id를 특정하여 이동하기 어려운 문제
• playlist_id를 fetch의 url에 연결할 수 있어야함

2. 해결

• URL 내부에서 물음표(?) 뒤에 붙이는 쿼리스트링을 활용한다
• 띄울 HTML 주소 뒤에 플레이리스트 ID값을 파라미터로 전달

• URL에 있는 playlist_id 값을 꺼내와 fetch함수에 전달

---

4. 프론트 페이지 이동 문제

1. 문제

• 회원가입시 정보를 입력하고 로그인 페이지로 넘어가지 않은 현상

2. 해결

• fetch()함수의 .then 함수로 객체를 리턴 받아 문제 해결

if (password_valid(password, password2)) {
       const response = await fetch('your url', {
           headers:{
               'content-type' : 'application/json',
           },
           method:'POST',
           body: JSON.stringify({
               "email":email,
               "username":username,
               "password":password,
           })
       }).then(window.location.replace("login.html"))
       alert("가입되었습니다!")
       console.log(response)
   }
   else {
       console.log("제출하지 않음")
       window.location.reload()
   }

---

5. 한 페이지에서 serializer 2개 이상의 데이터 받아오기

1. 문제

• 한 페이지 내에서 2개 이상의 serializer로 검증한 데이터를 받아오는 못했음

2. 해결

• views.py 에서 serializer 한 data 데이터를 dictionary 형태로 2개 이상 넣어주고 response에 전달 

  

---

6. base.html

1. 문제

• DRF Front 개발은 아래 코드와 같이 Django Templates Languege 에서 썼던 Templates 상속이 불가능했다.

{% block title %}{% endblock title %}
    {% block content %}

    {% endblock %} 

2. 해결

• 그래서 작업해둔 base.html 모든 html에 붙여주었고, Templates 상속과 다르게 상속되는 html 페이지에 있는 기능만 사용할 수 있는것이 아니였기 때문에 각각의 페이지에 맞게 커스텀마이징해줘서 더욱 간편하게 페이지를 이용할 수 있게 되었다.