安装服务器
1
| npm install --save wechat-offiaccount
|
配置服务器
准备一份配置文件，比如在当前目录下有一个文件offiaccount.config.js，内容如下：
1
2
3
4
5
6
7
| // 具体的改为自己的即可
const config = {
port:8080,
appID: "",
appsecret: ""
}
module.exports = config
|
上述appID和appsecret字段在微信公众号账号下查看即可。
配置JS接口安全域名
比如你的项目地址是：http://192.168.0.6:20000/index.html（无需外网可以访问，如果电脑和手机连同一个wifi，像这里的例子，用局域网ip即可）访问，那么，“JS接口安全域名”中的域名配置成192.168.0.6:20000即可。
启动服务器
在package.json中配置启动命令：
1
2
3
4
5
| {
"scripts": {
"offiaccount": "offiaccount-cli --config offiaccount.config.js"
}
}
|
然后执行启动命令：
引入js-sdk
在你的项目index.html中引入：
1
| <script src="http://res2.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
|
初始化权限
在项目中加入如下代码：
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
| fetch("http://" + window.location.hostname + ":8080/JsApiSignature?url=" + window.location.href.split('#')[0], {
method: "get"
}).then(function (response) {
response.json()
.then(function (res) {
wx.config({
debug: true, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: res.appId, // 必填，公众号的唯一标识
timestamp: res.timestamp, // 必填，生成签名的时间戳
nonceStr: res.nonceStr, // 必填，生成签名的随机串
signature: res.signature,// 必填，签名
jsApiList: ['chooseImage'] // 必填，需要使用的JS接口列表
});
wx.error(function (res) {
alert("错误：" + res);
});
});
});
|
使用
我们以选择或者拍照为例：
1
2
3
4
5
6
7
8
9
10
11
12
13
| wx.ready(function () {
alert('准备好了！');
wx.chooseImage({
count: 1, // 默认9
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
success: function (res) {
var localIds = res.localIds; // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
alert(localIds)
}
});
});
|
