微信小程序wx.request接口

微信小程序wx.request接口

wx.request是小程序客户端与服务器端交互的接口
HTTPS 请求
一个微信小程序,只能同时(同时不能大于5个)有5个网络请求

wx.request(OBJECT)

发起网络请求

url
data
header
method
dataType
wx.request({
  url: 'test.php', //仅为示例,并非真实的接口地址
  data: {
     x: '' ,
     y: ''
  },
  header: {
    'content-type': 'application/json' // 默认值
  },
  success: function(res) {
    console.log(res.data)
  }
})

四种网络请求:

(wx.request)
(wx.uploadFile)
(wx.downloadFile)
(wx.connectSocket)

var request = {
  url: '',
  data: {},
  method: '',
  success: function (res) {
  },
  fail: function () {
  },
  complete: function () {
  }
}

wx.openSetting 来跳转到设置授权界面

/* index.js */
// 若有用户信息存在则继续
Page({
  onLoad () {
    wx.getStorage({
      key: 'userinfo',
      success: (res) => {
        this.setUserinfo(res)
      },
      fail: (res) => {
        api.login().then((res) => {
          this.setUserinfo(res)
        }).catch(e => {
          if (e.errMsg && e.errMsg === 'getUserInfo:fail auth deny') {
            this.setData({
              isauth: false
            })
          }
        })
      }
    })
  },
  toSetting() {
    wx.openSetting({
      success: (res) => {
        this.setData({
          isauth: res.authSetting['scope.userInfo']
        })
        if (res.authSetting['scope.userInfo']) {
          api.login().then((res) => {
            this.setUserinfo(res)
          })
        }
      }
    })
  }
})
// setUserinfo 就是对用户信息做一下处理 不具体展开了

/* index.wxml */
<view class="unauth" wx:if="{{!isauth}}">
   <image class="unauth-img" src="../../images/auth.png"></image>
  <text class="unauth-text">检查到您没打开授权</text>
  <button class="color-button unauth-button" bindtap="toSetting">去设置</button>
</view>
<view class="container" wx:else>
...
</view>
function queryRequest(data){
    wx.request({
        url:"https://example.com/api/",
        data:data,
        header:{
           // "Content-Type":"application/json"
        },
        success:function(res){
            console.log(res.data)
        },
        fail:function(err){
            console.log(err)
        }

    })

}

服务器设置:

上传文件

// Content-type为multipart/form-data
function uploadFile(file,data) {
    wx.uploadFile({
        url: 'http://example.com/upload',
        filePath: file,
        name: 'file',
        formData:data,
        success:function(res){
            console.log(res.data)
        },
        fail:function(err){
            console.log(err)
        }
    })
}

下载文件

function downloadFile(url,typ,success){
    wx.downloadFile({
        url:url,
        type:type,
        success:function(res){
            if(success){
                success(res.tempFilePath)
            }
        },
        fail:function(err){
            console.log(err)
        }
    })
}
function svaeFile(tempFile,success){
    wx.saveFile({
        tempFilePath:tempFile,
        success:function(res){
            var svaedFile=res.savedFilePath
            if(success){
                success(svaeFile)
            }
        }
    })
}

原文地址:https://www.cnblogs.com/dashucoding/p/9922911.html

时间: 2024-10-14 18:17:21

微信小程序wx.request接口的相关文章

监控微信小程序wx.request请求失败

在微信小程序里,与后台服务器交互的主要接口函数是wx.request(),用于发起 HTTPS 网络请求.其重要性不言而喻.然而,却经常遇到请求失败的问题,笔者特意谷歌"wx.request 请求失败",可以搜索到很多相关的文章,下面列出一些: wx.request 失败| 微信开放社区 微信小程序 wx.request 请求失败- SegmentFault 思否 小程序部分机型小程序用户无法发起 wx.request 请求,网络错误问题 ... wx.request()失败,requ

微信小程序wx.request组件的那些坑

