nuxt是服务端的为什么还需要反向代理呢?
因为asyncData对于当前页面刷新,是服务端执行此函数,从其他页面跳转过来是客户端执行此函数,因此,当服务端执行此函数就会出现跨域,还是需要反向代理解决。
下载插件
npm i --save @nuxtjs/proxy
在nuxt.config.js的modules声明一下proxy,并在axios设置proxy为true,最后配置proxy
modules: [
// Doc: https://axios.nuxtjs.org/usage
'@nuxtjs/axios',
'@nuxtjs/proxy'
],
axios: {
proxy:true
},
proxy:{
//拦截ajax开头的
'/ajax':{
target:'http://m.maoyan.com',
changeOrigin:true
}
},
可能遇到报错
connect ECONNREFUSED 127.0.0.1:80
解决方式1:
通过判断服务端请求还是客户端请求来决定是否加https的完整路径
process.server
为true时是服务器执行,为false是客户端执行
url: process.server ? 'https://m.maoyan.com/ajax/moreComingList?token=' : '/ajax/moreComingList?token='
解决方式2:
此时修改package.json,并在控制台提示的对应网址访问网站
"config":{
"nuxt":{
"host":"0.0.0.0",
"port":"80"
}
}