# 基础配置
## 服务端安装think-weichat中间件
[https://github.com/akira-cn/think-wechat](https://github.com/akira-cn/think-wechat)
~~~
$ npm install think-wechat
~~~
## 配置 middleware
* 编辑 config/middleware.js
~~~js
const path = require('path');
const wechat = require('think-wechat')
const isDev = think.env === 'development';
module.exports = [
{
handle: wechat,
match: '/home/weixin',
options: {
token: 'weixin',
appid: 'wxf23493b0cf5d0804',
//encodingAESKey: '', //测试号不需要配置
checkSignature: true, // 可选,默认为true。由于微信公众平台接口调试工具在明文模式下不发送签名,所以如要使用该测试工具,请将其设置为false
},
},
{
handle: 'payload',
options: {
uploadDir: path.join(think.ROOT_PATH, 'runtime/data'),
},
},
];
~~~
**注意**:think-wechat 必须要在 payload 中间件前面加载,它会代替 payload 处理微信发过来的 post 请求中的数据。
* 根据 match 配置,增加对应的 controller 和 action
## 登陆微信官方开发者中心,配置接口信息
请填写接口配置信息,此信息需要你有自己的服务器资源,填写的URL需要正确响应微信发送的Token验证,请阅读[消息接口使用指南](http://mp.weixin.qq.com/wiki/index.php?title=%E6%B6%88%E6%81%AF%E6%8E%A5%E5%8F%A3%E6%8C%87%E5%8D%97)。
URL:[http://zengqingsong.oicp.net/home/weixin](http://zengqingsong.oicp.net/home/weixin)
Token:weixin
> 本地开发,可以使用花生壳做本地域名映射(微信公众号开发必须80端口,所以需要有公网的服务器,本地开发使用花生壳做代理)
支持的 action 包括:textAction、imageAction、voiceAction、videoAction、shortvideoAction、locationAction、linkAction、eventAction、deviceTextAction、deviceEventAction。
## DEMO
增加控制器home/controller/weixin
```
const DEFULT_AUTO_REPLY = '功能正在开发中~';
const BaseController = require('./base.js');
module.exports = class extends BaseController {
constructor(ctx) {
super(ctx);
}
//支持的 action
// 包括:textAction、imageAction、voiceAction、videoAction、shortvideoAction、locationAction、linkAction、eventAction、deviceTextAction、deviceEventAction。
// https://github.com/akira-cn/think-wechat https://github.com/node-webot/wechat
//微信公众号控制器
/**
* index action
* @return {Promise} []
*/
indexAction() {
///home/weixin/index?signature=6a8f855d69d080052142b85da4faafe149168a1d&echostr=7148202192707206511×tamp=1558920224&nonce=418613906
// 验证开发者服务器
// 这里只是演示,所以没做签名校验,实际上应该要根据微信要求进行签名校验
const echostr = this.get('echostr');
return echostr;
}
textAction() {
//发送文本消息
const {Content} = this.post();
//this.success('你发送给我的是:' + Content.trim());
this.success([
{
title: '你来我家接我吧',
description: '这是女神与高富帅之间的对话',
picurl: 'http://nodeapi.cloudfoundry.com/qrcode.jpg',
url: 'http://nodeapi.cloudfoundry.com/',
},
]);
}
eventAction() {
const message = this.post();
this.success(JSON.stringify(message));
}
__call() {
this.success(DEFULT_AUTO_REPLY);
}
};
```
- 内容介绍
- EcmaScript基础
- 快速入门
- 常量与变量
- 字符串
- 函数的基本概念
- 条件判断
- 数组
- 循环
- while循环
- for循环
- 函数基础
- 对象
- 对象的方法
- 函数
- 变量作用域
- 箭头函数
- 闭包
- 高阶函数
- map/reduce
- filter
- sort
- Promise
- 基本对象
- Arguments 对象
- 剩余参数
- Map和Set
- Json基础
- RegExp
- Date
- async
- callback
- promise基础
- promise-api
- promise链
- async-await
- 项目实践
- 标签系统
- 远程API请求
- 面向对象编程
- 创建对象
- 原型继承
- 项目实践
- Classes
- 构造函数
- extends
- static
- 项目实践
- 模块
- import
- export
- 项目实践
- 第三方扩展库
- immutable
- Vue快速入门
- 理解MVVM
- Vue中的MVVM模型
- Webpack+Vue快速入门
- 模板语法
- 计算属性和侦听器
- Class 与 Style 绑定
- 条件渲染
- 列表渲染
- 事件处理
- 表单输入绑定
- 组件基础
- 组件注册
- Prop
- 自定义事件
- 插槽
- 混入
- 过滤器
- 项目实践
- 标签编辑
- 移动客户端开发
- uni-app基础
- 快速入门程序
- 单页程序
- 底部Tab导航
- Vue语法基础
- 模版语法
- 计算属性与侦听器
- Class与Style绑定
- 样式与布局
- Box模型
- Flex布局
- 内置指令
- 基本指令
- v-model与表单
- 条件渲染指令
- 列表渲染指令v-for
- 事件与自定义属性
- 生命周期
- 项目实践
- 学生实验
- 贝店商品列表
- 加载更多数据
- 详情页面
- 自定义组件
- 内置组件
- 表单组件
- 技术专题
- 状态管理vuex
- Flyio
- Mockjs
- SCSS
- 条件编译
- 常用功能实现
- 上拉加载更多数据
- 数据加载综合案例
- Teaset UI组件库
- Teaset设计
- Teaset使用基础
- ts-tag
- ts-badge
- ts-button
- ta-banner
- ts-list
- ts-icon
- ts-load-more
- ts-segmented-control
- 代码模版
- 项目实践
- 标签组件
- 失物招领客户端原型
- 发布页面
- 检索页面
- 详情页面
- 服务端开发技术
- 服务端开发环境配置
- Koajs快速入门
- 快速入门
- 常用Koa中间件介绍
- 文件上传
- RestfulApi
- 一个复杂的RESTful例子
- 使用Mockjs生成模拟数据
- Thinkjs快速入门
- MVC模式
- Thinkjs介绍
- 快速入门
- RESTful服务
- RBAC案例
- 关联模型
- 应用开发框架
- 服务端开发
- PC端管理界面开发
- 移动端开发
- 项目实践
- 失物招领项目
- 移动客户端UI设计
- 服务端设计
- 数据库设计
- Event(事件)
- 客户端设计
- 事件列表页面
- 发布页面
- 事件详情页面
- API设计
- image
- event
- 微信公众号开发
- ui设计规范