Статьи 1С-Битрикс

Решил задачу, рассказал об этом

Как вставить видео с rutube на свой сайт

Как вставить видео с rutube на свой сайт

Первое с чего необходимо начать, это установить блок для вывода видео и придать ему нужные стили

<div id="rutube_videos" class="rutube_videos"></div>

Далее опишем функцию php, где будем получать rss ленту или фид с видео нужного нам канала. Для примера возьмем канал ТНТ Этот фид с данными можно получить без токена и авторизации, главное узнать id канала А получить его можно перейдя на канал на rutube и скопировав его из адреса браузера. Этот id необходимо вставить в url ниже. Так можно получить данные любого канала на rutube. Также установим параметр linit=3, т.к. нам нужно получить последние три видео

$url='https://rutube.ru/api/video/person/23463954/?sort=publication_d&show_hidden_videos=False&limit=3';
function getFeedData($url){
    $ch = curl_init();
    curl_setopt($ch, CURLOPT_URL, $url);
    curl_setopt($ch, CURLOPT_RETURNTRANSFER, 1);
    $rssData = curl_exec($ch);
    curl_close($ch);
    return $rssData;
}
$xml = getFeedData($url);
$decodeXml = json_decode($xml);

foreach($decodeXml->results as $arResult ){
	$entities[] = [
			    'title' => $arResult->title,
			    'url' => $arResult->video_url,
			    'thumbnail' => $arResult->thumbnail_url,
			    'embed' => $arResult->embed_url,
		];
}

echo( json_encode(['success'=>true, 'list'=>$entities] ) );

В итоге мы получаем xml данные, парсим его и собираем массив с нужными нам данными и отдаем на запрос скрипта в браузере

И в конце напишем скрипт, который будет обращаться к нашему файлу на сервере и забирать данные и кэшировать с помощью метода localStorage на сутки на стороне браузера, дабы не обращаться к rutube постоянно

   

 async function getVideosRt(){
        console.log('getVideos')
        let videos=[]
        let currentTimeInSeconds = Math.floor(Date.now() / 1000);
        
        let video_item=localStorage.getItem('rutube_videos')
        if(video_item){
            
            video_item=JSON.parse(video_item)
            if(video_item.sec > currentTimeInSeconds){
                videos=video_item.videos 
            }
        }
        
        if(!videos || !videos.length){
            console.log('read rutube from API')
            let response = await fetch('/rt.php')
            let json = await response.json()
            
            if(json.success){
                videos=json.list
                if(videos.length){
                    
                    localStorage.setItem('rutube_videos', JSON.stringify({sec: currentTimeInSeconds+86400, videos:videos}));
                    console.log('save to ls:',{sec: currentTimeInSeconds, videos:videos})

                }
            }

        }
        if(!videos)
            return
        for(let video of videos){
		
            let video_html = `
                <div class="video">
					<iframe 
						src="${video.embed}"
						frameBorder="0"
						allow="clipboard-write; autoplay"
						webkitAllowFullScreen
						mozallowfullscreen
						allowFullScreen
					  ></iframe>
					  <h3>${video.title}</h3>
                    
                </div>
            `
            document.querySelector('#rutube_videos').innerHTML += video_html
        }
    }
    getVideosRt()

Аналогичный функционал можно применить для встраивания видео с youtube на свой сайт. Ссылка на фид нужного нам канала выглядит следующим образом https://www.youtube.com/feeds/videos.xml?channel_id=UCmVoIfd7II6lVCTovtncaNQ Данные также можно получить без токена и авторизации.

Возврат к списку