[B! api][aibo] usako1124のブックマーク

YouTubeのプレーヤーAPIの使い方

YouTubeプレーヤーの埋め込みから、再生や停止、プレーヤーの状態の取得などをPlayer APIを使って実装してみます。 YouTubeプレーヤーの埋め込みまずは今回使用するYouTubeプレーヤーを埋め込みます。 HTML bodyの閉じタグの直前にjsファイルを読み込ませます。今回はこのsample.js内に必要な記述を追加していきます。 <script src="./sample.js"></script> JavaScript sample.js内にYouTube Player APIを読み込む記述を追加します。 // YouTube Player APIを読み込む var tag = document.createElement('script'); tag.src = "https://www.youtube.com/iframe_api"; var firstScri

usako1124 2020/07/26

リンク

iframe 組み込みの YouTube Player API リファレンス | YouTube IFrame Player API | Google for Developers

iframe 組み込みの YouTube Player API リファレンスコレクションでコンテンツを整理必要に応じて、コンテンツの保存と分類を行います。 IFrame Player API を使うと、YouTube 動画プレーヤーをウェブサイトに埋め込み、JavaScript でプレーヤーを制御できます。ウェブページに Flash オブジェクトを埋め込む Flash や JavaScript のプレーヤー API とは異なり、IFrame API はコンテンツをページの <iframe> タグに投稿します。この方法は従来の API よりも柔軟で、Flash をサポートしていないモバイルデバイスの場合に、Flash プレーヤーではなく HTML5 プレーヤーで YouTube を利用できます。この API の JavaScript 関数を使うことで、再生する動画の頭出し、動画の再生

usako1124 2020/07/26

リンク

youtubeで映像を再生して5秒後にシェアボタン表示 – WEBってなんだろう

youtubeにこんな便利なAPIがあったとは。 iframe 組み込みの YouTube Player API リファレンス https://developers.google.com/youtube/iframe_api_reference?hl=ja#Playback_status 下記のような機能（関数）を使いました。動画の再生を開始してからの経過時間を秒数で返します。 player.getCurrentTime():Number  <div id="player"></div> <script> // 2. This code loads the IFrame Player API code asynchronously. var ta

usako1124 2020/07/26

リンク

JavaScript 入門 (ES6+) - JavaScript 入門

といっても、あまり厳密にバージョンを区別するつもりもなくて ES5 以降の機能を取り扱うかもしれません。なんとなく、新しいめの機能という程度に考えてください。ここでは主に 2015 年にリリースされた ESMAScript バージョン 6 及びそれ以降の環境で使用される機能、オブジェクトなどを中心に説明します。しかし、実行環境によってサポートされる機能も随分違いますので、あなたがソフトウェアを開発するときにはターゲットとなる環境でその機能が使えるかどうか次のサイトなどを利用してチェックして使ってください。 caniuse.com

usako1124 2020/06/27

リンク

fetch,async/awaitでAjax通信 - Qiita

await - JavaScript - MDN - Mozilla async functionの実行を一時停止し、関数のPromiseの結果を待つ。 fetchはPromiseを返すので相性が良い。サンプルお天気のAPI（OpenWeatherMap）を叩くサンプル。まずは定数を準備。 const API_KEY = '${API_KEY}'; const CITY = 'Tokyo'; const URL = `http://api.openweathermap.org/data/2.5/forecast?q=${CITY},jp&units=metric&APPID=${API_KEY}`;

usako1124 2020/06/21

リンク

フェッチ API の使用 - Web API | MDN

フェッチ API は、リクエストやレスポンスといったプロトコルを操作する要素にアクセスするための JavaScript インターフェイスです。グローバルの fetch() メソッドも提供しており、簡単で論理的な方法で、非同期にネットワーク越しでリソースを取得することができます。コールバックベースの API である XMLHttpRequest とは異なり、Fetch は Promise ベースであり、サービスワーカーで簡単に使用できる優れた代替手段を提供します。Fetch は、CORS やその他の HTTP 拡張機能などの高度な HTTP 概念も統合します。基本的なフェッチリクエストは、以下のコードを見てください。 async function logMovies() { const response = await fetch("http://example.com/movies.