微信小程序封装http访问网络库实例代码

2024-02-28 11:00:57

微信小程序封装http访问网络库实例代码

之前都是使用LeanCloud为存储，现在用传统API调用时做如下封装

文档出处：https://mp.weixin.qq.com/debug/wxadoc/dev/api/network-request.html

代码如下：

var HOST = 'http://localhost/lendoo/public/index.php/';
// 网站请求接口，统一为post
function post(req) {
//发起网络请求
 wx.request({
 url: HOST + req.uri,
 data: req.param,
 header: {
   "content-type": "application/x-www-form-urlencoded"
 },
 method: 'POST',
 success: function (res) {
  req.success(res.data)
 },
 fail: function (res) {
   console.log(res);
 }
 })
}
// 导出模块
module.exports = { post: post
}

然后前端调用就可以这样做了：

var http = require('../../utils/http.js');
...
 http.post({
  uri: http.orderListUri,
  param: {
   third_session: wx.getStorageSync('third_session')
  },
   success: function (data) {
   that.setData({
    orderList: data
  });
  }
 });

一般对自己写的接口给自己用的时候，method方法或header都是约定好的，所以不用重复书写。

header: {
   "content-type": "application/x-www-form-urlencoded"
  },
method: 'POST'

而fail回调方法也可以统一处理；进一步地，也可以对success回调里的针对code值进一步判断，特定错误码统一处理，比如跳转登录页面等。

经过上述处理，是不是变得简洁了？

感谢阅读，希望能帮助到大家，谢谢大家对本站的支持！

微信小程序 http请求的session管理

微信小程序 http请求的session管理作为一个开发JavaWeb应用的程序猿,都喜欢将用户登录后的用户信息(比如说用户id,用户名称)放入session中保存,之后在业务逻辑的开发中需要用到用户信息的时候就可以轻松又方便的从session中取到值.最近在开发微信小程序的时候碰到一个问题就是每次微信小程序请求的时候都会改变sessionid,这就会导致在后面的请求中取不到登录时保存在session中的用户信息,其实在前后端分离开发的时候也会碰到这个问题,后端程序员负责服务器端开发,提供接口
微信小程序 http请求详细介绍

在微信小程序进行网络通信,只能和指定的域名进行通信,微信小程序包括四种类型的网络请求. 普通HTTPS请求(wx.request) 上传文件(wx.uploadFile) 下载文件(wx.downloadFile) WebSocket通信(wx.connectSocket) 这里以介绍wx.request,wx.uploadFile,wx.dowloadFile三种网络请求为主设置域名要微信小程序进行网络通信,必须先设置域名,不然会出现错误: URL 域名不合法,请在 mp 后台配置后重试
微信小程序封装http请求实例详解

微信小程序封装http请求最近看了一下微信小程序,大致翻了一下,发现跟angular很相似的,但是比angular简单的很多具体可参考官方文档 https://mp.weixin.qq.com/debug/wxadoc/dev/framework/app-service/page.html?t=2017112 下面将封装http请求服务部分的服务以及引用部分 // 本服务用于封装请求 // 返回的是一个promisepromise var sendRrquest = function (ur
微信小程序 HTTPS报错整理常见问题及解决方案

微信小程序 HTTPS报错常见问题及解决方案微信小程序开放公测已经一个多月了,因官方需求文档要求后台使用HTTPS请求进行网络通信,不满足条件的域名和协议无法请求.越来越多的开发者纷纷使用SSL证书实践微信小程序的应用情况,但仍然会碰到各类问题.本文列举了SSL证书常见的报错和解决办法,供开发者参考. 常见问题一在微信小程序内测的过程中,几乎每个开发者们在实践的过程中都遇到了下图的报错: 原因及解决办法: 这是因为wx.request 发起的是 https 请求,微信小程序读取大部分是请求A
微信小程序设置http请求的步骤详解

http请求介绍 HTTP(HyperText Transfer Protocol)是一套计算机通过网络进行通信的规则.计算机专家设计出HTTP,使HTTP客户(如Web浏览器)能够从HTTP服务器(Web服务器)请求信息和服务,HTTP目前协议的版本是1.1.HTTP是一种无状态的协议,无状态是指Web浏览器和Web服务器之间不需要建立持久的连接,这意味着当一个客户端向服务器端发出请求,然后Web服务器返回响应(response),连接就被关闭了,在服务器端不保留连接的有关信息.HTTP遵循请
微信小程序免费SSL证书https、TLS版本问题的解决办法

微信小程序免费SSL证书https.TLS版本问题的解决办法微信小程序与第三方服务器通讯的域名5个必要条件 1.一个已备案的域名,不是localhost.也不是127.0.0.1,域名不能加端口 2.加ssl证书,也就是https://~~~ 4.HTTPS 服务器的 TLS 版本支持1.2及以下版本,一般就是1.0.1.1.1.2要同时支持这三个版本,一个也不能少,要不然就会出现下面这种情况 5.微信小程序后台加上合法域名设置(一个月内改的次数是有限的,且行且珍惜)如下图以上5个条件,必
微信小程序后台https域名绑定和免费的https证书申请详解

微信小程序后台https域名绑定和免费的https证书申请详解微信小程序在11月3号发布了,这是一个全新的生态,没有赶上微信公众号红利的开发者,运营者可别错过这趟车了. 但是微信的后台需要全https,之前我还不相信,后台注册了后进后台才发现,服务器配置如下图从后台的服务器配置可以看出 (1)微信小程序后台只支持https,如果公司后台还没支持https的,赶紧要升级了 (2)API请求,文件上传,socket 文件上传和下载,必须是在后台配置的,否则微信不允许你下载另外,h
微信小程序 http请求封装详解及实例代码

