Skip to content

Commit

Permalink
sanitize twitch video embed url (eg : &autoplay=false)
Browse files Browse the repository at this point in the history
  • Loading branch information
vico - low web committed Feb 3, 2020
1 parent acbaebe commit 441dce7
Show file tree
Hide file tree
Showing 4 changed files with 53 additions and 23 deletions.
2 changes: 1 addition & 1 deletion docs/video.html
Original file line number Diff line number Diff line change
Expand Up @@ -59,7 +59,7 @@ <h2>Facebook</h2>

<h2>Twitch</h2>
<p>Twitch embed is no longer supported. Twitch closed their oEmbed service.</p>
<!-- <iframe src="https://player.twitch.tv/?video=v501659150&loop=true&autoplay=false" frameborder="0" allowfullscreen="true" scrolling="no" height="378" width="620"></iframe> -->
<iframe src="https://player.twitch.tv/?channel=solary" frameborder="0" allowfullscreen="true" scrolling="no" height="378" width="620"></iframe>

</section>

Expand Down
49 changes: 37 additions & 12 deletions src/scripts/background/block/block-embed-video.js
Original file line number Diff line number Diff line change
@@ -1,29 +1,54 @@
import { TOKEN } from '../../datas/constants';
import { dataTextLink } from '../../utils/data-uri';
import { watchFilter } from '../../store/watch';
import videoToBlock from '../../datas/video-to-block';
import sanitizeEmbedUrl from '../../utils/sanitize-embed-video-url';

