Vue应用用vue-resource时，如何解决Not allowed to load local resource错误？

本文共计861个文字，预计阅读时间需要4分钟。

Vue.js 是一款流行的前端框架，许多人会在项目中使用它。在 Vue.js 开发中，我们经常使用 vue-resource 插件进行异步请求操作。然而，在本地环境下使用 vue-resource 时，控制台会显示 Cannot read property 'get' of undefined。

Vue.js是一款流行的前端框架，许多人都会在项目中使用Vue.js。在Vue.js开发中，我们经常使用vue-resource这个插件来进行异步请求操作。然而，当我们在本地环境下使用vue-resource，在控制台中可能会出现“Not allowed to load local resource: file:///xxx”这个错误提示。下面就来详细介绍一下这个问题的解决方案。

首先，我们需要了解引起这个错误的原因。这是因为浏览器的安全机制限制了本地文件系统上的文件不能直接访问。Vue的应用运行在本地文件系统中的HTML文件中，而异步请求时使用了本地文件的路径。因此，浏览器就会认为这是一个恶意请求，然后进行拦截。

针对这个问题，我们可以采取两种不同的解决方式，具体如下：

1. 启动本地服务器

在Vue.js的开发中，我们一般使用npm命令来启动本地服务器，例如 "npm run serve" 命令。在启动本地服务器后，Vue.js应用就可以在本地服务器上运行，而不是在我们的本地文件系统中。这样，我们就可以避免浏览器的安全机制限制并使用vue-resource这个插件来进行异步请求操作。

如果你是使用的vue-cli创建的项目，则可以在命令行中输入“npm run serve”来启动本地服务器。