- 首发:2020-12-19 23:48:03
- 教程
- 4696
在nuxt.js中使用axios,推荐使用nuxt定制款nuxt/axios
(https://axios.nuxtjs.org/)。相比原生axios
有如下优势:
- 自动为客户端和服务器端设置
baseURL
- 将
setToken
函数暴露给$axios
,可以非常容易的进行全局Authentication tokens
设置 - 基于
baseURL
发起请求时,自动启用withCredentials
- 添加用于服务器端渲染的
Proxy
请求Header
- 支持使用
axios
加载CSS
- 与
Nuxt
进度条集成 - 与
Proxi
模块集成 - 使用
axios-retry
自动重试请求
对于@nuxt/axios
的使用说明参考官网即可。此处对一些重点配置进行说明。
nuxt.config.js
export default {
modules: [
'@nuxtjs/axios'
],
axios: {
baseURL: 'http://127.0.0.1:4000', // 此处需要填写和privateRuntimeConfig相同的配置内容,方便服务器端请求
},
publicRuntimeConfig: {
axios: {
browserBaseURL: process.env.BROWSER_BASE_URL // 此处填写客户端请求API的地址
}
},
privateRuntimeConfig: {
axios: {
baseURL: 'http://127.0.0.1:4000' // 此处填写在服务器端请求API的地址
}
},
}
在进行同构的时候,privateRuntimeConfig
配置中的baseURL
只有在服务器端请求才会生效,而browserBaseURL
则是客户端请求的时候的baseURL
地址。
例如,服务器中API服务器监听了4000端口,因此在服务器端,nuxt.js
程序通过'http://127.0.0.1:4000'
请求API,而客户端则通过https://域名
请求API。
同理,在内网负载均衡环境下,privateRuntimeConfig
配置中的baseURL
则需要设置为内网请求地址,相应的browserBaseURL
是外网地址。如果不这样设置,可能导致内网也通过外网域名进行API请求,甚至导致CDN循环回源而出现508错误。
从服务端发出的请求和从客户端发出的请求,使用相同的token,有解决方案吗?服务端发请求时怎么拿到token?
从功能实现的角度说,是可以在服务器端请求API的时候,使用和客户端相同的Token的,可以通过建立cookie与token的映射关系,查找cookie对应的token来实现首屏的时候服务器端带token请求API。从功能设计的角度上,最好不要在服务器端带Token去请求API。使用Nuxt.js的通常目的是为了实现服务器和客户端同构,实现搜索引擎收录服务器端渲染的页面。因此需要进行服务器端渲染的页面跟用户权限没有必然关系,在设计API的时候就应当让需要鉴权的API使用客户端作请求。
如遇问题,手动修改上述代码中的版本号为最新版即可。
😄 祝您顺利!
那个设备管理器没有手动添加过时设备了,我直接就重新装了一遍
dcm
我心不死,又重新回来搞这个。
上面的都做好了,windows hello的安装程序闪退(就是闪退做不了),后面还把我sdk客户端里面的Camera Explorer又找不到我的照相机了,我哭死。
能提供一下思路吗,作者大大