t

유튜브 링크 표현

이 코드를view.skin.php에 추가하세요

[code]<script>

// bo_v_con 요소 선택

const boVCon = document.getElementById('bo_v_con');

 

// 유튜브 링크 형식 정의

const youtubeDomains = [

  'youtube.com',

  'youtu.be',

  'www.youtube.com'

];

 

// 정규 표현식 생성

const youtubeRegex = new RegExp(`(https?://)?(${youtubeDomains.join('|')})/(shorts/|watch\\?v=|)([\\w-]+)`, 'g');

 

// bo_v_con의 텍스트를 가져와서 링크를 검색

let textContent = boVCon.innerHTML;

 

// 링크가 발견되면 object 요소를 생성

const matches = textContent.match(youtubeRegex);

if (matches) {

  // 중복 제거를 위한 Set 사용

  const uniqueLinks = Array.from(new Set(matches));

 

  uniqueLinks.forEach(link => {

    let videoId = '';

 

    // 링크에 따라 videoId를 추출

    if (link.includes('youtu.be')) {

      videoId = link.split('/').pop(); // youtu.be 링크에서 videoId 추출

    } else if (link.includes('youtube.com')) {

      const url = new URL(link);

      if (url.pathname.includes('shorts')) {

        videoId = url.pathname.split('/').pop(); // shorts 링크에서 videoId 추출

      } else if (url.searchParams.has('v')) {

        videoId = url.searchParams.get('v'); // watch?v= 링크에서 videoId 추출

      } else {

        videoId = url.pathname.split('/').pop(); // 기본 링크에서 videoId 추출

      }

    }

 

    // videoId가 유효한 경우에만 iframe 요소 생성

    if (videoId) {

      // iframe 요소 생성

      const videoContainer = `<div class="video-container" style="text-align: center;">

                                <iframe width="100%" height="500" src="https://www.youtube.com/embed/${videoId}" allowfullscreen></iframe>

                              </div>`;

 

      // 기존 콘텐츠에서 해당 링크를 비디오 요소로 교체

      const safeLink = link.replace(/[-\/\\^$.*+?()[\]{}|]/g, '\\$&'); // 링크를 안전하게 변환

      textContent = textContent.replace(new RegExp(`(?:<a[^>]*>)?${safeLink}(?:<\/a>)?`, 'g'), videoContainer); // 링크를 videoContainer로 교체

    }

  });

 

  // bo_v_con의 내용을 업데이트

  boVCon.innerHTML = textContent; // 업데이트된 내용을 bovcon에 설정

}

</script>[/code]

 

참고자료: http://1004web.kr/board_ujsG12/96855

뤼튼이 다 떠먹여줬습니다 :)

|
댓글을 작성하시려면 로그인이 필요합니다.

그누보드5 팁자료실

+
제목 글쓴이 날짜 조회
1년 전 조회 781
1년 전 조회 1,128
1년 전 조회 1,857
1년 전 조회 1,104
1년 전 조회 1,087
1년 전 조회 1,365
1년 전 조회 1,290
1년 전 조회 1,238
1년 전 조회 1,182
1년 전 조회 899
1년 전 조회 1,344
1년 전 조회 969
1년 전 조회 1,239
1년 전 조회 1,466
1년 전 조회 1,012
1년 전 조회 875
1년 전 조회 1,262
1년 전 조회 1,379
1년 전 조회 1,016
1년 전 조회 1,344
1년 전 조회 930
1년 전 조회 2,074
1년 전 조회 1,082
1년 전 조회 1,107
1년 전 조회 1,829
1년 전 조회 1,008
1년 전 조회 1,177
1년 전 조회 935
1년 전 조회 1,684
1년 전 조회 3,924