微信小程序数据请求封装方法及注意事项

2024-11-10
来源:网络整理

WXML只能在微信小程序开发者工具中预览,而HTML可以在浏览器中预览

组件封装不同。 WXML 重新封装了组件。

小程序运行在JS Core中。没有DOM树和对象,小程序中不能使用对象和对象。

16、微信小程序的数据请求如何封装?

在根目录下创建一个目录并创建api.js文件和.js文件;

在.js中封装基本的get\pos​​t\put\等请求方法,设置请求体,和异常处理等。

封装了未获取数据时旋转、加载时的提示,返回数据后返回对象,解决回调地狱问题;

将.js封装的请求方法引入到api.js中,根据页面数据请求的url设置对应的方法并导出;

在特定页面导入;

小程序支持ES6语法来处理逻辑异步/返回成功的回调中。

17、将页面的wxml数据传递给js

1.使用函数传递参数,

需要接收js文件中ev的值

写法是:

saveText: function(ev){ console.log(ev.detail.value); },

2、给按钮绑定事件,需要在for循环中传入数据的属性,如:id

删除

js中接收数据:

delFunc:function(ev){ console.log(ev); const id = ev.currentTarget.dataset.id; },

18.简述微信小程序的原理?

小程序本质上是一个单页面应用程序。所有页面渲染和事件处理都在一个页面内完成,但可以通过微信客户端调用各种原生接口;

它的架构是数据驱动的架构模型,UI和数据是分离的。所有的页面更新都需要通过数据的改变来实现;

从技术上来说,和现有的前端开发类似,采用三种技术:WXML、WXSS进行开发;

该功能可分为两部分: 和;

用于显示UI并处理业务逻辑、数据和接口调用;

这两部分运行在两个进程中,通过系统层进行通信,实现UI渲染、事件处理等。

或者

微信小程序的开发使用了三种技术:wxml和wxss。与现有前端开发的区别在于:

代码运行在微信APP中,因此一些h5技术应用需要微信APP提供相应的API支持;

wxml 微信本身是基于xml语法开发的,所以开发时只能使用微信提供的现有标签,不能使用html标签;

wxss具有css的大部分功能,但在没有详细文档的情况下并不是全部都支持(wxss图片需要使用外部链接地址,没有body,样式可以直接导入)。

微信的架构是数据驱动的架构模型。它的UI和数据是分离的。所有页面更新都需要更改数据。

小程序功能分为UI和APP,主要用于展示UI以及处理业务逻辑、数据和接口调用。它们分两个进程进行,通过系统层进行通信,实现UI渲染和事件处理。

19.请谈谈原生开发小程序、wepy、和的比较?

个人认为,如果是新项目,没有老h5项目的迁移,那么可以考虑使用小程序进行原生开发。优点是相比第三方框架,陷阱较少。

而如果有Vue开发的老h5项目或者有同样需要小程序开发的h5项目,则更适合wepy或者进行迁移或开发。最近wepy几乎没有更新,所以推荐美团。

而且如果团队前端实力强的话,自己搭建一个框架也是没问题的。

20、使用直接加载时需要注意什么?

必须使用管理员在小程序后台添加企业域名;

h5页面跳转到小程序的步骤必须是1.3.1或以上;

微信分享只能是小程序的主名称。如需自定义分享内容,小程序版本需为1.7.1及以上;

h5支付不能来自微信公众号,必须来自小程序,用户的支付也必须来自用户和小程序。

21、小程序调用后台接口时会遇到哪些问题?

数据大小限制,超过范围将直接导致整个小程序崩溃,除非重新启动小程序;

小程序无法直接渲染文章内容等HTML文本。需要插件才能显示。

注意:插件渲染会导致页面加载变慢。建议在后台过滤文章内容的HTML,直接在后台处理p标签和div标签与view标签的批量替换。然后让插件做其他的标签。

22、如何从页面跳转回小程序?

wx..({

url:'//'+'$'

})

//跳转到小程序导航页面

wx..({

网址:'///'

})

23.您说您负责支付流程,您能简单介绍一下微信支付的流程吗?

获取临时凭证wxid

产生

json,返回给小程序,小程序调整支付窗口。

支持成功提示+POST回调。

24.登录

一个。使用 wx.获取代码值

b.使用 wx.请求后台API,并将code值作为参数发送给后台。

后台会根据我们传入的code值来获取总和。后台需要调用数据库并保存登录信息。如果是第一次登录,将会生成一条新的注册记录。

把微信账号登录态生成一个session id并维护在我们自己的session机制中,然后把登录成功的状态返回到小程序客户端作为已经登录成功的凭证。并且返回token值。

c.将成功登录状态的值保存到本地,使用wx.保存到本地,

d.打电话给wx.在你需要使用的地方(建议你也可以封装一个方法,这样就可以方便的检索到你想要的数据)

e.登录成功后,需要 if (res.['.']) {

//如果返回true,则表示已授权。可以直接调用获取头像昵称,无需弹出框。

如果授权成功,则调用wx.获取用户信息并保存在其中。

注:有些网站成功登录后还具有手机绑定功能。获取微信手机号,使用wx。传输至后台,并绑定对应的注册账户。

25.付款流程

25.1 付款前的准备工作。微信账号是企业级的,需要认证。您需要申请小程序支付并获取小程序支付后台账户。

并在后台配置公众账户,赚少量资金,测试账户是否可用。

25.2 首先判断是否登录,如果没有则跳转登录。

25.3 如果您已经登录,我们将根据用户表连接 id 和用户。对应的id就是用户的uid,生成并保存缓存。

25.4 调用后台统一点餐接口获取,获取所有签名信息,并保存到缓存中

25.5 小程序中调用后台订单接口获取订单信息,后台创建商品订单,并保存商品ID、名称、数量……;如果订单创建成功,订单内容会保存到缓存中;

25.6 如果订单创建成功,使用wx.调用后端支付接口“/pay/”执行后端支付流程;

在回调中调用wx.请求小程序的支付,并在请求参数中传递签名信息和产品信息;如果返回则说明支付成功;如果失败,会提示支付失败并跳转到未支付页面。

【付款流程】

【小程序面试题】

分享