Snap.svg icon indicating copy to clipboard operation
Snap.svg copied to clipboard

Use of Function() in getPath() means having to enable "unsafe-eval" in CSP headers

Open pmac opened this issue 8 years ago • 2 comments

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

pmac avatar Sep 19 '16 15:09 pmac

For any future searchers: there seems to be a workaround https://groups.google.com/a/chromium.org/forum/#!msg/chromium-apps/qo0gNQ7fJ58/rRE90b6rMAAJ

andreasvirkus avatar Mar 03 '19 14:03 andreasvirkus

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;
    }

mmacaula avatar Feb 16 '24 15:02 mmacaula