angular 缓存post请求的方法

最新推荐文章于 2022-07-28 14:37:51 发布

Gyanxie

最新推荐文章于 2022-07-28 14:37:51 发布

阅读量2k

点赞数

分类专栏：前端 angularjs 文章标签： angular 缓存 post

本文链接：https://blog.csdn.net/qq_24472595/article/details/70160881

版权

这篇博客探讨了在Angular中如何实现POST请求的缓存。默认情况下，$http只缓存GET和jsonp请求。文章通过分析Angular的$http源码，提出了解决方案：通过创建拦截器和自定义缓存容器，将POST请求伪装成GET请求进行缓存。当POST请求带有cache: true时，拦截器会检查是否有缓存数据，若有则使用缓存并保持success和error回调的正确执行。

摘要由CSDN通过智能技术生成

问题

默认情况下，angular的$http仅仅缓存“get”和’jsonp’的请求数据.

angular $http缓存的源码分析

// line 11737

      if ((config.cache || defaults.cache) && config.cache !== false &&
          (config.method === 'GET' || config.method === 'JSONP')) {
  //判断是否要缓存
        cache = isObject(config.cache) ? config.cache
              : isObject(defaults.cache) ? defaults.cache
              : defaultCache;
          console.log('cache',cache);//选择缓存对象
      }
         if (cache) {
            cachedResp = cache.get(url);//获取缓存
            ...
        }

首先我们要通过 config.method和config.cache的校验
其次要一个唯一的url，可以利用angular自带的URL编码服务$httpParamSerializer，编码data对象来生成，其他的方法也可以，只要唯一就行
另外，如果只是单纯的改成get请求，发给后端的时候，就真是是get请求了。而我们发给后台的应该是post请求。所以第一次请求，必须原封不动的发给后台。这就导致了，我们只能自己创建一个容器来缓存数据。并且是 cacheFactory创建的容器，这