我在將 Youtube iframe API 與最新穩(wěn)定版 Chrome(版本 85)結(jié)合使用時(shí)遇到問題。我知道一個(gè)月前一切正常,但現(xiàn)在,即使完全遵循 Youtube iframe API 文檔中的最基本示例:https://developers.google.com/youtube/iframe_api_reference#Getting_Started不再工作了。onReady 和 onStateChange 事件未被觸發(fā),并且“播放器”對(duì)象缺少其大部分功能,例如 player.playVideo() 未定義。這個(gè)問題在我測(cè)試過的任何其他瀏覽器上都沒有發(fā)生,只有當(dāng)我在測(cè)試這個(gè)時(shí)登錄到我的 Youtube 帳戶時(shí)才會(huì)發(fā)生。我懷疑問題的根源是來自 Youtube 的請(qǐng)求發(fā)送的 cookie,因?yàn)槲以凇鞍l(fā)現(xiàn)問題”選項(xiàng)卡的控制臺(tái)中收到此錯(cuò)誤:“通過指定其SameSite屬性來指示是否在跨站請(qǐng)求中發(fā)送cookie”,而 Chrome 在 85 版本的注釋中提到了這一點(diǎn):“拒絕不安全的 SameSite=None cookie”如果我退出 Youtube,這與播放器工作的事實(shí)相符,因?yàn)?Youtube 使用這些 cookie 根據(jù)您的個(gè)人資料推薦不同的視頻。我現(xiàn)在正在尋找解決方法,我唯一能找到的是,如果我手動(dòng)創(chuàng)建 iframe,而不是使用 API,我可以在 iframe 的 src 中放置“youtube-nocookie”而不是“youtube”,但是這樣我就沒有可以參考的對(duì)象來控制播放器,例如,如果我必須創(chuàng)建一個(gè)自定義按鈕來暫停/播放視頻。我想主要是在 Youtube 上修復(fù)他們的 API,但是現(xiàn)在有什么方法可以解決這個(gè)問題嗎?這是一個(gè) Codepen 來說明問題,代碼取自上面鏈接的 Youtube Iframe API 文檔:https://codepen.io/Gabielovv/pen/VwadJvg?editors=1111 // 2. This code loads the IFrame Player API code asynchronously. var tag = document.createElement('script'); tag.src = "https://www.youtube.com/iframe_api"; var firstScriptTag = document.getElementsByTagName('script')[0]; firstScriptTag.parentNode.insertBefore(tag, firstScriptTag); // 3. This function creates an <iframe> (and YouTube player) // after the API code downloads. var player; function onYouTubeIframeAPIReady() { player = new YT.Player('player', { height: '390', width: '640', videoId: 'M7lc1UVf-VE', events: { 'onReady': onPlayerReady, 'onStateChange': onPlayerStateChange } }); } // 4. The API will call this function when the video player is ready. function onPlayerReady(event) { console.log("onPlayerReady"); event.target.playVideo(); }
使用 Youtube Iframe API 創(chuàng)建的視頻播放器停止使用 Chrome v.85
繁華開滿天機(jī)
2023-03-03 09:55:08