Skip to content
Permalink
Browse files

feat: allow adding custom headers with nuxt config (#294)

  • Loading branch information
ricardogobbosouza authored and pi0 committed Oct 21, 2019
1 parent fba95fa commit af1e86d80065951a2ea47cdb291d159bf174f73a
Showing with 49 additions and 23 deletions.
  1. +22 −1 docs/options.md
  2. +18 −4 lib/module.js
  3. +1 −11 lib/plugin.js
  4. +2 −1 package.json
  5. +1 −1 test/fixture/pages/asyncData.vue
  6. +2 −2 test/fixture/pages/mounted.vue
  7. +3 −3 test/fixture/pages/ssr.vue
@@ -43,7 +43,7 @@ Environment variable `API_URL` can be used to **override** `baseURL`.

### `browserBaseURL`

* Default: `baseURL`
* Default: `baseURL`
**WARNING:** when the `proxy` option is enabled the default for browserBaseURL becomes `prefix` instead of `baseURL`

Defines the base URL which is used and prepended to make client side requests.
@@ -148,3 +148,24 @@ This also helps making consistent requests in both SSR and Client Side code.
* Default `['host', 'accept', 'cf-ray', 'cf-connecting-ip', 'content-length']`

This is useful and efficient only when `proxyHeaders` is set to true. Removes unwanted requests headers to the API backend in SSR.

### `headers`

Headers added to all requests. If provided, will be merged with the defaults.

```js
{
common: {
'Accept': 'application/json, text/plain, */*'
},
delete: {},
get: {},
head: {},
post: {},
put: {},
patch: {}
}
```

- **NOTE:** Do NOT include any credentials or tokens here. One can easily access them.
- **NOTE:** This headers are effective to ALL requests. Please take care and consider providing special headers on each call that needs this unless you are pretty sure you always need to add headers.
@@ -1,5 +1,6 @@
const path = require('path')
const consola = require('consola')
const defu = require('defu')

const logger = consola.withScope('nuxt:axios')

@@ -36,8 +37,21 @@ function axiosModule(_moduleOptions) {
// HTTPS
const https = Boolean(this.options.server && this.options.server.https)

// Headers
const headers = {
common: {
'Accept': 'application/json, text/plain, */*'
},
delete: {},
get: {},
head: {},
post: {},
put: {},
patch: {}
}

// Apply defaults
const options = {
const options = defu(moduleOptions, {
baseURL: `http://${defaultHost}:${defaultPort}${prefix}`,
browserBaseURL: null,
credentials: false,
@@ -48,8 +62,8 @@ function axiosModule(_moduleOptions) {
proxy: false,
retry: false,
https,
...moduleOptions
}
headers
})

// ENV overrides

@@ -75,7 +89,7 @@ function axiosModule(_moduleOptions) {

// Convert http:// to https:// if https option is on
if (options.https === true) {
const https = s => s.indexOf('//localhost:') > -1 ? s : s.replace('http://', 'https://')
const https = s => s.includes('//localhost:') ? s : s.replace('http://', 'https://')
options.baseURL = https(options.baseURL)
options.browserBaseURL = https(options.browserBaseURL)
}
@@ -156,17 +156,7 @@ export default (ctx, inject) => {
// Create fresh objects for all default header scopes
// Axios creates only one which is shared across SSR requests!
// https://github.com/mzabriskie/axios/blob/master/lib/defaults.js
const headers = {
common : {
'Accept': 'application/json, text/plain, */*'
},
delete: {},
get: {},
head: {},
post: {},
put: {},
patch: {}
}
const headers = <%= JSON.stringify(options.headers, null, 4) %>

const axiosOptions = {
baseURL,
@@ -26,7 +26,8 @@
"@nuxtjs/proxy": "^1.3.3",
"axios": "^0.19.0",
"axios-retry": "^3.1.2",
"consola": "^2.10.1"
"consola": "^2.10.1",
"defu": "^0.0.3"
},
"devDependencies": {
"@babel/core": "latest",
@@ -6,7 +6,7 @@

<script>
export default {
async asyncData({ app }) {
async asyncData ({ app }) {
const res = await app.$axios.$get('foo/bar')
return {
res
@@ -6,13 +6,13 @@

<script>
export default {
data() {
data () {
return {
res: ''
}
},
async mounted() {
async mounted () {
// Request with full url becasue we are in JSDom env
this.res = await this.$axios.$get('http://localhost:3000/test_api/foo/bar')
}
@@ -11,15 +11,15 @@ let reqCtr = 1
export default {
computed: {
axiosSessionId() {
axiosSessionId () {
return this.$axios.defaults.headers.common.SessionId
},
axiosEncoding() {
axiosEncoding () {
return this.$axios.defaults.headers.common['accept-encoding']
}
},
fetch({ app, route }) {
fetch ({ app, route }) {
const doLogin = route.query.login !== undefined
if (doLogin) {
app.$axios.setHeader('SessionId', reqCtr++)

0 comments on commit af1e86d

Please sign in to comment.
You can’t perform that action at this time.