最近在做一个教育的在线发布系统,打算用微信小程序做前端,后端用php的CI框架,这两天把CI框架的基本功能已经啃完,因为手册比较完善,所以按照逻辑走一边就通了. 反观微信小程序,帮助代码不多,对于一些没接触过前端和js开发的新手来说,很多流程和细节都会拿不准. 1.这两天遇到最大的困扰就是wx.request组件如何从php服务器端取回数据并显示在小程序界面上,这里涉及到一个通信, 因为小程序目前的机构和框架都是基于ajax异步交互的基础上的,所以要懂得小程序的数据读写功能,首先要了解ajax的

微信小程序 wx.request

一:问题 微信小程序 post请求时,服务器后台接受不到data里面的数据的bug. 二:解决办法 wx.request({ url: 'http://xxxxxxxxx/Create', method: 'POST', data: { "userid": userid, "way": way, "specificWay": specificWay, "money": money, "dateTime":

微信小程序wx.request的回调使用

微信小程序调用外部js中的wx.request方法时,因为异步的请求机制,我们不能在其success:function()中直接返回需要的数据. 例子: 一: //此方法处于外部文件 “utils/util.js” 中进行了定义 function request_method(url, callback) { wx.request({ url: url, method: 'GET', header: { 'Content-Type': 'application/json' }, success:

微信小程序 wx.request POST请求------中文乱码问题

问题: 一个简单的表单,提交后台返回数据"提交成功". 以为没问题了,但是没过多久后台小哥就问为啥那么多乱码,找了很久原因,发现在提交的时候就已经乱码了. 嗯,前端问题,然后测试GET/POST方法.GET没有乱码,POST乱码 header这样写的    header: { 'content-type': 'application/x-www-form-urlencoded' } 原因: 如果设置content-type: application/x-www-form-urlenco

微信小程序 wx:key详细介绍

转自:http://www.jb51.net/article/95980.htm 微信小程序 wx:key 在自己学习的时候不是多明白到底是怎么回事,经过上网查阅资料,整理下: 个人感觉官方给出的例 子不是很明确,官方解释如下: wx:key 如果列表中项目的位置会动态改变或者有新的项目添加到列表中,并且希望列表中的项目保持自己的特征和状态(如 <input/> 中的输入内容,<switch/> 的选中状态),需要使用 wx:key 来指定列表中项目的唯一的标识符. wx:key

微信小程序通过api接口将json数据展现到小程序示例

实现知乎客户端的一个重要知识前提就是,要知道怎么通过知乎新闻的接口,来把数据展示到微信小程序端上. 那么我们这一就先学习一下,如何将接口获取到的数据展示到微信小程序上. 1.用到的知识点 <1> wx.request 请求接口资源(微信小程序api中的发起请求部分) <2>swiper 实现轮播图的组件 <3>wx:for 循环语句 <4>微信小程序的基础知识 2.实现原理 首先,先看一下这个请求函数 wx.request({ url: '******',

微信小程序请求API接口PHPSESSID变化的解决方式

微信小程序开发,请求服务器API的方法使用的是微信官方提供的wx.request()方法.在开发中发现,每一个请求都会生成一个独立的PHPSESSID,如下图示: 搜索后得知,这是由于wx.request()造成的.如果直接使用浏览器请求并不会出现这种情况. 解决方式如下: 通过登录接口获取到用户的session_key 和 open_id,设置session信息如下: $3rd_session = md5(session_key . $open_id) $_SESSION[$3rd_sessi

微信小程序wx.getLocation()获取经纬度及JavaScript SDK调用腾讯地图API获取某一类地址

简介 腾讯位置服务为微信小程序提供了基础的标点能力.线和圆的绘制接口等地图组件和位置展示.地图选点等地图API位置服务能力支持,使得开发者可以自由地实现自己的微信小程序产品. 在此基础上,腾讯位置服务微信小程序JavaScript SDK是专为小程序开发者提供的LBS数据服务工具包,可以在小程序中调用腾讯位置服务的POI检索.关键词输入提示.地址解析.逆地址解析.行政区划和距离计算等数据服务,让您的小程序更强大! 有时候我们在做微信小程序时有些功能需要获取当前的地理位置及附近地点的一些要求,但是