YouTubeの動画投稿・配信開始日時を表示

yt_time.user.js

// ==UserScript==
// @name        YouTube DateTime
// @match       https://www.youtube.com/watch*
// @grant       none
// @version     1.0.0
// @description     Replace info with absolute datetime
// @description:ja  YouTubeの動画投稿・配信開始日時を表示
// ==/UserScript==

(() => {
  'use strict';
  
  // https://developers.google.com/youtube/registering_an_application
  const key = '';
  
  const queryString = 'span[itemtype="http://schema.org/BroadcastEvent"] meta[itemprop="startDate"]';
  
  const main = async () => {
    let dateText;

    if(key){
      // https://chrome.google.com/webstore/detail/detailedtime/ppgpbdnncfccljjkgfednccihjbakahd
      let id = new URL(window.location).searchParams.get('v');
      let url = `https://www.googleapis.com/youtube/v3/videos?id=${id}&key=${key}&fields=items(snippet(publishedAt),liveStreamingDetails(actualStartTime))&part=snippet,liveStreamingDetails`
      let prop = await fetch(url, { cache: 'no-cache' }).then(r=>r.json());
      if(prop.items[0].liveStreamingDetails) {
        dateText = prop.items[0].liveStreamingDetails.actualStartTime;
      } else {
        dateText = prop.items[0].snippet.publishedAt;
      }
    }else{
      // https://greasyfork.org/en/scripts/408146-youtube-absolute-datetime
      // only for livestreaming
      const res = await fetch(window.location, { cache: 'no-cache' });
      const rawBody = await res.text();
      const domparser = new DOMParser();
      const body = domparser.parseFromString(rawBody, 'text/html');
      dateText = body.querySelector(queryString)?.getAttribute('content');
    }
    
    if (!dateText) return;
    const date = new Date(dateText);
    document.querySelector('#info-text #info-strings *:not(#dot)').innerText = date.toLocaleString();
  };
  
  document.addEventListener('yt-navigate-finish', main);
})();