之前在接触uniapp做小程序项目时候,因为不太熟悉,遇到了不少尴尬的时刻,请求方法的封装算是灵魂啊有木有,今天看到有人问题,就把我自己写的发出来让大家参考一下吧. 请求方法的封装我一般用的是promise+axios,因为uniapp有自己规定的请求方式,只好结合着来了.话不多说,直奔主题. export const baseUrl = '您的域名' function getHeaders () { let token = getToken() let header = { "token&qu

在写小程序的时候,每个JS文件都一大堆的请求,看得自己都眼花缭乱,下面看一下怎么对请求方法进行封装. 1,方法封装,在util文件夹下新建文件,创建request.js文件,工具文件,用于对方法封装) request.js var app = getApp(); //项目URL相同部分,减轻代码量,同时方便项目迁移 //调用url配置文件 文件config.js是对项目的所有url进行封装 便于管理 const CONFIG = require('../..//utils/config.js')

使用:先导入到util.js 最后在页面上导入util.js(路径自改) var util = require('../../util.js'); 使用示例GET:util.SEND(url,'GET',res=>,res=>); 使用示例POST:util.SEND(url,'POST',res=>,res=>); 使用实例: 源码: function SEND(url, method, data, success, fail) { wx.request({ url: url,

var rootDocment = 'https://123.com';//你的域名 function postData(url, data, cb) { wx.request({ url: rootDocment + url, data: data, method: 'post', success: function (res) { return typeof cb == "function" && cb(res) }, fail: function () { ret

简介 美团出品的mpvue已经开源出来很久了,一直说要进行一次实践,这不最近一次个人小程序开发就用上了它. 看了微信官方的数据请求模块--request,对比了下get和post请求的代码,发现如果在每一个地方都用request的话,那会有很多代码是冗余的,于是就准备自己封装一个,下面就记录一下封装过程.注释也写在下面的代码里了. 实现的结果 代码要简洁 无需每个页面引入一次 Promise化,避免回调地狱 封装代码 //src/utils/net.js import wx from 'wx';

程序开发中都会调用后端工程师开发的API,小程序的开发文档提供了相对实用的APIwx.request(),但是在开发的过程中,又遇到了一些问题,在小程序的项目开发时,调用的API不止一个,同一个API调用不止一次.同时,对于调用的API的管理也十分复杂,这样的背景下,对wx.request()方法的封装变得尤为重要. 本文的解决思路为:将API的路径和方法放在一个文件里面方便管理;封装小程序的request方法,并返回promise处理(ES6). 一.units文件夹中新建request.js

目录 1,前言 2,代码实现 3,使用 3.1,初始化 3.2,发送消息 3.3,接收消息 1,前言 最近在做IOT的项目,里面有个小程序要用到webSocket,借这个机会,封装了一个uniapp小程序适用的Socket类,具体实现如下. 2,代码实现 class webSocketClass { constructor(url, interval) { this.url = url this.data = null this.isCreate = false // WebSocket 是否创

微信小程序数据请求方法 wx.request wxml文件: <view> <textarea value="{{textdata}}"/> </view> <button bindtap="RequestData" value="Button">Button</button> 主要是一个按钮,点击后将请求的数据写入到textarea中 js文件: Page({ data:{ textd

微信小程序有四种网络请求类型,下面只详细介绍普通HTTPS请求(wx.request) 普通HTTPS请求(wx.request) 上传文件(wx.uploadFile) 下载文件(wx.downloadFile) WebSocket通信(wx.connectSocket) 首先,先确认是否设置了合法域名,或者在开发环境下不校验合法域名.关于设置合法域名请看→微信小程序 网络请求之设置合法域名   以下是wx.request的详细说明,截图于微信小程序开发文档 在微信index.js 发起一个普

微信小程序 -- 数据请求 微信小程序请求数据,并不是一个可以在url打开有数据就可以拿到数据那么简单 浏览器地址输入 可以获取参数的url 微信小程序中 代码展示 wxml <view> <button type="primary" bindtap="getData">加载数据</button> </view> js getData () { wx.request({ url: ' url地址 &type=t

这次给你们安利的是微信小程序封装storage,先说下微信官方的 wx.getStorage({ key:"", success: function (res) { }, fail(error){ } }) 官方的方法用起来很麻烦,和我们之前习惯用localStorage.getItem看这个就很别扭,你也一样对吧,别问我怎么知道的  你来这文章的时候你肯定就是不习惯官方的,没关系,我给你封装好了. 第一步.根目录新建utils目录,目录内新建一个utils.js的文件 第二步.复制下

1 微信小程序POST请求参数传递不到后台 需要在微信请求 wx.request 改变默认 header 配置为如下 wx.request({ url: 'test.php', //仅为示例,并非真实的接口地址 data: { x: '' , y: '' }, header: { 'content-type': 'application/x-www-form-urlencoded' // 改变默认值为这个配置 }, success: function(res) { console.log(res

让微信小程序每次请求的时候不改变session_id的方法 每次微信小程序请求的时候都会改变session id, 还好他的请求方法内可以设置header头 所以只需要在启动程序后第一次请求服务器获得一个sessionid(或是唯一编号 ) 然后本地存储起来,每次请求服务器的时候就在header里面带上 但是有个问题就是 你本地存储了这个session id后那么以后每次都会是这个session id 所以建议在程序每次启动的时候先清空本地存储的session id 然后发送首次请求获取新的se

注:本项目的图片资源来源于后端接口,所以使用的是v-for. 关键词:uniapp 小程序 flex布局 v-for 4栏展示 自适应 <view style="display: flex; flex-direction: row;flex-wrap: wrap;margin: 0 5%;"> <view style="width: 25%;margin-bottom: 16upx;" v-for='(items,indexs) in item.t

uniapp小程序迁移到TS 我一直在做的小程序就是 山科小站 也已经做了两年了,目前是用uniapp构建的,在这期间也重构好几次了,这次在鹅厂实习感觉受益良多,这又得来一次很大的重构,虽然小程序功能都是比较简单的功能,但是这好不容易实习学到的东西得学以致用,那就继续在小程序上动手吧哈哈.这次实习收获最大倒不是怎么迁移到TS,而是一些组件设计的概念以及目录结构设计上的东西,不过这都是在之后重写组件的时候要做的东西了.回到正题,小程序是用uniapp写的,毕竟还是比较熟悉Vue语法的,这次迁移首先

原因是我不想每次请求都复制粘贴那么长的请求地址,所以我把前边那一坨请求地址作为基础地址,只传后台给的路由就ok,而且,并不是每次请求都要显示正在加载,这对小程序体验很差,所以,我加了个形参,用来判断是否显示正在加载.最后根据后台给的状态码判断,所有的成功走resolve(.then),所有除了200以外走reject(.catch),然后将loading关闭.关于promise,我就不多讲了,以后有时间在开一篇. 嗷对了,还有token验证,如果项目有需求的话可以把token放入头字段中,每次请

前言 小程序开发,没有vue中的axios那么好使,请求层的封装需要自己来搞. 当然请求层的配置少不了loading,这里索性也就将loading做一个配置,避免以后重复造轮子 请求封装 小程序中有封装好的请求方法:wx.request(url,method,header,success,fail,complete);方法类似于原生的ajax, 这里我们大的方面分两种,一种普通请求,一种是文件上传 普通请求又分为get请求,post请求,post请求又分为JSON格式和BODY格式因此 我们需要

目录 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' // 默认值 },

在utils文件夹新建文件utils.js,封装代码如下: 小程序升级后内部不自带Promise方法,需外部引入Promise方法   var sendRequest = function (url, method, data = {}, header = {} )     {     var promise = new Promise(function (resolve, reject){         wx.request({           url: url,           d

在utils目录下创建network.js文件封装请求 封装的network.js: //模块一,全局变量 let urlList = { host: 'http://47.106.25.53/', loginHost: "http://47.106.25.53/", webModelUrl: 'ipp-web/', //登陆模块 mobileModelUrl: 'ipp-mobile/', //业务模块 authModelUrl: 'ipp-auth-web/', //上传图片 },

1/ 公共文件util添加 request请求 //简单封装请求 function request(params, path, isShowLoading = true, goBack = false, type = 'none', obj={}) { try { console.log(path) let NowTime = Date.parse(; let defaultParams = { platform: app.globalData.platform, appVersion: app