步骤一:获取模板ID
有两个方法可以获取模版ID
通过模版消息管理接口获取模版ID
在微信公众平台手动配置获取模版ID
步骤二:页面的
组件,属性report-submit为true时,可以声明为需发模板消息,此时点击按钮提交表单可以获取formId,用于发送模板消息。或者当用户完成支付行为,可以获取prepay_id用于发送模板消息。步骤三:调用接口下发模板消息
今天重要的说第三步怎么实现,前面的步骤比较简单就略过。
----------------------------------------------------------------------------------------------------
1. 获取 access_token
https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET
后面会在发送模板消息的时候会用到access_token
2. 发送模板消息
接口地址:(ACCESS_TOKEN 需换成上文获取到的 access_token)
https://api.weixin.qq.com/cgi-bin/message/wxopen/template/send?access_token=ACCESS_TOKEN
注意说明:由于微信现在不让开发者直接在前端使用 https://api.weixin.qq.com 接口获取数据,所以下面的操作都必须由服务器后台来完成。
官方的POST参数:
{"touser": "OPENID","template_id": "TEMPLATE_ID","page": "index","form_id": "FORMID","data": {"keyword1": {"value": "339208499","color": "#173177"},"keyword2": {"value": "2015年01月05日 12:30","color": "#173177"},"keyword3": {"value": "粤海喜来登酒店","color": "#173177"} ,"keyword4": {"value": "广州市天河区天河路208号","color": "#173177"}
},"emphasis_keyword": "keyword1.DATA"}
var l = "https://api.weixin.qq.com/cgi-bin/message/wxopen/template/send?access_token=" +access_token;var tempData = new{
touser=openid,
template_id= "VErasH9Plzmyw9-PQjiggkBCa3hOU30qfvTaxD******",//这个是1、申请的模板消息id,
page ="pages/index/index",
form_id =formId,
data= new{
keyword1= new{
value=title,
color= "#666666"},
keyword2= new{
value= DateTime.Now.ToString("yyyy-MM-dd HH:mm:ss"),
color= "#9b9b9b"},
keyword3= new{
value=Remarks,
color= "#9b9b9b"}
},
color= "#666666"};
X.Component.Tools.WebClient wc= newX.Component.Tools.WebClient();var result = tempData.ToJson(); //Newtonsoft.Json.JsonConvert.SerializeObject(tempData);
wc.Encoding=System.Text.Encoding.UTF8;var obj = wc.Post(l, result); //得到返回的结果
注意 page路径
最后返回的结果:
{"data": {"success": true},"statusCode": 200,"header": {"Server": "Microsoft-IIS/7.5","Access-Control-Allow-Origin": "https://pubchem.ncbi.nlm.nih.gov","Cache-Control": "private","X-UA-Compatible": "chrome=1","Date": "Thu, 28 Sep 2017 04:46:34 GMT","X-AspNetMvc-Version": "4.0","Content-Type": "application/json; charset=utf-8","X-Powered-By": "ASP.NET","X-AspNet-Version": "4.0.30319","Content-Length": "16"},"errMsg": "request:ok"}
效果截图: