如何在没有CORS错误的情况下在Vue CLI中加载JSON

问题描述 投票:1回答:1

我有一个包裹在Electron应用程序中的Vue.js项目。从我的一个组件(src/components/MoviesTable.vue),我正在对本地JSON文件(public/data/multimedia.json)进行axios调用,如下所示:

axios.get('./data/multimedia.json').then(res => {
  this.movies = res.data.movies;
})

[当我运行npm run serve服务Vue应用时,我没有遇到任何问题。但是,当我构建Electron应用程序时,出现错误:

从源'null'到'... / multimedia-index-app / dist / data / multimedia.json'处对XMLHttpRequest的访问已被CORS策略阻止:协议方案仅支持跨源请求:http,数据,chrome,chrome扩展名,https。

我尝试使用代理无效。我知道在SO上也曾提出过类似的有关CORS的问题,它们提供了不同的解决方案,但我是菜鸟,我需要的指导要比我遇到的更清晰。

[如果您需要更多信息,请告诉我。解决此问题的任何帮助将不胜感激。

提前感谢。

vue.js webpack vuejs2 electron vue-cli
1个回答
2
投票
如果JSON文件应与应用程序捆绑在一起,则不需要Axios,可以让Webpack加载它:

import movies from './data/multimedia.json';

并在组件中使用它:

export default { data() { return { movies } } }

© www.soinside.com 2019 - 2024. All rights reserved.