Get rid of dependence on usercontent.riot.im

2 years ago · 98773df76e
6 changed files with 77 additions and 12 deletions
--- a/.modernizr.json
+++ b/.modernizr.json
@ -7,7 +7,6 @@
  "feature-detects": [
    "test/css/displaytable",
    "test/css/flexbox",
-    "test/es5/specification",
    "test/css/objectfit",
    "test/storage/localstorage",
    "test/es6/array",
@ -18,6 +17,7 @@
    "test/svg/filters",
    "test/css/animations",
    "test/css/filters",
-    "test/network/fetch"
+    "test/network/fetch",
+    "test/iframe/sandbox"
  ]
 }
--- a/docs/config.md
+++ b/docs/config.md
@ -57,11 +57,6 @@ For a good example, see https://riot.im/develop/config.json.
 1. `update_base_url` (electron app only): HTTPS URL to a web server to download
   updates from. This should be the path to the directory containing `macos`
   and `win32` (for update packages, not installer packages).
-1. `cross_origin_renderer_url`: URL to a static HTML page hosting code to help display
-   encrypted file attachments. This MUST be hosted on a completely separate domain to
-   anything else since it is used to isolate the privileges of file attachments to this
-   domain. Default: `https://usercontent.riot.im/v1.html`. This needs to contain v1.html from
-   https://github.com/matrix-org/usercontent/blob/master/v1.html
 1. `piwik`: Analytics can be disabled by setting `piwik: false` or by leaving the piwik config
   option out of your config file. If you want to enable analytics, set `piwik` to be an object
   containing the following properties:
@ -87,7 +82,7 @@ For a good example, see https://riot.im/develop/config.json.
   default homeserver when signing up or logging in.
 1. `permalinkPrefix`: Used to change the URL that Riot generates permalinks with.
   By default, this is "https://matrix.to" to generate matrix.to (spec) permalinks.
-   Set this to your Riot instance URL if you run an unfederated server (eg: 
+   Set this to your Riot instance URL if you run an unfederated server (eg:
   "https://riot.example.org").

 Note that `index.html` also has an og:image meta tag that is set to an image
--- a/src/vector/modernizr.js
+++ b/src/vector/modernizr.js
--- a/src/vector/usercontent/index.html
+++ b/src/vector/usercontent/index.html
@ -0,0 +1,12 @@
+<html>
+<head>
+    <!--
+    Hello! If you're reading this, perhaps you're wondering what this
+    file is doing and why your Riot is using it.
+    In short, this allows Riot to isolate potentially unsafe encrypted
+    attachments into their own origin, away from your Riot.
+    Stay curious!
+    -->
+</head>
+<body></body>
+</html>
--- a/src/vector/usercontent/index.js
+++ b/src/vector/usercontent/index.js
@ -0,0 +1,48 @@
+var params = window.location.search.substring(1).split('&');
+var lockOrigin;
+for (var i = 0; i < params.length; ++i) {
+    var parts = params[i].split('=');
+    if (parts[0] === 'origin') lockOrigin = decodeURIComponent(parts[1]);
+}
+
+function remoteRender(event) {
+    const data = event.data;
+
+    const img = document.createElement("img");
+    img.id = "img";
+    img.src = data.imgSrc;
+
+    const a = document.createElement("a");
+    a.id = "a";
+    a.rel = data.rel;
+    a.target = data.target;
+    a.download = data.download;
+    a.style = data.style;
+    a.style.fontFamily = "Arial, Helvetica, Sans-Serif";
+    a.href = window.URL.createObjectURL(data.blob);
+    a.appendChild(img);
+    a.appendChild(document.createTextNode(data.textContent));
+
+    const body = document.body;
+    // Don't display scrollbars if the link takes more than one line to display.
+    body.style = "margin: 0px; overflow: hidden";
+    body.appendChild(a);
+}
+
+function remoteSetTint(event) {
+    const data = event.data;
+
+    const img = document.getElementById("img");
+    img.src = data.imgSrc;
+    img.style = data.imgStyle;
+
+    const a = document.getElementById("a");
+    a.style = data.style;
+}
+
+window.onmessage = function(e) {
+    if (lockOrigin === undefined || e.origin === lockOrigin) {
+        if (e.data.blob) remoteRender(e);
+        else remoteSetTint(e);
+    }
+};
--- a/webpack.config.js
+++ b/webpack.config.js
@ -18,7 +18,7 @@ module.exports = (env, argv) => {
    if (argv.mode !== "production") {
        // This makes the sourcemaps human readable for developers. We use eval-source-map
        // because the plain source-map devtool ruins the alignment.
-        development['devtool'] = 'eval-source-map';
+        development['devtool'] = 'source-map';
    }

    // Resolve the directories for the react-sdk and js-sdk for later use. We resolve these early so we
@ -34,6 +34,7 @@ module.exports = (env, argv) => {
            "bundle": "./src/vector/index.js",
            "indexeddb-worker": "./src/vector/indexeddb-worker.js",
            "mobileguide": "./src/vector/mobile_guide/index.js",
+            "usercontent": "./src/vector/usercontent/index.js",

            // CSS themes
            "theme-light": "./node_modules/matrix-react-sdk/res/themes/light/css/light.scss",
@ -302,7 +303,7 @@ module.exports = (env, argv) => {
                // HtmlWebpackPlugin will screw up our formatting like the names
                // of the themes and which chunks we actually care about.
                inject: false,
-                excludeChunks: ['mobileguide'],
+                excludeChunks: ['mobileguide', 'usercontent'],
                minify: argv.mode === 'production',
                vars: {
                    og_image_url: og_image_url,
@ -316,6 +317,14 @@ module.exports = (env, argv) => {
                minify: argv.mode === 'production',
                chunks: ['mobileguide'],
            }),
+
+            // This is the usercontent sandbox's entry point (separate for iframing)
+            new HtmlWebpackPlugin({
+                template: './src/vector/usercontent/index.html',
+                filename: 'usercontent/index.html',
+                minify: argv.mode === 'production',
+                chunks: ['usercontent'],
+            }),
        ],

        output: {
@ -346,6 +355,7 @@ module.exports = (env, argv) => {
            // tedious in Riot since that can take a while.
            hot: false,
            inline: false,
+            disableHostCheck: true,
        },
    };
 };