[TIL] 211223

Lee Syong·2021년 12월 23일
0

TIL

목록 보기
127/204
post-thumbnail

📝 오늘 한 것

  1. 기본 썸네일 지정

  2. 삭제 버튼 클릭 시 경고창 띄우기


📚 배운 것

1. 수정

1) 기본 썸네일 지정

ffmpeg를 이용해 영상에서 추출한 사진이나 다른 사진을 썸네일로 따로 업로드하지 않았다면, defaultThumb을 썸네일로 사용하도록 했다.

썸네일을 따로 업로드했다면, 로컬에서 작업할 때와 Heroku 서버에서 작업할 때 모두 업로드한 썸네일을 받아올 수 있도록 경우를 나눠 작성했다.

thumb ? (isHeroku ? thumb[0].location : thumb[0].path) : defaultThumb

export const postUpload = async (req, res) => {
  // 중략
  
  const { video, thumb } = req.files;
  const defaultThumb =
    "https://syong.s3.ap-northeast-2.amazonaws.com/snowflake.jpg";
  const isHeroku = process.env.NODE_ENV === "production";
  try {
    const newVideo = await Video.create({
      fileUrl: isHeroku ? video[0].location : video[0].path,
      thumbUrl: thumb
        ? isHeroku
          ? thumb[0].location
          : thumb[0].path
        : defaultThumb,
      title,
      description,
      hashtags: Video.formatHashtags(hashtags),
      owner: _id,
    });
    
  .
  .
  .

2) 삭제 버튼 클릭 시 경고창 띄우기

삭제 버튼 클릭 시 바로 삭제되지 않고 confirm()을 이용해 경고창이 뜨도록 수정했다.
취소를 누르면 연결된 링크로 이동하지 않도록 event.preventDefault()를 이용했다.

// videoPlayer.js
const deleteVideoBtn = document.getElementById("video__delete");

const handleDeleteVideoBtnClick = (event) => {
  const confirm = window.confirm("Are you sure you want to delete?");
  if (!confirm) {
    event.preventDefault();
    return;
  }
};

deleteVideoBtn.addEventListener("click", handleDeleteVideoBtnClick);

+다른 에러가 또 떴다...

✨ 내일 할 것

  1. 수정 및 복습
profile
능동적으로 살자, 행복하게😁

0개의 댓글