JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<h4>Canavs filter causes security error on firefox</h4>
<canvas id="canvas" width=300 height=300></canvas>

<h2>Copy of image</h2>

<img id='copy'/>

JavaScript

var canvas = document.getElementById("canvas");
var img = document.getElementById("copy");
var ctx = canvas.getContext("2d");


var img = new Image();
img.crossOrigin = "anonymous";
img.onload = start;
img.src = "https://dl.dropboxusercontent.com/u/139992952/multple/bigben.jpg";

function start() {
  canvas.width = img.width;
  canvas.height = img.height;
  ctx.filter = 'blur(15px)';
  ctx.drawImage(img, 0, 0);
  
  $('#copy').attr('src',canvas.toDataURL());
 
}