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

박선희님의 프로필 이미지
박선희

작성한 질문수

비전공자를 위한 풀스택 맛집지도 만들기 프로젝트!: Front, Back-end 그리고 배포까지

맛집 클릭시 상세 조회 + 유튜브 섬네일 따기, 지도 중심 이동

맛집 클릭시 상세조회 부분에서 오류가 생겨요ㅜㅜ

작성

·

264

·

수정됨

0

스크린샷_20230222_113509.png

return에서 기존 hello 문구를 지우고 엔터를 치면 여기서 부터 오류가 떠요

 

스크린샷_20230222_113642.png그리고

이렇게html에서 js로 옮기는 과정에서 오류가 뜨는데 어떻게 해야되나요?

답변 2

0

박선희님의 프로필 이미지
박선희
질문자

감사합니다!!좋은 강의도 항상 감사해요!!

0

Jiwoon Jeong님의 프로필 이미지
Jiwoon Jeong
지식공유자

안녕하세요.

전체 코드는 다음과 같습니다.

따옴표가 아닌 백틱 (`) 으로 감싸주시면 될 것 같습니다.

function getContent(data) {
  // 유튜브 섬네일 id 가져오기

  let replaceUrl = data.videoUrl;
  let finUrl = "";
  replaceUrl = replaceUrl.replace("https://youtu.be/", "");
  replaceUrl = replaceUrl.replace("https://www.youtube.com/embed/", "");
  replaceUrl = replaceUrl.replace("https://www.youtube.com/watch?v=", "");
  finUrl = replaceUrl.split("&")[0];

  // 인포윈도우 가공하기
  return `
  <div class="infowindow">
      <div class="infowindow-img-container">
        <img
          src="https://img.youtube.com/vi/${finUrl}/mqdefault.jpg"
          class="infowindow-img"
        />
      </div>
      <div class="infowindow-body">
        <h5 class="infowindow-title">${data.title}</h5>
        <p class="infowindow-address">${data.address}</p>
        <a href="${data.videoUrl}" class="infowindow-btn" target="_blank">영상이동</a>
      </div>
    </div>
  `;
}
박선희님의 프로필 이미지
박선희

작성한 질문수

질문하기