本文介绍了如何修复“不安全评估"客户端版本的 Vue3 错误?的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

我的应用使用 Express、cors 和头盔.Vue3 仅用于客户端,库文件自托管在公共文件夹中.我只是做

I'm using Express, cors, and helmet for my app. Vue3 is used on the client-side only and the library file is self-hosted in the public folder. I simply do

<script type="module" src="/public/lib/vue.esm-browser.js"></script>

将模块添加到客户端.问题是,当我使用它时,它不断给我一个 Uncaught EvalError: Refused to evaluate a string as JavaScript 因为在以下内容安全策略指令中,'unsafe-eval' 不是允许的脚本源:"script-src 'self''.昨天突然出现这个问题,当我开始使用头盔和cors模块时,即使我注释掉这些模块,它仍然显示错误.我应该修复什么?

to add the module to the client-side. The problem is that when I use it, it keeps giving me an Uncaught 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'". This problem started yesterday suddenly, when I started using the helmet and cors modules, and even if I comment out these modules, it still shows the error. What should I fix?

推荐答案

是的,vue.js 使用了这样一段代码:

Yes, vue.js uses a piece of code like that:

  // detect possible CSP restriction
  try {
    new Function('return 1');
  } catch (e) {
    if (e.toString().match(/unsafe-eval|CSP/)) {
      warn$$1(
        'It seems you are using the standalone build of Vue.js in an ' +
        'environment with Content Security Policy that prohibits unsafe-eval. ' +
        'The template compiler cannot work in this environment. Consider ' +
        'relaxing the policy to allow unsafe-eval or pre-compiling your ' +
        'templates into render functions.'
      );
    }
  }

这里有两个选项:

  1. 预编译模板的使用,请参阅 github 上的讨论.

使用 vue.runtime.js 运行时版本而不是 vue.js 完整版本.

using a vue.runtime.js runtime version instead of vue.js full version.

VueJS 有 2 个不同的版本:完整版和运行时版.'unsafe-eval' 只需要完整版的 VueJS;运行时版本不需要它.在此处查看详情.

VueJS has 2 different versions: the full version and the runtime version. 'unsafe-eval' is only needed for the full version of VueJS; the runtime version doesn't need it. See details here.

仅运行时构建完全符合 CSP.当使用 Webpack + vue-loader 或 Browserify + vueify 的仅运行时构建时,您的模板将被预编译为在 CSP 环境中完美运行的渲染函数.在 Vue CSP 环境中查看详细信息.

The runtime-only build is fully CSP-compliant. When using the runtime-only build with Webpack + vue-loader or Browserify + vueify, your templates will be precompiled into render functions which work perfectly in CSP environments. See details in Vue CSP environments.

这篇关于如何修复“不安全评估"客户端版本的 Vue3 错误?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持!

08-01 16:57