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