微信小程序 http请求封装示例代码 wx.request({ url: 'test.php', //仅为示例,并非真实的接口地址 data: { x: '' , y: '' }, method:'POST', header: { 'content-type': 'application/json' }, success: function(res) { console.log(res.data) }, fail: function( res ) { fail( res ); } }) 以上
微信小程序Server端环境配置详解（SSL， Nginx HTTPS，TLS 1.2 升级）

微信小程序Server环境配置详解主要内容: 1. SSL免费证书申请步骤 2. Nginx HTTPS 配置 3. TLS 1.2 升级过程微信小程序要求使用 https 发送请求,那么Web服务器就要配置成支持 https,需要先申请SSL证书小程序也要求 TLS(传输层安全协议)的版本至少为 1.2,在配置好 https之后,如果 TLS 的版本较低,就涉及到升级问题所以 Server端环境配置的主要步骤: 申请 SSL 证书配置web服务器支持https(我使用的是nginx)
微信小程序封装http访问网络库实例代码

微信小程序封装http访问网络库实例代码之前都是使用LeanCloud为存储,现在用传统API调用时做如下封装文档出处:https://mp.weixin.qq.com/debug/wxadoc/dev/api/network-request.html 代码如下: var HOST = 'http://localhost/lendoo/public/index.php/'; // 网站请求接口,统一为post function post(req) { //发起网络请求 wx.request(
微信小程序封装多张图片上传api代码实例

这篇文章主要介绍了微信小程序封装多张图片上传api代码实例,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下代码如下 export default class Upload{ constructor(object) { this.obj = { count:1, sizeType:['original', 'compressed'], // 可以指定是原图还是压缩图,默认二者都有 sourceType:['album','camera'], //
微信小程序三级联动地址选择器的实例代码

本文介绍了微信小程序三级联动地址选择器的实例代码,分享给大家,有需要的可以一起了解一下在一些电商类的小程序中,地址选择这个功能一般是必备的,一般的收货信息都需要有一个能选择省市县的控件,当然也有些人为了省事就直接写了一个供输入的input,那么这样做的缺点不言而喻,而且用户体验也不是那么的好,今天的这篇文章就分享一下微信小程序地址选择的实现.省市县的数据以及区域码可以从国家统计局查询到,具体可以自己搜一下.照例先上源码和效果图源码传送门 picker和picker-view组件在正式介绍实
微信小程序下拉框功能的实例代码

微信小程序组件里没有下拉框,正好要用到,记下来以后参考 wxml代码 <view class='top'> <view class='top-text'> 选择接收班级</view>  <view class='top-selected' bindtap='bindShowMsg'> <text>{{grade_name}}</text> <image src='/images/icon/do
微信小程序下拉菜单效果的实例代码

//wcss /**DropDownMenu**/ /*总菜单容器*/ .menu { display: block; height: 28px; position: relative; } /*一级菜单*/ .menu dt { font-size: 15px; float: left; /*hack*/ width: 33%; height: 38px; border-right: 1px solid #d2d2d2; border-bottom: 1px solid #d2d2d2; te
微信小程序动态添加view组件的实例代码

在web中,我们动态添加DOM,可以用jQuery的方法,很简单.在微信小程序中怎么实现下面这么需求. 其中,里程数代表上一行到这一行地方的距离(这个不重要):要实现的就是点击增加途径地,就多一行,删除途径地,就少一行. 分析:添加的和删除的是同样的结构,只是数量不一样,所以考虑循环,用列表表示,增加就往这个列表push一个,删除就从列表pop一个. 主要代码如下: <view class="weui-cell weui-cell_input"> <view clas
微信小程序实现图片翻转效果的实例代码

老规矩,先上图: 页面: <view class='rotateCtn' bindtap='rotateFn'>  <view class='frame {{class1}}'> <image src="{{vo.cover1}}"></image> </view>  <view class='frame {{class2}}'> <im
微信小程序自定义音乐进度条的实例代码

需求:显示音乐播放按钮.可手动拖拽进度条:页面中含多个音乐,播放当前音乐时暂停其他音乐播放. 小程序自带标签 audio 小程序自带的audio标签含固定的样式,且有最小尺寸.目前项目也不含name和author字段,所以放弃audio标签. 实现效果图初始化音乐数据 <text>{{currentProcess}}</text> <slider bindchange="" bindtouchstart="" bindtouchend
微信小程序中的列表切换功能实例代码详解

感觉这列表切换有点类似于轮播图,而且感觉这代码直接可以拿来用,稍微改一改样式什么的就OK了,列表切换也是用到的地方也很多 wxml中的代码如下:  <view class="tab"> <view class="tab-item {{tab==0?'active':''}}" bindtap="changeItem" data-item="0">音乐推荐<
微信小程序 swiper组件详解及实例代码

微信小程序 swiper组件常用属性: 效果图: swiper.wxml添加代码: <swiper indicator-dots="{{indicatorDots}}" autoplay="{{autoplay}}" interval="{{interval}}" duration="{{duration}} " bindchange="bindchangeTag"> <block wx

微信小程序封装http访问网络库实例代码

相关推荐

随机推荐