4 글 보임 - 1 에서 4 까지 (총 4 중에서)
-
글쓴이글
-
2024년 4월 29일 12:39 #121580
박병주참가자강의 잘 보고 있습니다 선생님 타슼으로 한번 더 정독중인데 cors 관련 질문 하나만 드립니다. 'use client'
import { useState } from "react";
interface UploadResponse { url: string; fields: Record<string, string>; }
export default function Write(){ let [src,setSrc] = useState("") return ( <div className="p-20"> <form action="/api/post/write" method="POST"> <input name="title" placeholder="글제목"/> <input name="content" placeholder="글내용"/> <input type="file" accept="image/*" onChange={async(e)=>{ if(e.target.files && e.target.files.length > 0){ let file = e.target.files[0] let filename = encodeURIComponent(file.name) let res = await (await fetch('/api/post/image?file=' + filename)).json() as UploadResponse; //S3 업로드 const formData = new FormData() // 기존 코드에서 file을 별도로 처리 formData.append('file', file);
// 나머지 fields 추가 Object.entries(res.fields).forEach(([key, value]) => { if (typeof value === 'string') { formData.append(key, value); } }); let 업로드결과 = await fetch(res.url, { method: 'POST', body: formData, }) console.log(업로드결과) setSrc(업로드결과.url + '/' + filename) } }}/> < img src={src}/> <button type="submit">전송</button> </form> </div> ) } console.log(res) 치면 url이랑 잘 나오는 상태이고 aws에서 cors 처리 해주었는데도 업로드결과 콘솔 로그에 치면 콘솔에 cors 에러가 뜨는 상황입니다 Response {type: 'cors', url: 'https://s3.ap-northeast-2.amazonaws.com/zzuzzustudy', redirected: false, status: 400, ok: false, …} body: (...) bodyUsed: false headers: Headers {} ok: false redirected: false status: 400 statusText: "Bad Request" type: "cors" url: "https://s3.ap-northeast-2.amazonaws.com/zzuzzustudy" [[Prototype]]: Response 이렇게 뜹니다
-
이 게시글은
박병주에 의해 1 년, 2 월 전에 수정됐습니다.
2024년 4월 29일 19:36 #121650
박병주참가자[ { "AllowedHeaders": [ "*" ], "AllowedMethods": [ "PUT", "POST" ], "AllowedOrigins": [ "*" ], "ExposeHeaders": [ "ETag" ] } ]
현재 이렇게 해놓은 상태입니다
2024년 4월 30일 09:02 #121685
codingapple키 마스터그럼 서버에서 보내주는 url이 이상할수도요 res.url 같은거에 이미지이름 들어간 url 잘나오나 출력해봅시다
-
이 게시글은
-
글쓴이글
4 글 보임 - 1 에서 4 까지 (총 4 중에서)
- 답변은 로그인 후 가능합니다.