微信小程序的应用目前越来越多,不管喜欢与否我们都应该了解一些。废话不多,直接干货。

做项目自然避免不了前后端的交互,小程序在调试过程中需要在先在:小程序公众平台--设置--开发设置中,将要从后台请求的url在“request合法域名”中设置一下。

在微信开发者工具中设置:



记得不能取消“不效验安全域名、web-view域名、TLS版本以及HTTPS证书”选项的勾选。


小程序官方提供了接口:wx.request(OBJECT),在此基础上进行二次封装:

const app = getApp().globalData;  //获取app.js中的全局变量
const https = (obj) => {
wx.request({
url: app.url + obj.url,
header: {
'content-type': 'application/json',
... //其他头部信息
},
data: obj.data,
method: 'POST/GET',
success: function(res) {
errFn(res.data.code); //根据后台返回的code码进行统一的处理,如错误处理函数errFn
obj.success(res); //对返回数据的处理
},
fail: function(err) {
//如果请求失败进行弹窗提示,并处理
wx.showModal({
title: '提示',
content: '出错了,请点击确定返回首页',
success: function(res) {
if (res.confirm) {
//处理错误的代码
}
} })
//传递错误信息
obj.fail(err);
}
})
}

小程序系列待续……

微信小程序小结(1) ------ 前后端交互及wx.request的简易封装的更多相关文章

  1. 微信小程序如何调用API实现数据请求-wx.request()

    前言 微信小程序不存在ajax,那么它是如何实现数据请求功能的呢?在微信中提供了API的调用wx.request(OBJECT),这个是很不错的.下面就讲一下如何请求数据,简单到不行. wx.requ ...

  2. 微信小程序填坑之路其一:wx.request发送与服务端接受

    一.序言 应公司要求要求,要用小程序开发一个信息录入系统.没办法只能听话来填坑. 先介绍一下环境:客户端——小程序:服务端——java:数据库——mysql:服务器——centos7 需求:客户端输入 ...

  3. 20171018 微信小程序客户端数据和服务器交互

    -- 时常在想,怎么样才能把知识写的清晰,其实是我理解的不够清晰 微信小程序其实是一个客户端页面,也是需要和服务器交互才能体现数据. 1 --服务器搭建Web API :MVC4 中的一个模板, 如下 ...

  4. 微信小程序小结(5) -- 常用语法

    在 pages 字段的第一个页面就是这个小程序的首页(打开小程序看到的第一个页面). Page生命周期 属性 类型 描述 onLoad Function 生命周期函数--监听页面加载.一个页面只会调用 ...

  5. 微信小程序登录对接Django后端实现JWT方式验证登录

    先上效果图 点击授权按钮后可以显示部分资料和头像,点击修改资料可以修改部分资料. 流程 1.使用微信小程序登录和获取用户信息Api接口 2.把Api获取的用户资料和code发送给django后端 3. ...

  6. 微信小程序公司开发前必读

    事前准备: 微信小程序需要https请求,需要准备 1:备案的域名:由于备案需要一定的时间,所以请事先准备 2:受认可的证书 一个账号只能发布一个小程序,如需发布多个,请申请多个账号. 个人开发和学习 ...

  7. 移动开发之【微信小程序】的原理与权限问题以及相关的简易教程

    这几天圈子里到处都在传播着这样一个东西,微信公众平台提供了一种新的开放能力,开发者可以快速开发一个小程序,取名曰:微信公众平台-小程序 据说取代移动开发安卓和苹果,那这个东东究竟是干吗用的?但很多人觉 ...

  8. 微信小程序 本地缓存保持登录状态之wx.setStorageSync()使用技巧

    微信小程序提供了一个如同浏览器cookie本地缓存方法,那就是今天要说的wx.setStorageSync() 注意,该方法是同步请求,还有个异步请求的方法是wx.setStorage(),参考官方文 ...

  9. 微信小程序小结

    前几日抽空看了下小程序,发现挺好玩的,mvvm的结构,语法比vue要简单,内置了一系列的组件,很方便.然后开发者工具直接上传代码,提交审核,然后发布,感觉挺好.虽然不打算做个工具类的,但是做个介绍类小 ...

随机推荐

  1. Angular Js 控制器

    在Angularjs中用ng-controller指令定义了应用程序中的控制器:例如: <div ng-app="myApp" ng-controller="myC ...

  2. win2008server R2 x64 部署.net core到IIS

    1.下载sdk 和.NET Core Windows Server Hosting   https://www.microsoft.com/net/download  2.出现HTTP 错误 500. ...

  3. node.js定时任务:node-schedule的使用

    安装 npm install node-schedule 使用方法 1:确定时间 例如:2014年2月14日,15:40执行 var schedule = require("node-sch ...

  4. C++STL 常用 函数 用法(转)

    http://www.cnblogs.com/duoduo369/archive/2012/04/12/2439118.html 迭代器(iterator) 个人理解就是把所有和迭代有关的东西给抽象出 ...

  5. 有關WCF一個自認爲比較經典的博客

    无废话WCF入门教程四[WCF的配置文件] (http://www.cnblogs.com/iamlilinfeng/archive/2012/10/02/2710224.html) -------- ...

  6. jQuery Cloud Zoom:图片放大镜插件 破解插件

    /* Cloud Zoom 10 Site License (CZ01-10). Version 3.1 rev 1312051822 */ (function(e) { function s(a) ...

  7. php 二维数组验证一个值是否存在

    php 判断数字在二维数组里 $arr = array( array('a', 'b'), array('c', 'd') ); in_array('a', $arr); // 此时返回的永远都是 f ...

  8. docker 基本概念

    image 操作系统 应用 registeries image 的远程仓库 containers 类似一个目录,一个容器包含了 应用运行所需要的一切东西, 容器之间互相独立 image包换一系列的层, ...

  9. CSS让图标变成白色或黑色实例页面 和css变灰色

    css代码 .black { filter: brightness(0); } .white { filter: brightness(100); } html代码 <h4>原图</ ...

  10. Linux Shell 判断块设备节点是否存在

    /************************************************************************* * Linux Shell 判断块设备节点是否存在 ...