1:utils 目录下新建一个Cache.js文件 2:文件下书写以下代码: // 缓存类 class Cache { // 构造方法 单位秒 constructor({ expire = 3600 }) { // 成员属性 过期时间 // 毫秒 this.expire = new Date().getTime() + expire * 1000; } // 设置 set(key, value) { let data = { expire: this.expire, value }; // 设置…

目录 1,前言 2,实现思路 3,实现过程 3.1,request的封装 3.2,api的封装 4,实际使用 1,前言 在开发微信小程序的过程中,避免不了和服务端请求数据,微信小程序给我们提供了wx.request这个API,调用方法如下 wx.request({ url: 'www.baidu.com', //仅为示例,并非真实的接口地址 data: { x: '', y: '' }, header: { 'content-type': 'application/json' // 默认值 },…

需求描述及交互分析设计思路和相关知识点电影界面顶部页签切换效果设计正在热映界面布局设计即将上映界面布局设计电影详情页设计我的界面列表导航设计登录设计 相关知识点(1)swiper滑块视图容器组件,可以实现海报轮播效果动态展示以及页签内容切换效果:(2)wx.request(OBJECT)是用来发起的是 HTTPS 请求:(3)微信小程序支持页面分享功能,可以把指定页面分享给好友或者群,需要使用onShareAppMessage 函数,设置该页面的分享信息:(4)wx.setStorage(OBJ…

前言: 有在学vue的网友问如何封装网络请求,这里以正在写的小程序为例,做一个小程序的请求封装. 关于小程序发起 HTTPS 网络请求的Api,详情可以参考官方文档:wx.request(Object object). 如果直接使用官方提供的个Api,那么每次在进行网络请求调用时,我们都要按官方文档上说的那样传递需要设置的请求参数,然后对不同的请求相应结果做不同的处理.但是前端同服务器端的接口请求中有大部分的请求参数以及响应结果处理都是很类似的,也就没有必要对所有请求代码都重新敲敲一遍,那么对原…

为何要封装接口? 有小程序开发的经验者,相信对微信API Request很熟悉了.对接接口时,有大部分的开发者都是直接调用request方法,去请求后台接口并渲染数据.诚然,直接使用api发起请求对接接口开发速度是快的,可是,一旦对接的接口多了起来,这样简单,直接的方法出现了很多缺陷. 难以维护.域名被换或者接口名被换,修改接口名得一个个文件找,而且可能不清楚有多少文件调用了需要修改的接口,导致效率低下 难以管理.无法了解到底用了哪些接口,难于统一修改,除非一个个找出了,并其归纳 代码重复.有些…

前言 最近都在研究小程序了,我可以的! 需求 之前都是用vue来开发项目的,接口模块我特意封装了一下.感觉也可以记录一下 小程序的接口虽说简单,但是重复调用那么多,显得不专业(一本正经的胡说八道) 还有一篇,小程序遇到了的那些坑和小技巧)待续 一.小程序接口请求流程 简单的画了一个流程图 二.域名配置 一定要配置https,小程序上配置的域名必须是域名备案的,还有一定服务器要TLS1.2以上 三.打开微信开发者工具,打开你的项目,点开详情.确认一下域名是否一一匹对.不然会编译失败的哦 四.在你的…

1.方法封装(新建文件夹util,工具文件,在文件夹下创建request.js文件,用于对方法封装)request.js: var app = getApp(); //项目URL相同部分,减轻代码量,同时方便项目迁移 //这里因为我是本地调试,所以host不规范,实际上应该是你备案的域名信息 var host = 'http://localhost:8081/demo/'; /** * POST请求, * URL:接口 * postData:参数,json类型 * doSuccess:成功的回调…

wechat-common-sdk ? 场景:目前工作中的项目需要包含并使用另一个项目. 也许是第三方库,或者你独立开发的,用于多个父项目的库. 现在问题来了:你想要把它们当做两个独立的项目,同时又想在一个项目中使用另一个. 我们举一个例子. 假设你正在开发一个网站然后创建了 Atom 订阅. 你决定使用一个库,而不是写自己的 Atom 生成代码. 你可能不得不通过 CPAN 安装或 Ruby gem 来包含共享库中的代码,或者将源代码直接拷贝到自己的项目中. 如果将这个库包含进来,那么无论用何…

巧妙的封装 暴露一个访问地址xapp.config.js module.exports = { api_host: `https://a.squmo.com/yizu` } 继续引入,加暴露api.config.js const xapp = require('./xapp.config.js'); // 注册接口 module.exports = { GetAddr: `${xapp.api_host}/GetAddr/index` ... } 继续暴露,加request处理 method.j…

封装的request的代码 /** * @desc API请求接口类封装 */ /** * POST请求API * @param {String} url 接口地址 * @param {Object} params 请求的参数 * @param {Object} sourceObj 来源对象 * @param {Function} successFun 接口调用成功返回的回调函数 * @param {Function} failFun 接口调用失败的回调函数 * @param {Function…