Vue.js使用axios缓存http请求

时间:2018-04-05 11:29:07

标签: vue.js axios

我正在使用Vue.js开发PWA。 当用户启动它时,需要来自另一个应用程序的一些信息。为此,我正在使用axios:

let url = 'url';
axios.get(url).then((response) => {
  callback(response.data)
})
只要用户在线,它就能正常工作。如果网络连接正常,则应通过URL检索数据,如果没有Internet连接,则应从缓存加载数据。这怎么可能?

1 个答案:

答案 0 :(得分:7)

您可以查看此扩展程序https://github.com/kuitos/axios-extensions

这是基本的用法示例,我希望它有所帮助

import axios from 'axios';
import { cacheAdapterEnhancer } from 'axios-extensions';

const http = axios.create({
    baseURL: '/',
    headers: { 'Cache-Control': 'no-cache' },
    // cache will be enabled by default
    adapter: cacheAdapterEnhancer(axios.defaults.adapter)
});

http.get('/users'); // make real http request
http.get('/users'); // use the response from the cache of previous request, without real http request made
http.get('/users', { cache: false }); // disable cache manually and the the real http request invoked