Lam_TT的博客

励志做一个合格的程序员。


  • 首页

  • 关于

  • 归档

H5微信支付记录整理

发表于 2020-06-23

H5微信支付记录整理

我主要是做iOS开发的,在完成app开发任务的之余也要负责公司部分项目前端开发。

对于H5的微信支付,其实做了3次了,虽然很简单,但是开发时间间隔有点久了,总是记不住流程和配置,每次都花了大量调试时间。对此做一下记录整理。(如记录整理有问题,请各位朋友及时指出!)

首先,支付分为:

  1. 微信应用内:jsApi

  2. 微信应用外:m_webUrl直接调用支付


微信应用内 (流程如下:)

  • 配置步骤
  1. 公众平台申请账号:https://mp.weixin.qq.com/ 完善相关资料,。
  2. 微信商户平台账号:https://pay.weixin.qq.com/index.php/core/home/login?return_url=%2F 完善相关资料,并且申请开通各个功能,比如:JSApi支付,H5支付等。
  3. 公众号和商户平台绑定。
  4. 分别在公众平台和商户平台进行域名绑定:JSApi、H5、业务域名、授权域名。(注意:域名有个数限制,授权域名只能有2个域名)。
  • 开发步骤(https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_3)
  1. 集成JSSDK参考:https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html#1
  2. 静默授权获取code,code大概是5分钟过期,使用后也过期。具体参考:https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/Wechat_webpage_authorization.html (注意回调地址要encode)
  3. 获取wxOpenId,使用code从后台向wx授权获取wxopenId。
  4. 完善当前页面支付的信息,点击支付。
  5. 使用wxOpenId向微信下单,同样是后台去下单,后台拿到对应数据返回至前端。
  6. 调起支付,方法如下:window.WeixinJSBridge.invoke。具体参考:https://pay.weixin.qq.com/wiki/doc/api/jsapi.php?chapter=7_7&index=6

微信应用外

  1. 应用外比较简单,只需要配置好 商户平台的域名权限。前端支付使用后台返回的m_webUrl直接调用即可。
  2. 如果是iOSApp内的浏览器调用支付的话,微信支付完成后可能无法直接返回App,需要做一些处理。比如:调用微信支付时:将redirect_url 替换成App对应的URL Schemes ,当然这个Schemes需要使用在微信的公众平台和商户平台配置的域名。比如:online.xxxxx.com. 否则微信也无法正常返回至对应App。

备注:开发过程中,只能在配置权限域名下进行调试。所以调试过程比较麻烦,推荐一个调试工具,微信内:http://debugx5.qq.com/ 直接打开即可,注意不能用https,并且只能android设备使用。

回顾2019

发表于 2020-01-06

回顾2019

不知是记性不好,还是对生活和工作不在意,总觉得做什么事情都是迷迷糊糊、顺其自然、停止思考的前进着。总以为生活和个人会越来越好,然而不尽人意,也或者说对自我的不满足。

总的来说,2019年一个提升认知和改变自我的一年。应该还是做了许多事情。

工作上:

19年相比之前空余时间充足,加上公司人力资源调整,在维护iOS项目的前提下,和同事一起学习开发了web应用和小程序应用。在这里也感谢在学习进步过程中同事的帮助!

先谈谈iOS吧。

新闻和课程(iOS)

  • 新闻类客户端
  • yj云课堂
  • 其他小项目维护
  • Swift

    组件化

    因需要“新闻客户端“集成“yj云课堂”课程播放模块,所以对云课堂项目进行了分解,组件化操作,将“课程”模块独立出来,供“新闻客户端”直接调用,但是我并没有将“课程”组件共享的仓库,只是放在本地。

    Swift

    19年,对Swift的学习更近了一步,只是公司暂时没有新的项目开始,就写了几个UIDemo,复习了一下基础知识,决定在下一个新项目开始Swift,并且尝试SwiftUI。

小程序开发

因前端人员不够,移动端时间充足,我和Android同事便开始了“新闻客户端”小程序开发。

使用技术:HTML/css,Vue,js。

使用框架:uni-app

因为之前很少接触前端项目,基本处于“0”的状态,所以看了大约几天的官方文档,便开始写小程序,开始会经常翻阅文档和资料,不过后面都是熟能生巧了,对于有编程经验的人来讲,应该算是很简单的了。

进步:对HTML/css,js的知识更加巩固了一些。

web应用

同样也是,前端人员不够,我们移动端就开始接触了web开发,但是这一次使用技术却不是vue,而是react,都是现学现用。

使用技术:HTML/css,React,typeScript

使用框架/脚手架:next.js

为什么这次要用react,而不用Vue呢?
当然是

  1. 学习了解更多的技术。
  2. 为了移动端React Native 跨平台技术知识储备
  3. 理解各个语言的特性。

    个人感受,React的学习过程比Vue要难许多,基本都是组件化的思维开发,学习的知识也要比vue多一些。

    进步:对HTML/css的知识更加巩固了一些,以及对vsCode工具和各类命令操作熟悉。

以上便是19年工作能力的提升部分了。

生活上:

19年生活平凡,略带一些趣味和挑战。

平凡的是,每天依旧做着自己的工作,吃饭,睡觉,娱乐!

趣味或是,购买了心仪很久的“罗兰EX”音箱,时常和朋友一起去公园弹琴唱歌,乐此不疲。

挑战则是,在闲暇时候,做了一些关于副业的事情。

阅读学习

每年都在看“好声音”,18年喜欢上了“李健”老师的文学素养及风范,决定用心的读书,坚持读书。

19年阅读学习如下:

  • 斗罗大陆(小说)
  • 朝花夕拾(散文)未完….
  • 成语阅读
  • 云课堂视频学习…

    音乐

    还是坚持了很多年了,可能是19年经常和朋友出去弹唱,对于唱功和台风应该比以前进步了许多。

    唱功体现则是在:用气比之前更加灵活,发音习惯也比较好(另一个朋友对我的评价),音色我就不说了,听过我唱歌的都觉得音色不错。哈哈哈~~

副业

在闲暇时候,做了一些关于副业的事情,加入了商会联盟,甚至摆地摊售卖老家特产(这对于我的性格来说确是为一个新挑战),结果以失败告终,哈哈哈哈哈~~~

以此总结,应注重“货源” + “运输” + “消费心理:‘大部分人都是喜欢便宜!’”

总结

19年过完了,感觉只是经历更多的事物,但是对于个人学习能力的提升还是有所懈怠,可能我逐渐明白为什么好的企业要招“高学历”的人才了,不管学历如何,做得工作都一样,只是时间的成本问题了,大部分高学历人在学习能力方面和基础方面远强于低学历的人。 所以对于我来说:只能“勤能补拙”了。

写在最后

可能现在对于我来说,工作是因为“生活压力”迫使着我前进,并不是真正意义的热爱它。但是谁又能完完全全做自己真正喜欢的事情呢?

希望2020年及以后,脚踏实地,用心专研,认认真真做好每一件事,时常总结自己,努力把工作培养成热爱的一部分。

最后说一句内心点的:希望早日买车,还清房贷!

​

Lam_TT

记录点滴生活,让繁忙的工作更有意义。

2 日志
© 2021 Lam_TT
由 Hexo 强力驱动
|
主题 — NexT.Muse v5.1.4