장고

개발 일지 37 - 게시글 이미지 추가..3

sorecord 2024. 9. 20. 08:46

이제 ajax에서 url로 연결한 뷰함수를 작성할 차례이다

 

 

@csrf_exempt  # CSRF 보호를 비활성화 (API 엔드포인트에 필요할 수 있음)
def post_upload_image(request):
    if request.method == 'POST' and request.FILES.get('image'):
        image = request.FILES['image']
        fs = FileSystemStorage()
        filename = fs.save(image.name, image)
        file_url = fs.url(filename)
        file_url_with_book = f"/book/media/{filename}"
        return JsonResponse({'location': request.build_absolute_uri(file_url_with_book)})
    return JsonResponse({'error': 'No file uploaded.'}, status=400)

 

 

간단히 이 코드를 설명하자면  Django에서 이미지를 서버에 업로드하고 업로드된 이미지의 URL을 JSON 형식으로 반환하는 API 엔드포인트를 정의한 것이다.

 

일단 조건문으로 요청이 POST 방식이고, 요청에 이미지 파일이 포함되어 있는지 확인해준다.

 

업로드한 image를 image변수에 저장을 해주고  Django의 FileSystemStorage 클래스를 사용하여 파일을 저장할 수 있는 객체를 생성해준다.

 

이 객체는 서버의 파일 시스템에 파일을 저장하고 관리하는 데 사용된다.

 

 fs.save() 메서드를 사용하여 파일을 서버에 저장한다. (첫 번째 인자는 저장할 파일의 이름, 두 번째 인자는 저장할 파일 객체)

 

저장된 파일의 URL을 생성해준다. 나같은 경우는 book/경로를 추가해주어야 해서 추가해주었다. 그렇지 않은 경우 그냥 file_url을 사용해도 된다. 

 

마지막으로 'location' 키에 업로드된 이미지의 절대 URL을 담아 반환한다.. request.build_absolute_uri()는 상대 URL을 절대 URL로 변환한다. ==>> 상대 URL의 경우 현재 페이지에 따라 해석이 된다. 페이지의 경로가 변경되거나 다른 도메인으로 이동하면 상대 URL이 정확한 리소스를 가리키지 않을 수 있다. 반면 절대 URL은 항상 동일한 리소스를 가리키기에 절대 URL을 사용

 

절대 URL : 리소스의 전체 경로를 포함하는 URL입니다. 프로토콜, 도메인 이름, 경로 등 모든 정보를 포함

예>http://www.example.com/images/photo.jpg

 

상대 URL : 현재 문서의 위치를 기준으로 리소스를 참조하는 URL입니다. 도메인이나 프로토콜 정보를 포함하지 않는다.

예>/images/photo.jpg (현재 도메인 아래의 이미지)      /    images/photo.jpg (현재 경로에서 images 폴더 내의 이미지)

 

 

path('post_upload_image/', views.post_upload_image, name='post_upload_image'),

 

url.py에 해당 코드도 추가해주어야 한다. 

 

이처럼 코드를 구현하였을때 tinymce에서 이미지를 추가할 수 있었다.