인프런 커뮤니티 질문&답변

안녕하세요 강사님 강의 잘 복습하고 있습니다. 

복습중에 antd를 사용하지는 않고 한번 파일을 업로드

해보려 시도중인데 파일(이미지, 문서) 업로드시 아래와 같은

에러가 발생하여 문의드립니다.. ㅜㅜ

위 파일을 제외하고는 장고에 포스트가 잘 작성되는데.. 

해당 파일을 포함하면 위와 같은 에러메시지가 발생합니다.

 

const onChangeTitle = (e) => {
        setTitle(e.target.value)
    }
    console.log(title)
    const onChangeCategory = (e) => {
        setCategory(e.target.value)
    }
    console.log(category)

    const onChangeContent = (e) => {
        setContent(e.target.value)
    }
    console.log(content)

    const handleFileCapture = async (e) => {
        await Setuploadfile({[e.target.name]: e.target.files[0]})
    };
    console.log({attachedfile})

    const handleImageCapture =async (e) => {
        await SetuploadImage({[e.target.name]: e.target.files[0]})
    };
    console.log({coverimg})

    const handleChange = (e) => {
        setChecked(e.target.checked);
    };
    console.log('is_public : ', {checked})




const onSubmit = (e) => {
    e.preventDefault()

    const formData = new FormData();
    formData.append("title", title);
    formData.append("category", category);
    formData.append("content", content);
    formData.append("attached_file", attachedfile);
    formData.append("cover_img", coverimg);
    formData.append("is_public", checked)
    console.log('formData :', formData)

    const headers = {
        Authorization: `JWT ${jwtToken}`,
        "Content-Type": "multipart/form-data",
    };

    Axios.post("http://127.0.0.1:8000/api/posts/", formData, {headers})
        .then(response => {
            history.push('/')
            console.log(response['status'])
        })
        .catch(error => {
            console.log(error.response)
        })
};

위 console.log로 찍어보면 내용이나 파일 값(상태값)은

잘 반영되는거 같은데..  submit만 하면 에러가 발생합니다.ㅜㅜ 

 

 

위는 리액트단 코드이고

아래는 장고입니다.

- models.py

class Post(BaseModel):
	author = models.ForeignKey(settings.AUTH_USER_MODEL, on_delete=models.CASCADE, related_name='post_author')
	category = models.CharField(max_length=100, default='all')
	title = models.CharField(max_length=100, default='')
	content = models.TextField(default='')
	attached_file = models.FileField(blank=True, upload_to="shareinfo/post/cover/%Y/%m/%d", verbose_name='Attached File')
	cover_img = models.ImageField(blank=True, upload_to="shareinfo/post/cover/%Y/%m/%d", verbose_name='Cover Image')
	post_tag_set = models.ManyToManyField('Tag', blank=True)
	like_user_set = models.ManyToManyField(settings.AUTH_USER_MODEL, blank=True, related_name='post_likes')
	ip = models.GenericIPAddressField(null=True, editable=False)
	is_public = models.BooleanField(default=True)

 

- serializer.py

class PostSerializer(ModelSerializer):
	author = AuthorSerializer(read_only=True)
	is_like = serializers.SerializerMethodField("post_likes_field", read_only=True)
	post_tag_set = serializers.CharField(source='extract_tag_list', read_only=True)

	class Meta:
		model = Post
		fields = ['author', 'is_like', 'post_tag_set', 'title', 'category', 'content', 'attached_file', 'cover_img', 'is_public']

	def post_likes_field(self, post):

 

-views.py

class PostViewSet(ModelViewSet):
	queryset = Post.objects.all().filter(is_public=True)
	parser_classes = [MultiPartParser, FormParser]
	serializer_class = PostSerializer

	def get_queryset(self):
		qs = super().get_queryset()
		qs = qs.filter(
			Q(author=self.request.user) |
			Q(author__in=self.request.user.following_set.all())
		)
		return qs

	def perform_create(self, serializer):
		serializer.save(author = self.request.user, ip=self.request.META['REMOTE_ADDR'])
		return super().perform_create(serializer)

 

파일이 어떠한 형식으로 변환되어야지 장고에 저장이 되는거같은데... 어렵습니다..