详解Vue2 SSR 缓存 Api 数据
作者:M.M.F 发布时间:2023-07-02 17:09:06
标签:Vue,SSR,缓存
本文介绍了Vue2 SSR 缓存 Api 数据,分享给大家,具体如下:
1. 安装缓存依赖: lru-cache
npm install lru-cache --dev
2. api 配置文件
config-server.js
var LRU = require('lru-cache')
let api
if (process.__API__) {
api = process.__API__
} else {
api = process.__API__ = {
api: 'http://localhost:8080/api/',
cached: LRU({
max: 1000,
maxAge: 1000 * 60 * 15
}),
cachedItem: {}
}
}
module.exports = api
配置下lru-cache
3. 封装下 api
import axios from 'axios'
import qs from 'qs'
import md5 from 'md5'
import config from './config-server.js'
export default {
post(url, data) {
const key = md5(url + JSON.stringify(data))
if (config.cached && config.cached.has(key)) {
return Promise.resolve(config.cached.get(key))
}
return axios({
method: 'post',
url: config.api + url,
data: qs.stringify(data),
// 其他配置
}).then(res => {
if (config.cached && data.cache) config.cached.set(key, res)
return res
})
}
}
ajax 库我们用axios, 因为axios在 nodejs 和 浏览器都可以使用
并且将 node 端和浏览器端分开封装
import config from './config-server.js'
const key = md5(url + JSON.stringify(data))
通过 url 和参数, 生成一个唯一的 key
if (config.cached && config.cached.has(key)) {
return Promise.resolve(config.cached.get(key))
}
if (config.cached && data.cache) config.cached.set(key, res)
判断下是不是开启了缓存, 并且接口指定缓存的话, 将 api 返回的数据, 写入缓存
注意:
这个 api 会处理所有的请求, 但是很多请求其实是不需要缓存的, 所以需要缓存可以在传过来的 data 里, 添加个 cache: true, 如:
api.post('/api/test', {a: 1, b:2, cache: true})
不需要缓存的直接按正常传值即可
当然这里标记是不是要缓存的方法有很多, 不一定要用这一种
来源:https://www.mmxiaowu.com/article/58666e94b31b4b0734dd01be
0
投稿
猜你喜欢
- 英文文档:staticmethod(function)Return a static method for function.A stati
- 一、Views文件夹 -> Shared文件夹下的 _Layout.cshtml 母版页@RenderBody当创建基于_Layout
- 绘制简单的折线图✅在使用matplotlib绘制简单的折线图之前首先需要安装matplotlib,直接在pycharm终端pip insta
- 前言上篇文章主要写了利用scapy实现ping扫描,这篇文章主要是利用scapy模块实现内网ARP扫描实现过程上篇文章中介绍了通过scapy
- 通常程序会被编写为一个顺序执行并完成一个独立任务的代码。如果没有特别的需求,最好总是这样写代码,因为这种类型的程序通常很容易写,也很容易维护
- Linux Journal 发表了一篇优化 Oracle 数据库的文章,感觉十分的有用。简要介绍其摘要和大家共同分享 Linux 在企业级数
- print函数的功能是打印图窗或保存为特定文件格式。语法print(filename,formattype)print(filename,f
- 最近两周由于忙于个人项目,一直未发言了,实在是太荒凉了。。。。,上周由于项目,见到Python的应用极为广泛,用起来也特别顺手,于是小编也开
- osql简单用法:用来将本地脚本执行,适合sql脚本比较大点的情况,执行起来比较方便osql -S serverIP -U sa -P 12
- 由于连续的字符(字母、符号、数字)在默认情况下是不换行的,可能会破坏整个界面布局。那如何解决这个问题呢?在 IE 和 Safari 1.3+
- 最近一直在准备用来面试的几个小demo,为了能展现自己,所以都是亲自设计并实现的,其中一个就是在50行代码内来实现一个贪吃蛇,为了说明鄙人自
- 一、Pandas如何将表格的前几行生成html实战场景:Pandas如何将表格的前几行生成html1.1主要知识点文件读写基础语法Panda
- 有很多对于PHP的抱怨,甚至这些抱怨也出自很多聪明的人。当Jeff Atwood写下对于PHP的另一篇抱怨文章之后,我思考了下PHP的好的方
- 方法一: 1、打开查询分析器,输入命令 BACKUP LOG database_name WITH NO_LOG 2、再打开企业管理器--右
- 1、此api已经关闭https://api.map.baidu.com/highacciploc/v1?qcip=220.181
- 我自己测试一下,很多字符变成了 ‘?'。数据库连接已经是使用了 utf8 字符集:define("MYSQL_ENCODE
- /**//// <summary> /// 生成带CDATA的节点 /// </summary> /// <p
- 最近更新了VS Code之后,发现Remote-ssh拓展里的端口转发功能没了,很伤心,在探索的同时,顺手配置了一下VS Code ssh免
- Python的安装并不难,但是要正确安装它的库以及配置环境变量则有些麻烦。对于刚刚开始想要学习Python的小伙伴来说,用Anaconda这
- 1.必需的参数:必须参数须以正确的顺序传入函数,调用的数量必须和声明时的一样def f(name,age):print('I am