• 로그인
  • 장바구니에 상품이 없습니다.

home2 게시판 Next.js 게시판 AWS S3이미지 업로드 질문입니다.

AWS S3이미지 업로드 질문입니다.

2 글 보임 - 1 에서 2 까지 (총 2 중에서)
  • 글쓴이
  • #84489

    김성국
    참가자
    안녕하세요 선생님, pc에서 s3로 이미지 업로드는 잘 되는데 모바일에서 사진을 업로드 할 경우 s3에 업로드가 되지 않는 문제가 생깁니다ㅠㅠ
    도와주세요ㅠㅠ
     
    
    
    
    
    "use client";
    import { useState } from "react";
    export default function Write() {
      let [src, setSrc] = useState("");
      let [imagefile, setImagefile] = useState("");
      return (
        <div className="p-20">
          <h4>글작성</h4>
          <form action="/api/post/new" method="POST">
            <input name="title" placeholder="글제목"></input>
            <input name="content" placeholder="글내용"></input>
            <input
              name="src"
              type="file"
              accept="image/*"
              onChange={async (e) => {
                let file = e.target.files[0];
                setImagefile(file);
                document.querySelector(".watch").src = URL.createObjectURL(file);
                let filename = encodeURIComponent(file.name);
                if (filename === undefined) {
                  setSrc("");
                } else {
                  setSrc(filename);
                }
              }}
            ></input>
            < img src="" className="watch"></img>
            <button
              type="submit"
              style={{ cursor: "pointer" }}
              onClick={async () => {
                let res = await fetch("/api/post/image?file=" + src).then((r) =>
                  r.json()
                );
                const formData = new FormData();
                Object.entries({ ...res.fields, file: imagefile }).forEach(
                  ([key, value]) => {
                    formData.append(key, value);
                  }
                );
                let 업로드결과 = await fetch(res.url, {
                  method: "POST",
                  body: formData,
                });
                console.log(업로드결과.url);
              }}
            >
              글 작성
            </button>
          </form>
        </div>
      );
    }
     
    #84507

    codingapple
    키 마스터
    버튼에 onClick말고 onSubmit 달아서 기능넣어봅시다 
    이미지업로드전에 폼제출안되게 e.preventDefault()도 써봅시다
2 글 보임 - 1 에서 2 까지 (총 2 중에서)
  • 답변은 로그인 후 가능합니다.

About

현재 월 700명 신규수강중입니다.

  (09:00~20:00) 빠른 상담은 카톡 플러스친구 코딩애플 (링크)
  admin@codingapple.com
  이용약관
ⓒ Codingapple, 강의 예제, 영상 복제 금지
top

© Codingapple, All rights reserved. 슈퍼로켓 에듀케이션 / 서울특별시 강동구 고덕로 19길 30 / 사업자등록번호 : 212-26-14752 온라인 교육학원업 / 통신판매업신고번호 : 제 2017-서울강동-0002 호 / 개인정보관리자 : 박종흠