Snap.svg
Snap.svg copied to clipboard
Use of Function() in getPath() means having to enable "unsafe-eval" in CSP headers
We're using snap.svg and loving it, but we also need to enable CSP for security. CSP is much less helpful if one has to add "unsafe-eval" to the header, but the use of "Function()" in the "getPath()" function means that I have to in order for Snap to work on my site. Is it possible to work around needing this? I've been looking into the code myself, but I wanted to open this issue in case others have run into this and have a workaround or other ideas.
Thanks
For any future searchers: there seems to be a workaround https://groups.google.com/a/chromium.org/forum/#!msg/chromium-apps/qo0gNQ7fJ58/rRE90b6rMAAJ
This is super late, but I was able to re-work the function, at least enough for my needs that I could enable the CSP. I'm not certifying its safe for every path, but if its useful to you here goes:
function getPath(path) {
const getPathFn = function(val) {
var k = 0, i, ii, j, jj, out, a, b = [];
for (i = 0, ii = path.length; i < ii; i++) {
out = "[";
a = [path[i][0] ];
for (j = 1, jj = path[i].length; j < jj; j++) {
a[j] = val[(k++) ];
}
out += a + "]";
b[i] = out;
}
let result = Snap.path.toString.call([b]);
return result.replace(/],\[/g, "").slice(1, -1);
}
return getPathFn;
}