• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

C#开发微信小程序(一)

原作者: [db:作者] 来自: [db:来源] 收藏 邀请
因为博客园改版,导致这个系列的第一篇博客无法正常显示,所以另外copy了一篇
 
 
微信小程序相比于微信公众号的开发,区别在于微信小程序只请求第三方的数据,整个界面的交互(view)还是在微信小程序上实现,前后端完全分离,说白了,微信小程序开发与具体的后台语言无关,C#,Java,Python都行,只要前端UI开发完成,访问对应的数据服务接口,就成了,上手还是蛮简单的,而微信公众号的开发,是直接请求第三方的web界面。所以说微信小程序更轻量级,用来做一些餐饮店在线点单,小小的网上商城什么的,还是很方便的,不过有一个比较坑的地方是 微信小程序要求必须通过 HTTPS 完成与服务端通信,对于我这种只是来学习的人来说,还要购买SSL证书,然后搭建一个站点,也太麻烦了一点,那怎么办呢?其实,只要新建小程序的时候,不使用AppID来登录,就不会对https做校验了,当然,如果你要最终发布,还是需要搭建https的站点的,腾讯云or阿里云都可以申请免费的SSL证书。
 
批注:如果要正式发布,首先需要租用一台服务器至少3个月,并拥有一个固定IP,其次就是要购买域名以及SSL证书,当然域名有便宜的1块钱,SSL证书也有免费的可以使用,最后就是在网站发布后,要申请域名备案。一切准备妥当,小程序就可以上线了。
 
 
我看了一下文档之后,按照文档申请了小程序的开发者账号,并下载了开发工具,批注:没有账号是登录不了工具的。
 
看了一下官方文档,以及其他的一些资料之后,对微信小程序的开发有了一点肤浅的见解,那么:
 
首先,你需要熟悉html,css,js等一些web前端的开发语言,如果你还熟悉angularjs,那就更好了。
 
其次,你需要搭建一个http站点,用来作为服务端给微信小程序提供数据,我这里搭建的是一个web api的站点。
 
另外补充说明一下,现在MVVM前端框架很多angularjs,vue,后台MVVM框架WPF,数据驱动UI,WPF中的xaml与微信小程序中的wxml,数据绑定,WPF中的DataTemplate与微信小程序中的自定义组件等。
 
细节我就不多说了,比如如何新建一个web api程序,如果发布到iis,如何新建一个微信小程序,略过...
 
只记录一下我遇到一些问题:

1.如果API返回的是String类型的字符串,那么,小程序前端收到后,必须转成JSON对象,否则会异常,其次就是要注意区分大小写。

public string GetJson(string json)
        {
            return "{\"name\":\"dengwei\"}";
        }

在微信小程序的生命周期函数中请求这个服务:

/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
wx.request({
url: \'http://localhost:8080/api/lazyorders/GetJSON?json=1\',
success: function (res) {
console.log(res);
console.log(res.Name);
}
})
},

请求得到的数据如下:我们可以发现数据已经取到了,但是并不能直接取json数据中的name属性,即它不是一个有效的json对象。

再修改一下代码:把得到的字符串,通过js转成有效的json对象,然后再输出

/**
* 生命周期函数--监听页面显示
*/
onShow: function () {
wx.request({
url: \'http://localhost:8080/api/lazyorders/GetJSON?json=1\',
success: function (res) {
var data = res.data;
var json = JSON.parse(data);
console.log(json);
console.log(json.Name);
}
})
},

这下可以了,可以获取到name属性了,注意这里有一个细节的变化,打印出来的数据,是可以展开的了,key-value中的value值被标红了{name: "dengwei"}

空闲时间写的微信小程序demo运行效果,其中用到的图标可以在阿里图标库中下载:https://www.iconfont.cn/

源代码:2019-08-21更新

批注:这只是一个demo,我并没有完整的实现所有的功能,仅供参考。

https://e.coding.net/dwBurning/ReallyWantToApi.git

https://github.com/dwBurning/WeChatMiniProgram.git

https://e.coding.net/dwBurning/ReallyWantToApi.git

https://e.coding.net/dwBurning/ReallyWantToApi.git

 


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
上一篇:
微信小程序开发规范文档-WXML代码规范发布时间:2022-07-18
下一篇:
微信小程序入门教程之三:脚本编程发布时间:2022-07-18
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap