当前位置: 首页 > 科技观察

微信小程序使用Fly发起http请求

时间:2023-03-19 00:59:21 科技观察

微信小程序的Javascript运行环境与浏览器不同。页面的脚本逻辑运行在JsCore中,JsCore是一个没有window对象的环境,所以脚本中不能使用window,并且组件不能在脚本中运行,而JsCore中没有XmlhttpRequest对象,所以jquery、zepto、axios不能在小程序中使用,这时候fly就该大显身手了。您需要下载wx.js(未压缩)或wx.umd.min.js(压缩,12k)中的任何一个,然后将其复制到您的项目目录。使用varFly=require("../lib/wx.js")//wx.js为你下载的源文件创建一个fly实例varfly=newFly();...Page({//事件处理器bindViewTap:function(){//callfly.get("http://10.10.180.81/doris/1/1.0.0/user/login",{xx:6}).then((d)=>{console.log(d.data)}).catch(err=>{console.log(err.status,err.message)})})})作者:lazydu链接:http://www.jianshu.com/p/2d0a1ad94ed5来源:简书版权归作者所有。商业转载请联系作者授权,非商业转载请注明出处。如果你只是一个普通用户,不用往下看,可以到这里,先别急着关,加油,star一下就去https://github.com/wendux/fly。如果你对原理感兴趣,这里简单介绍一下它背后的原理。原理Fly对小程序的支持其实是通过自定义http引擎实现的。我们来看看wx.js源码://微信小程序入口varFly=require("../dist/fly")varEngineWrapper=require("../dist/engine-wrapper")varadapter=require("../dist/adapter/wx")//微信小程序适配器varwxEngine=EngineWrapper(adapter)module.exports=function(engine){returnnewFly(engine||wxEngine);}作者:lazydu链接:http://www.jianshu.com/p/2d0a1ad94ed5来源:简书版权归作者所有。商业转载请联系作者授权,非商业转载请注明出处。可以看出关键代码在adapter/wx中,我们看微信小程序的适配器代码://微信小程序适配器module.exports=function(request,responseCallback){varcon={method:request.method,url:request.url,dataType:request.dataType||"text",header:request.headers,data:request.body||{},success(res){responseCallback({statusCode:res.statusCode,responseText:res.data,headers:res.header,statusMessage:res.errMsg})},fail(res){responseCallback({statusCode:res.statusCode||0,statusMessage:res.errMsg})}}//调用微信发送请求的接口wx.request(con)}作者:lazydu链接:http://www.jianshu.com/p/2d0a1ad94ed5来源:简书版权归作者所有。商业转载请联系作者授权,非商业转载请注明出处。这就是所有的实现,非常简单!通过这个例子,可以帮助你理解“fly通过不同的适配器支持不同的环境”这句话。至于其他环境,我们可以照做。