Reputation: 4268
As some might have noticed, GMail CSP no longer allows playing back audio or video files. At first it effected Chromium Browsers but even firefox no longer allows it. So I made a Google Chrome extension to play mp3s and wavs (my primary use case). Someone requested to add video playback but I am unable to get around the CSP restrictions.
I tried XMLHttpRequest's arrayBuffer
const request = new XMLHttpRequest();
request.open('GET', url, true);
request.responseType = 'arraybuffer';
...
request.onload = () => {
const { readyState, status, response } = request;
const videoHtml = location.appendChild(document.createElement("video"));
videoHtml.classList.add("videoPlayer");
const mediaSource = new MediaSource();
videoHtml.src = URL.createObjectURL(mediaSource);
mediaSource.addEventListener("sourceopen", (e) => {
URL.revokeObjectURL(videoHtml.src);
const sourceBuffer = mediaSource.addSourceBuffer("video/mp4");
console.log("appending Buffer to sourceBuffer");
sourceBuffer.addEventListener("updateend", (e) => {
if (!sourceBuffer.updating && mediaSource.readyState === "open") mediaSource.endOfStream();
});
sourceBuffer.appendBuffer(response);
});
request.send();
I also tried XMLHttpRequest's blob
const request = new XMLHttpRequest();
request.open('GET', url, true);
request.responseType = 'blob';
...
request.onload = () => {
const { readyState, status, response } = request;
const videoHtml = location.appendChild(document.createElement("video"));
videoHtml.classList.add("videoPlayer");
videoHtml.src = URL.createObjectURL(response);
request.send();
Both failed with Refused to load media from ...because it violates the following Content Security Policy directive: "media-src https://*.googlevideo.com/videoplayback/"
How would I be able to get around GMail's incorrect CSP for playing videos?
Chrome extension - https://chrome.google.com/webstore/detail/gplayer/obdmmgdlafadeehmbmcmoggnaokehnaj
Github link - https://github.com/TriStarGod/GPlayer
Upvotes: 1
Views: 408