微信小程序不温不火,时不时有人问起,入门了解文章,熟悉者勿入。
微信公众平台注册、下载开发工具等略过。
新建项目
我没有购买云服务,准备使用nodejs搭建服务器,故此选择不使用云。
新建完成后,效果如下
文档说明
文件类型
项目默认创建的文件类型为4类:
.wxml:页面结构文件,类似xml文件,效果等同于html文件
.wxss:页面样式文件
.js:脚本文件,页面逻辑
.json:页面配置文件
文件作用
app.json:公共配置文件
app.js:小程序逻辑
app.wxss:小程序公共样式表
project.config.json:开发者工具配置文件
sitemap.json:配置小程序及其页面是否允许被微信索引
配置文件的调整:比如,在首界面底部增加导航功能、增加页面、配置标题等,都可通过修改配置文件实现。
初始化:将打开的第一个页面,即pages配置中的第一个路径
授权登录后换取微信平台session代码
app.js
仅登录方法代码,其他部分略
// 登录
wx.login({
success: res => {
// 发送 res.code 到后台换取 openId, sessionKey, unionId
var code = res.code;
if (code && false) {
console.log('获取用户登录凭证:' + code);
wx.request({
url: 'http://127.0.0.1:8888/',
data: {code: code}
})
} else {
console.log('获取用户登录态失败:' + res.errMsg);
}
}
})
node文件server.js
使用node做开发服务器,访问微信平台
var http = require('http');
var url = require('url');
const https = require('https');
http.createServer(function (request, response) {
var code = url.parse(request.url,true).query.code;
var rawData = '';
https.get('https://api.weixin.qq.com/sns/jscode2session?appid=wx0180e2634a0e71f8&secret=af03606a56c1afff7e8ae7f4f1a43f6d&js_code='+ code +'&grant_type=authorization_code', (res) => {
console.log('状态码:', res.statusCode);
console.log('请求头:', res.headers);
res.on('data', (d) => {
rawData += d;
process.stdout.write(d);
});
res.on('end',()=>{ //数据接收完毕
console.log('rawData: ', rawData );
// 发送 HTTP 头部的状态值200,内容类型为text/json
response.writeHead(200, {'Content-Type': 'application/json; charset=utf-8'});
// 发送从远程服务器获取的响应数据
response.end(rawData.toString());
});
}).on('error', (e) => {
console.error(e);
});
}).listen(8888);
// 终端打印如下信息
console.log('Server running at http://127.0.0.1:8888/?code=021cbFdI1clFN300LDaI1uwLdI1cbFdn');
最终效果
更多内容请参考微信官网平台
本文仅个人记录用