Skip to content
Permalink
Browse files

feat: allow creating new instances (#306)

  • Loading branch information
mercs600 authored and pi0 committed Dec 17, 2019
1 parent 6425515 commit 2ca95e58235f10b22317a7c3d53d539d8006f528
Showing with 71 additions and 15 deletions.
  1. +23 −0 docs/extend.md
  2. +24 −14 lib/plugin.js
  3. +9 −0 test/axios.test.js
  4. +15 −1 test/fixture/pages/ssr.vue
@@ -32,3 +32,26 @@ export default function ({ $axios, redirect }) {
})
}
```

### Create new axios instance based on defaults

If you need to create your own axios instance which based on $axios defaults, you can use `create` method.

```js
export default function ({ $axios, redirect }, inject) {
// Create a custom axios instance
const api = $axios.create({
headers: {
common: {
Accept: 'text/plain, */*'
}
}
})
// Set baseURL to something different
api.setBaseURL('https://my_api.com')
// Inject to context as $api
inject('api', api)
}
```
@@ -1,4 +1,5 @@
import Axios from 'axios'
import defu from 'defu'
<% if (options.retry) { %>import axiosRetry from 'axios-retry'<% } %>

// Axios.prototype cannot be modified
@@ -34,6 +35,9 @@ const axiosExtra = {
onError(fn) {
this.onRequestError(fn)
this.onResponseError(fn)
},
create(options) {
return createAxiosInstance(defu(options, this.defaults))
}
}

@@ -48,6 +52,24 @@ const extendAxiosInstance = axios => {
}
}

const createAxiosInstance = axiosOptions => {
// Create new axios instance
const axios = Axios.create(axiosOptions)
axios.CancelToken = Axios.CancelToken
axios.isCancel = Axios.isCancel

// Extend axios proto
extendAxiosInstance(axios)

// Setup interceptors
<% if (options.debug) { %>setupDebugInterceptor(axios) <% } %>
<% if (options.credentials) { %>setupCredentialsInterceptor(axios)<% } %>
<% if (options.progress) { %>setupProgress(axios) <% } %>
<% if (options.retry) { %>axiosRetry(axios, <%= serialize(options.retry) %>)<% } %>

return axios
}

<% if (options.debug) { %>
const log = (level, ...messages) => console[level]('[Axios]', ...messages)

@@ -91,7 +113,7 @@ const setupCredentialsInterceptor = axios => {
}<% } %>

<% if (options.progress) { %>
const setupProgress = (axios, ctx) => {
const setupProgress = (axios) => {
if (process.server) {
return
}
@@ -182,19 +204,7 @@ export default (ctx, inject) => {
axiosOptions.headers.common['accept-encoding'] = 'gzip, deflate'
}

// Create new axios instance
const axios = Axios.create(axiosOptions)
axios.CancelToken = Axios.CancelToken
axios.isCancel = Axios.isCancel

// Extend axios proto
extendAxiosInstance(axios)

// Setup interceptors
<% if (options.debug) { %>setupDebugInterceptor(axios) <% } %>
<% if (options.credentials) { %>setupCredentialsInterceptor(axios)<% } %>
<% if (options.progress) { %>setupProgress(axios, ctx) <% } %>
<% if (options.retry) { %>axiosRetry(axios, <%= serialize(options.retry) %>)<% } %>
const axios = createAxiosInstance(axiosOptions)

// Inject axios to the context as $axios
ctx.$axios = axios
@@ -54,6 +54,15 @@ const testSuite = () => {
})
})

test('createCopy', async () => {
const window = await nuxt.renderAndGetWindow(url('/mounted'))
window.onNuxtReady(() => {
const $axios = window.$nuxt.$axios
const newInstance = $axios.create()
expect(newInstance.defaults.xsrfHeaderName).toBe('X-CSRF-TOKEN')
})
})

test('ssr', async () => {
const makeReq = login => axios
.get(url('/ssr' + (login ? '?login' : '')))
@@ -2,6 +2,8 @@
<div>
<div>session-{{ axiosSessionId }}</div>
<div>encoding-${{ axiosEncoding }}$</div>
<div>newInstance session-{{ newInstanceSessionId }}</div>
<div>newInstance headers-{{ newInstanceHeaders }}</div>
</div>
</template>

@@ -14,11 +16,23 @@ export default {
axiosSessionId () {
return this.$axios.defaults.headers.common.SessionId
},
axiosEncoding () {
return this.$axios.defaults.headers.common['accept-encoding']
},
newInstanceSessionId () {
return this.newInstance.defaults.headers.common.SessionId
},
newInstanceHeaders () {
return this.newInstance.defaults.headers
}
},
created () {
this.newInstance = this.$axios.create({
headers: {
'X-Requested-With': 'XMLHttpRequest'
}
})
},
fetch ({ app, route }) {
const doLogin = route.query.login !== undefined
if (doLogin) {

0 comments on commit 2ca95e5

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