如何在vue-cli中设置HTTP头？

Question

我想在vue-cli中设置自定义头。

Vue的版本是2.5.2。

我尝试在main.js中：

import Vue from 'vue'
import App from './App'
import router from './router'

Vue.config.productionTip = false
Vue.http.headers.common['Cache-Control'] = 'no-cache, no-store, must-revalidate'

/* eslint-disable no-new */
new Vue({
  el: '#app',
  router,
  template: '<App/>',
  components: { App }
})

但是它返回：

Uncaught TypeError: Cannot read property 'headers' of undefined

- Jeongyong Lee

Answer 1

您可以使用vue.config.js中的devServer选项，将其代理到webpack。

设置标头：

devServer: {
   headers: { "Cache-Control": "no-cache, no-store, must-revalidate" }
}

- Tofandel

Answer 2

我认为您需要安装vue-resource或vue-axios库来使其工作并进行REST调用。

请安装后再试一次。

https://github.com/pagekit/vue-resource

https://github.com/imcvampire/vue-axios

希望这能有所帮助。

- Gaurav Padia

---

抱歉我的示例源代码让你感到困惑。我想做的不是解决CORS问题。 - Jeongyong Lee

是的，无论问题是什么，Vue 中没有内置的“http”变量。您必须安装我列出的这些库之一。您已经安装了吗？如果是这种情况，请告诉我；否则，请安装并尝试。 - Gaurav Padia

如果尚未安装vue-resource，请安装它，然后在main.js中"import router from './router'"下面添加以下行：import VueResource from 'vue-resource'; Vue.use(VueResource);然后应该可以正常工作。 - Gaurav Padia

@JeongyongLee 很好。请接受我的答案作为您问题的解决方案。https://stackoverflow.com/help/someone-answers - Gaurav Padia

问题很清楚（但可能需要一些编辑），与从vue发出http请求无关，而是在使用vue-cli dev服务器（serve命令）时发送自定义标头，这就是OP正在寻找的，与我一样，并且绝不是这个答案所涉及的内容。 - Tofandel