【tips】unsafe-eval线上页面突然空白

EvalError: Refused to evaluate a string as JavaScript because ‘unsafe-eval’ is not an allowed source of script in the following Content Security Policy directive: “script-src ‘self’ ‘unsafe-inline’”.

导致页面无法展示。

CSP (Content Security Policy) 错误
违反了内容安全策略中的 unsafe-eval 限制。

原因是最近后端在做安全方面的修改。看了下接口返回的Content Security Policy：
default-src ‘self’; script-src ‘self’ ‘unsafe-inline’; style-src ‘self’ ‘unsafe-inline’; img-src ‘self’ data: https://xxxxxxx（我的域名）; font-src ‘self’; object-src ‘none’; frame-ancestors ‘self’; form-action ‘self’; base-uri ‘self’; upgrade-insecure-requests;

nginx配置修改后Content Security Policy的
script-src ‘self’ ‘unsafe-inline’ ‘unsafe-eval’

恢复正常

还有一个未经验证的方法，因为我的代码里面有一段Echarts的代码

    areaStyle: {
            color: new Function('return ' + `{
            type: 'linear',
            x: 0,
            y: 0,
            x2: 0,
            y2: 1,
            colorStops: [{
                offset: 0,
                color: 'rgba(23,119,255,0.3)' // 渐变起始颜色
            }, {
                offset: 1,
                color: 'rgba(23,119,255,0.05)' // 渐变结束颜色
            }]
        }`)()
        },

这里用了new Function 违反了一开始报错的csp，nginx配置不改的话，可以试下修改js