分类归档

小程序

FWQ
小程序
微信小程序中生成图片的代码
本篇文章给大家带来的内容是关于微信小程序中生成图片的代码,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。 添加画布 首先,在小程序里进行绘图操作需要用到 组件,步骤大致分为以下3个部分:一张大的背景图,一段动态的文字(‘标题 用户名 及其他信息’),以及一个小程序码图片。那我们就先在我们的wxml代码中放入如下的 : <!--wxml代码--> <view>   <canvas></canvas></view> 登录后复制  第三方函数引入 const util = require('../../utils/util.js') 登录后复制 //util.js var Promise = require('../components/bluebird.min.js') module.exports = {   promisify: api =&gt; {     return (options, ...params) =&gt; {       return new Promise((resolve, reject) =&gt; {         const extras = {           success: resolve,           fail: reject         }         api({ ...options, ...extras }, ...params)       })     }   }…
2024-11-25 阅读全文 →
FWQ
小程序
技术解答—app微信小程序中的页面跳转
微信小程序页面跳转失败的原因可能是:1:检查你跳转的地址是否有误;2:检查你要跳转的地址是否在app.js中注册过;3:当你跳转的地址位于TabBar中时,要使用wx.switchTab来跳转页。 接下来总结一下跳转的方法: 1.API跳转 wx.navigateTo({…}) wx.redirectTo({…}) wx.switchTab({…})wx.reLanch({…})  (1)  wx.navigateTo({…})         不会销毁当前页面,仅仅是将其hide,使用wx.navigateBack可以返回到原页面。        注意:调用navigateTo 跳转时,调用该方法的页面会被加入堆栈中 // 关闭当前页面,返回上一页面或多级页面。可通过 getCurrentPages() 获取当前的页面栈,决定需要返回几层。 wx.navigateTo({     url: 'page/home/home'      // 页面 A }) wx.navigateTo({     url: 'page/detail/detail'  // 页面 B }) // 跳转到页面 A wx.navigateBack({     delta: 2 }) 登录后复制 (2)wx.redirectTo({…}) …
2024-11-25 阅读全文 →
FWQ
小程序
微信开发之Maven仓库管理及新建WEB项目的步骤详解
这篇文章主要为大家详细介绍了微信开发准备第一步,maven仓库管理新建web项目,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 在我们的项目开发中经常会遇到项目周期很长,项目依赖jar包特别多的情况,所以我们经常会在项目中引入Maven插件,建立起Maven项目,今天我就记录一个简单的Maven项目建立的简单流程! (一)Maven基础项目的建立(前提:你的开发工具中已经集成Maven插件) 新建项目——>建立Maven项目——>选择依赖——>项目名称等即可,大致流程如下: 这里要注意的是【第三张图片】和【第四张图片】,第四张图片增加一个选项可以将项目名称做到简单修改,参考图【第五张图片】,对项目名称有严格要求的可以作此参考! (二)Maven项目配置 可能有人会问前面已经建立了Maven项目,为啥还会有Maven项目配置这一项,我想当问这个问题的人建立过项目并且打开项目目录的时候就明白这一步的重要意义了,先来看看我们新建的项目的目录结构如下: 这个和我们平时开发中看到的项目目录结构完全不是一个样啊,难道是我们的Maven项目建立错了么,毫无疑问我们的项目建立是没有错的,下面我们来进行项目配置,达到我们想要的目录结构: 项目右键——>Build Path——>Libraries 修改Jar依赖版本,大致流程如下图: 到这里Maven的项目结构已经是我们需要的目录结构了,我们就可以将它纳入开发过程中了!在这过程中如有问题可以留言一起交流,谢谢翻阅! 以上就是微信开发之Maven仓库管理及新建WEB项目的步骤详解的详细内容,更多请关注米云其它相关文章!
2024-11-25 阅读全文 →
FWQ
小程序
详解mp、open、pay三大平台直接的关联
这篇文章主要介绍了java微信公众平台开发第十一步,微信开发中微信公众平台、开放平台和商户平台的关联,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 微信公众平台(map.weixin.qq.com)/开放平台(open.weixin.qq.com)/商户平台(pay.weixin.qq.com)这三个平台不知道大家有没有完全接触到,有人可能因为接触到其中的一个或者两个对其他的有些陌生或者说都不知道他们分别是干什么的,不要紧,那么这篇文章就带领你认知他们,不论你是一个微信开发者还是一个微信运营者,我相信你都会有足够的理由去认知和了解其中的一个或两个! (一)微信公众平台(map.weixin.qq.com) 官方介绍: 微信公众平台,给个人、企业和组织提供业务服务与能力的全新服务平台。 这个平台是针对普通用户(个人)、企业、组织提供服务的,是运营和开发者的领地!这里说白了就是订阅号、服务号、企业号给我们提供的服务,而微信公众平台也是提供登录、管理和操作处理这三类账号的平台,从注册到最后的登陆、、用户管理等操作都可以在这里处理,后面简称mp平台! (二)微信开放平台(open.weixin.qq.com) 官方介绍:开发平台是为微信用户提供服务的平台,而公众平台开发则是提供服务的基础,开发者在公众平台网站中创建公众号、获取接口权限后,可以通过阅读本接口文档来帮助开发! 这里主要是开发者的领地!我们可以从官方的介绍中可以发现这个平台主要是为了开发者服务的,其中涉及移动应用、网站应用、公众号开发、公众号第三方平台等有关微信登录、支付以及相关开发文档都可以在这里找到,简直就是微信和其他第三方应用接入的接口大全,后面简称open平台! (三)微信商户平台(pay.weixin.qq.com) 官方介绍:微信支付是腾讯公司的支付业务品牌,微信支付提供公众号支付、APP支付、扫码支付、刷卡支付等支付方式。微信支付结合微信公众账号,全面打通O2O生活消费领域,提供专业的互联网+行业解决方案,微信支付支持微信红包和微信理财通,是移动支付的首选。 在这个商户平台不仅提供开发者有关的开发文档,而且提供流水记录和红包等相关的运营策略,所以这里是开发者,运营者,财务的领地!所有使用微信支付,不论是扫码支付,app支付等所有的流水订单都可以在这里找到足迹,为我们的每一笔订单提供对账凭证和,后面简称pay平台! (四)mp平台、open平台、pay平台直接的关联 在我之前讲述的一些开发过程中我们一直用到一个唯一标识Openid,不知道有没有细心看文档的朋友,会发现在我们的微信开发文档中也有提及到一个唯一标识 UnionID,那么我们一直在用的Openid是不是用错了呢?答案当然是没错,这里容我们来详细讲述下Openid和UnionID之间的关系; openid的唯一标识是说在我们的微信公众平台下,一个个人微信对一个微信公众平台帐号(这里可以是订阅号、服务号、企业号)的微信标识,但是我们的open平台有个功能是一个开发者账号可以绑定最多10个微信公众平台账号、多个网站应用、多个移动应用,这个时候如何在一个微信开发者账号中识别10个map平台下用户的唯一性呢?这个时候UnionId就出现了,所以他的意义是可想而知的,如果在企业中既存在mp平台账号又存在web应用和移动应用的时候我们为了方便和去用户冗余性,在整体的设计中我相信大家都会采用UnionId来做微信登录的唯一标识的;但是回过头来说我们说openid是唯一标识也是没有错的,因为前面的我们的讲解都是针对单个公众平台账号来说的! 商户平台和用户以及mp平台之间的关系又是如何呢?从简单原则上来说mp平台和pay平台之间是一一对应的关系的,但是也存在微信开发者拥有微信支付开发权限存在微信商户子账号的存在,但是无论如何pay平台和用户之间的支付关系都是唯一的都是用过openid来产生的,不论是红包支付还是企业支付其依赖关系都是openid;下面我用我的“简笔画”向大家展示用户、mp平台、open平台、pay平台之间的关系: 【相关推荐】 1. 2. 以上就是详解mp、open、pay三大平台直接的关联的详细内容,更多请关注米云其它相关文章!
2024-11-25 阅读全文 →
FWQ
小程序
微信公众平台开发UnionID
微信公众平台更新,为开发者提供unionid机制 经开发者反馈,由于同一公司下多个公众号之间需要用户帐号互通,微信开放平台提供了UnionID机制,来解决此问题。 通过获取用户基本信息接口,开发者可通过OpenID来获取用户基本信息,而如果开发者拥有多个公众号,可使用以下办法通过UnionID机制来在多公众号之间进行用户帐号互通。 1. 将多个公众号绑定到同一个微信开放平台(open.weixin.qq.com)帐号下,即同一个Union下 2. 通过获取用户基本信息接口中的UnionID来区分用户的唯一性,不过需要注意的是:公众号只有在被绑定到微信开放平台帐号下后,才会获取UnionID。只要是同一个微信开放平台帐号下的公众号,用户的UnionID是唯一的。换句话说, 同一用户,对同一个微信开放平台帐号下的不同应用,UnionID是相同的。   一、注册微信开放平台 地址:http://open.weixin.qq.com/ 过程略。   二、绑定微信公众号 点击顶部 “管理中心”,选择进入“公众号”,再点击“绑定公众号” 只有通过微信认证的公众号才能绑定。   三、获取用户基本信息 这是使用高级接口中的获取用户基本信息来实现,方法参考 微信公众平台开发获取用户基本信息 在第一个公众号下面获得的方倍的用户信息如下: {     "subscribe": 1,     "openid": "oLVPpjqs9BhvzwPj5A-vTYAX3GLc",     "nickname": "方倍",     "sex": 1,     "language": "zh_CN",     "city": "广东",…
2024-11-25 阅读全文 →
FWQ
小程序
小程序之基础样式库–WeUI
todo:小程序集成weui WeUI 为微信 Web 服务量身设计。WeUI 是一套同微信原生视觉体验一致的基础样式库,由微信官方设计团队为微信 Web 开发量身设计,可以令用户的使用感知更加统一。包含button、cell、dialog、 progress、 toast、article、actionsheet、icon等各式元素。 1.使用微信开发者工具添加新项目MWL 2.下载WeUI的源码,把style文件拷贝到MWL根目录,与pages文件夹同一级 3.(WeiXin Style Sheets)是一套样式语言,用于描述 WXML 的组件样式。 WXSS 用来决定 WXML 的组件应该怎么显示。 为了适应广大的前端开发者,我们的 WXSS 具有 CSS 大部分特性。 同时为了更适合开发微信小程序,我们对 CSS…
2024-11-25 阅读全文 →
FWQ
小程序
微信开发入门(五)数据绑定
前几篇讲述微信小程序开发工具使用、生命周期和事件。 本次讲述微信小程序数据和绑定 >>>数据视图绑定 做前端开发的同学,尤其是WEB前端,每天都要跟视图打交道,假如你是用过,你就能体会到jQuery的代码冗余和操作不便性,需要手动管理视图和的数据一致性。 以下数据和对象等同。 传统的视图和   那么微信小程序是通过什么方法来管理视图和对象绑定的呢?-单向数据流。 状态模式定义一个对象,这个对象可以通过管理其状态从而使得应用程序作出相应的变化。   简单的讲,对象状态化,只要对象状态发送变化,就通知页面视图元素。 三个步奏: 1. 识别哪个UI元素被绑定了相应的对象。 2. 监视对象状态的变化。 3. 将所有变化传播到绑定的视图上。 注意数据流向是单向的,即视图变化不会影响对象状态。 <view> {{ message }} </view> 登录后复制 Page({  data: {    message: 'Hello MINA!'  } }) 登录后复制 就这么简单完成视图跟数据的绑定。 仅仅通过数据更新视图是不够的,用户操作引起视图更新,数据怎么同步呢? 这里要区分的是,用户触发事件不仅要考虑当前UI元素更新,还会通过当前元素更新其他视图。 所以视图上的数据都必须用过事件传递给对象,只有用户操作视图,才能获取到数据,并更新对象状态。 如下图:  …
2024-11-25 阅读全文 →
FWQ
小程序
关于微信小程序中框架的解析
这篇文章主要介绍了微信小程序 框架详解及实例应用的相关资料,需要的朋友可以参考下 快速了解微信小程序的使用,一个根据小程序的框架开发的todos app 微信官方已经开放微信小程序的官方文档和开发者工具。前两天都是在看相关的新闻来了解小程序该如何开发,这两天官方的文档出来之后,赶紧翻看了几眼,重点了解了一下文档中框架与组件这两个部分,然后根据简易教程,做了一个常规的todo app。这个app基于微信小程序的平台,实现了todo app的常规功能,同时为了让它更接近实际的工作场景,也用到了loading与toast这两个组件来完成一些操作的交互与反馈。这个平台给我的直观感受是,技术层面,它跟vue有相似性,但是远没有vue强大;开发时候的思路,不像vue,反倒觉得比较像backbone。所以要是使用过backbone,vue等mvc,mvvm框架的人,会觉得这个平台上手很容易。本文主要介绍这个todo app实现的一些要点。 先补充下本文相关的资料: 官方文档:https://mp.weixin.qq.com/debug/wxadoc/dev/index.html 官方开发者工具下载:https://mp.weixin.qq.com/debug/wxadoc/dev/devtools/download.html 本文todo app的功能演示: 注:需长按todo的text,才能直接编辑。因为是在手机端,所以不能使用双击事件来进行编辑,改成了长按事件。小程序的平台也没有提供双击事件的绑定。 相关源码:https://github.com/liuyunzhuge/blog/tree/master/todos/wx 如果你想在本地运行这个项目,需要先安装开发者工具,按照文档中简易教程的描述,先建好一个项目; 建完之后,开发者工具就会打开这个项目; 接着在磁盘上,找到建好的项目的文件夹,把里面的内容都删掉,把上面源码文件夹下的文件都粘贴进去; 然后重新打开开发者工具,先进入到编辑页签,然后点击编译按钮,就会直接进入到调试界面,查看app的功能: 下面来介绍下这个app开发的要点: 1. 这个app的目录结构以及配置等就不详细介绍了,这些在文档-框架部分都有很详细的描述。这个平台里面没有html和css,取而代之的是wxml和wxss。wxss跟css几乎没有区别,缺点就是不如css强大,支持的选择器有限。但是好处是由于只有微信这一个平台,所以几乎没有兼容性问题,能够使用标准的,更新的css技术。wxml里面只能用平台提供的那些组件的标签,html的标签不能直接用,各个组件的在wxml的使用方式,都可以在文档-组件这一部分找到说明的示例。所以实际上wxml跟wxss编写起来都没有什么难题。 2. wxml支持以下这些特性: 在todo app里面除了模板和引用没有用到之外,其它的都使用到了,不过没有使用到每个特性的各个细节,只根据app的需要选用合适的功能。前几天看到有文章说,微信小程序可能是基于vue框架来实现的,所以就看了下vue的文档。对于数据绑定,条件渲染,列表渲染,事件这几部分都详细看了vue的用法。对比下来,wxml提供的这些特性,跟vue的相关特性是还比较像,不过功能并没有那么多,所以也不能轻易地直接拿vue框架的特性用到小程序里面。最佳实践,还是基于官方文档中提供的说明来,如果官方文档中没有提到的功能,通过猜测的方式去用,肯定是行不通的。我通过打印的方式,查看一些对象的原型,也并没有发现比官方文档要多的一些实例方法,说明小程序的框架功能确实是有限的。 3. wxss其实是可以用less或者sass来写的,只要选择器满足框架的要求即可。由于时间原因,就没有在这个app里面去尝试了。…
2024-11-25 阅读全文 →
FWQ
小程序
微信小程序开发之e代驾Lite小程序详解
e代驾Lite是一款专业提供“到达快,服务好,保障全”代驾服务的小程序。通过移动互联网技术改善传统代驾服务行业,在大大降低代驾等候时间和代驾服务费用的同时,更将安全和便捷带给大众。 本文重点分析这款微信小程序的主要功能,以及对应的数据接口和采用的小程序组件/API技术。让我们离小程序更近一点,传递知识,分享收获。 功能1:显示首页 数据接口:进入首页,自动定位获取当前位置 用到的小程序组件:view,image,text,input,button 用到的小程序API: wx.getLocation 功能2:呼叫司机 数据接口:点击“呼叫司机”,系统自动为您联络司机进行派单 用到的小程序组件:view.text,button 用到的小程序API: wx.request 功能3:搜索地址 数据接口:进入搜索页面,输入位置,进行搜索 用到的小程序组件:view,text,image,form,input 用到的小程序API: wx.request 功能4:登录 数据接口: ①系统登录:进入小程序,小程序弹出登录请求 ②手机验证:点击注册登录,进行手机获取,进行登录 用到的小程序组件:input,form,button 用到的小程序API: wx.request, wx.login, wx.getUserInfo 总结: 「e代驾Lite」小程序有4个页面,用到的小程序组件有5个,用的小程序API有4个,分别如下:…
2024-11-25 阅读全文 →
FWQ
小程序
微信小程序中倒计时的实现代码
本篇文章给大家带来的内容是关于微信小程序中倒计时的实现代码,有一定的参考价值,有需要的朋友可以参考一下,希望对你有所帮助。 在商城商品信息里,会有倒计时的功能。 计算时间需要转化为时间戳,但是安卓和ios系统对于识别的时间格式是不一样的,安卓对识别没有要求。IOS格式要求 2018/08/20 10:20:32,使用Date.parse()转化时间戳不会出现在IOS端无法倒计时。 timeFormat: function(param) { //小于10的格式化函数     return param  {       var strtime = o.replace(/-/g, '/');       strtime = strtime.substring(0, 19);       let endTime = new Date(strtime).getTime();       let obj = null;       // 如果活动未结束,对时间进行处理       if (endTime - newTime &gt; 0) {         let time = (endTime - newTime) / 1000;         // 获取天、时、分、秒         let day = parseInt(time / (60 * 60 * 24));         let hou = parseInt(time % (60 * 60 * 24) / 3600);         let min = parseInt(time % (60 * 60 * 24) % 3600 / 60);         let sec = parseInt(time % (60 * 60 * 24) % 3600 % 60);         obj = {           day: this.timeFormat(day),           hou: this.timeFormat(hou),           min: this.timeFormat(min),           sec: this.timeFormat(sec)         }       } else { //活动已结束,全部设置为'00'         obj = {           day: '00',…
2024-11-25 阅读全文 →