export function blockEmbedVideo() {
const action = details => {
let response = {};
if (details.type === 'sub_frame') {
const { url, tabId } = details;
if (url.indexOf('lowweb=' + TOKEN) === -1) {
browser.tabs.sendMessage(tabId, {
message: 'embedVideoBlocked',
url: url,
});
response.redirectUrl = dataTextLink(url);
// response.cancel = true;

const { url, tabId } = details;

// test if url is whitelisted by lowweb TOKEN
if (url.indexOf('lowweb=' + TOKEN) === -1) {
// find video blocked
for (const key of keys) {
if (url.indexOf(videoToBlock[key].embed_url) !== -1) {
if (videoToBlock[key].oembed) {
// send a message to content_script form embed customisation
browser.tabs.sendMessage(tabId, {
message: 'embedVideoBlocked',
url: url,
});
// redirect to simple fallback just a link to original embed url
response.redirectUrl = dataTextLink(url);
} else {
const sanitizedUrl = sanitizeEmbedUrl(url, false, true);
console.log(sanitizedUrl);

if (sanitizedUrl !== url) {
response.redirectUrl = sanitizedUrl;
}
}
}
}
}

return response;
};

const embedUrls = [];
const keys = Object.keys(videoToBlock);
for (const key of keys) {
if (videoToBlock[key].embed_url_filter) {
embedUrls.push(videoToBlock[key].embed_url_filter);
}
}
const filter = {
urls: ['*://*.youtube.com/embed/*', '*://player.vimeo.com/*', '*://*.dailymotion.com/embed/*', '*://*.facebook.com/plugins/video.php*'],
urls: embedUrls,
types: ['sub_frame'],
};
// TODO use a ABP list
// Blocker.filterRequest(action, filter);

watchFilter('video_clicktoload', action, filter);
}
19 changes: 12 additions & 7 deletions src/scripts/datas/video-to-block.js
Original file line number Diff line number Diff line change
Expand Up @@ -6,9 +6,10 @@ export default {
id: 'youtube',
domains: ['youtube.com', 'youtu.be'],
embed_url: 'youtube.com/embed',
embed_url_filter: '*://*.youtube.com/embed/*',
video_url: 'https://www.youtube.com/watch?v=##ID##',
oembed: 'https://www.youtube.com/oembed',
image: '', // 'https://img.youtube.com/vi/##ID##/mqdefault.jpg',
// image: '', // 'https://img.youtube.com/vi/##ID##/mqdefault.jpg',
player: 'players/Youtube.js',
skin:
'<a href="##VIDEO_URL##" target="_blank">##IMAGE##<svg enable-background="new 0 0 68 48" viewBox="0 0 68 48" height="68" width="48" xmlns="http://www.w3.org/2000/svg"><path d="m66.6 7.5c-.8-2.9-3.1-5.3-6-6.1-5.4-1.4-26.6-1.4-26.6-1.4s-21.2 0-26.6 1.5c-2.9.8-5.3 3.1-6 6.1-1.4 5.3-1.4 16.4-1.4 16.4s0 11.1 1.5 16.5c.8 2.9 3.1 5.3 6 6 5.3 1.5 26.5 1.5 26.5 1.5s21.2 0 26.6-1.4c2.9-.8 5.3-3.1 6-6 1.4-5.5 1.4-16.6 1.4-16.6s0-11.1-1.4-16.5z" fill="#212121" fill-opacity="0.8" /><path d="m27 34.1 17.8-10.1-17.8-10.1z" fill="#fff"/></svg><div class="lowweb__title">##TITLE##</div></a>',
Expand All @@ -26,10 +27,11 @@ export default {
id: 'vimeo',
domains: ['vimeo.com'],
embed_url: 'player.vimeo.com/video/',
embed_url_filter: '*://player.vimeo.com/*',
video_url: 'https://player.vimeo.com/video/##ID##',
oembed: 'https://vimeo.com/api/oembed.json',
image: '',
player: '', // 'players/Vimeo.js',
// image: '',
// player: '', // 'players/Vimeo.js',
skin:
'<a href="##VIDEO_URL##" target="_blank">##IMAGE##<svg enable-background="new 0 0 65 40" height="65" width="40" viewBox="0 0 65 40" xmlns="http://www.w3.org/2000/svg"><path d="m60 40h-55c-2.8 0-5-2.2-5-5v-30c0-2.8 2.2-5 5-5h55c2.8 0 5 2.2 5 5v30c0 2.8-2.2 5-5 5z" fill-opacity="0.75" /><path d="m26 9.4 19.8 10.6-19.8 10.6" fill="#fff"/></svg><div class="lowweb__container"><div class="lowweb__title">##TITLE##</div><br><div class="lowweb__author"><span>by</span> ##AUTHOR##</div></div></a>',
// image: 'https://vimeo.com/api/v2/video/##ID##.json?callback=showThumb'
Expand All @@ -38,17 +40,19 @@ export default {
id: 'dailymotion',
domains: ['dailymotion.com'],
embed_url: 'dailymotion.com/embed/video',
embed_url_filter: '*://*.dailymotion.com/embed/*',
video_url: 'https://www.dailymotion.com/video/##ID##',
oembed: 'https://www.dailymotion.com/services/oembed',
player: '', // 'players/Dailymotion.js',
api_player: 'players/Dailymotion.js',
image: '',
// image: '',
skin:
'<a href="##VIDEO_URL##" target="_blank">##IMAGE##<svg enable-background="new 0 0 80 80" height="80" width="80" viewBox="0 0 80 80" xmlns="http://www.w3.org/2000/svg"><g fill="#fff"><path d="m40.1 80c-21.8 0-40.3-18.5-40.1-40.3.3-21.4 17.7-39.2 38.8-39.7 22.2-.4 40.6 17 41.1 39.1.5 21.9-17.9 40.8-39.8 40.9" opacity=".5"/><path d="m30.8 40.3c0-4.4 0-8.8 0-13.2 0-1 .4-1.6 1.3-1.6.3 0 .6.1 1 .3 7.4 4.1 14.8 8.3 22.2 12.6.3.2.7.4 1.1.6.5.3.9.7.9 1.3s-.4 1-.9 1.3c-3.7 2.1-7.3 4.1-11 6.3-4.1 2.3-8.1 4.6-12.2 6.9 0 0-.2.1-.2.1-1.2.6-2.2 0-2.2-1.3 0-2.2 0-4.4 0-6.6z"/></g></svg><div class="lowweb__container"><div class="lowweb__author">##AUTHOR##</div><div class="lowweb__title">##TITLE##</div></div></a>',
},
facebook: {
id: 'facebook',
embed_url: 'facebook.com/plugins/video.php',
embed_url_filter: '*://*.facebook.com/plugins/video.php*',
video_url: 'https://www.facebook.com/video.php?v=##ID##',
oembed: 'https://www.facebook.com/plugins/video/oembed.json',
image: 'https://graph.facebook.com/##ID##/picture',
Expand All @@ -58,10 +62,11 @@ export default {
twitch: {
id: 'twitch',
embed_url: 'player.twitch.tv',
embed_url_filter: '*://player.twitch.tv/*',
video_url: 'https://www.twitch.tv/videos/##ID##',
oembed: '', // https://api.twitch.tv/v4/oembed
image: '',
player: '', // players/Twitch.js
// oembed: '', // https://api.twitch.tv/v4/oembed
// image: '',
// player: '', // players/Twitch.js
skin:
'<svg class="player-icon-play" id="icon_play" viewBox="0 0 30 30" width="120" height="120" xmlns="http://www.w3.org/2000/svg"><path d="M9 22.066V7.934a.5.5 0 0 1 .777-.416L21 15 9.777 22.482A.5.5 0 0 1 9 22.066z" fill="#FFF"></path></svg>',
},
Expand Down
6 changes: 3 additions & 3 deletions src/scripts/utils/sanitize-embed-video-url.js
Original file line number Diff line number Diff line change
Expand Up @@ -83,8 +83,8 @@ export default function(url, autoplay = false, token = false) {
}

function setEmbedParam(params, name, value) {
if (typeof params[name] !== 'undefined' && params[name] !== value) {
params[name] = value;
}
// if (typeof params[name] !== 'undefined' && params[name] !== value) {
params[name] = value;
// }
return params;
}

0 comments on commit 441dce7

Please sign in to comment.