主要内容在标题三,老手可直接跳到标题三。

本文主要解决个人开发者模板消息发送的问题(没有服务器,不能操作服务器的情况)

针对api.weinxin.qq.com不在以下合法域名列表内的问题提出的解决方案

一、入门

按照以下网址教程注册一个小程序账号,安装开发工具等一并安装完成。

https://mp.weixin.qq.com/debug/wxadoc/dev/index.html?t=201828

将上图中的appid和appSecret,复制保存下来,appid可以每次登陆上述网页查看,但appSecret只有重置。建议appid和appSecret复制粘贴到一个txt文件中,以后经常会用到。利用appid就可以建立小程序了。

在这里到发送模板消息之间还需要学习,请自行补相关知识。

二、模板信息

以下网址是微信对模板信息的官方解释,

https://mp.weixin.qq.com/debug/wxadoc/dev/api/notice.html

2.1模板发送条件

1、 支付:当用户在小程序内完成过支付行为,可允许开发者向用户在7天内推送有限条数的模板消息(1次支付可下发1条,多次支付下发条数独立,互相不影响) 

2、提交表单:当用户在小程序内发生过提交表单行为且该表单声明为要发模板消息的,开发者需要向用户提供服务时,可允许开发者向用户在7天内推送有限条数的模板消息(1次提交表单可下发1条,多次提交下发条数独立,相互不影响)

2.2主要步骤为以下三条

步骤1

主要是保存模板ID,建议和appid一样,复制粘贴到txt文件,保留以备后面使用

步骤2.就是满足模板信息发送的两个条件之一。这里用表单作为示例。

<form bindsubmit="formSubmit" report-submit='true'> //主要是这行代码要有

<!-- <button
form-type='submit'>submit</button> -->

<view class="weui-dialog__btn
weui-dialog__btn_default" bindtap="noneWindows">取消</view>

<button loading="{{loading}}" class="weui-dialog__btn
weui-dialog__btn_primary" formType="submit">提交</button>  //然后在有个按钮就行了

</view>

</form>

<button type='primary' bindtap='zhuce'>注册</button>   //用来获取openid的按钮,openid的内容后续会讲解

步骤3 模板信息的发送

按照教程转到发送模板消息

2.3 模板信息的发送

模板信息的发送分两步

2.3.1、获取token

access_token 是全局唯一接口调用凭据,开发者调用各接口时都需使用 access_token,请妥善保存。access_token 的存储至少要保留512个字符空间。access_token 的有效期目前为2个小时,需定时刷新,重复获取将导致上次获取的 access_token 失效。

公众平台的 API 调用所需的
access_token 的使用及生成方式说明:

为了保密 appsecrect,第三方需要一个 access_token 获取和刷新的中控服务器。而其他业务逻辑服务器所使用的
access_token 均来自于该中控服务器,不应该各自去刷新,否则会造成 access_token 覆盖而影响业务;

目前 access_token 的有效期通过返回的 expires_in 来传达,目前是7200秒之内的值。中控服务器需要根据这个有效时间提前去刷新新 access_token。在刷新过程中,中控服务器对外输出的依然是老
access_token,此时公众平台后台会保证在刷新短时间内,新老 access_token 都可用,这保证了第三方业务的平滑过渡;

access_token 的有效时间可能会在未来有调整,所以中控服务器不仅需要内部定时主动刷新,还需要提供被动刷新 access_token 的接口,这样便于业务服务器在 API 调用获知 access_token 已超时的情况下,可以触发 access_token 的刷新流程。

开发者可以使用 AppID 和 AppSecret
调用本接口来获取 access_token。AppID 和 AppSecret 可登录微信公众平台官网-设置-开发设置中获得(需要已经绑定成为开发者,且帐号没有异常状态)。AppSecret 生成后请自行保存,因为在公众平台每次生成查看都会导致 AppSecret 被重置。注意调用所有微信接口时均需使用 https 协议。如果第三方不使用中控服务器,而是选择各个业务逻辑点各自去刷新 access_token,那么就可能会产生冲突,导致服务不稳定。

2.3.2 发送模板消息

可以看到发送模板消息,需要首先获取用户的openid。

2.4 openid的获取

下面转到openid的获取

网上都说openid可以调用wx.login函数获取到code之后获取openid。下面网址是wx.login获取openid的官方介绍。

https://mp.weixin.qq.com/debug/wxadoc/dev/api/api-login.html#wxloginobject

如下图所示,利用接口地址获取到openid。

将上述地址利用wx.request访问时,在小程序中会报错,api.weixin.qq.com不在合法域名范围内等。在之前貌似可以直接通过在小程序后端添加合法域名就可以解决,如下图所示。网上教程大都这样解释。但是现在api.weixin.qq.com并添不进去。

但是大多数人都没有注意后面官方给出的登录时序图,从下图可以看出,上述接口地址是要通过第三方服务器访问微信服务器才能获得openid的。在小程序中不能直接访问,所以这就限制了没有服务器的开发者,比如我。那么怎么办呢,

三、模板消息解决办法

在这里可以选用Bmob的后端云服务器。

下面是Bmob的官方教程

https://docs.bmob.cn/data/wechatApp/b_developdoc/doc/index.html#小程序模板消息

要将上图中前四部规规矩矩的配置好,并试验添加一行数据可否正常运行已检验Bmob与小程序配置正常。

话不多说 上代码

Wxml文件代码:

<form bindsubmit="formSubmit" report-submit='true'> //主要是这行代码要有

<!-- <button
form-type='submit'>submit</button> -->

<view class="weui-dialog__btn
weui-dialog__btn_default" bindtap="noneWindows">取消</view>

<button loading="{{loading}}" class="weui-dialog__btn weui-dialog__btn_primary" formType="submit">提交</button> 
//然后在有个按钮就行了

</view>

</form>

<button type='primary' bindtap='zhuce'>注册</button>   //用来获取openid的按钮,openid的内容后续会讲解

Js代码:

var Bmob = require("../utils/bmob.js");

var common = require("../utils/common.js");//配置按照教程来

Bmob.initialize("这两个字符串教程里面有 要保证是自己的 不能复制别人的", "");

var openid;//储存openid

zhuce:function(){

wx.login({

success:function(res){

if (res.code) {

//发起网络请求

console.log(res.code)

Bmob.User.requestOpenId(res.code, {

success: function (result) {

that.setData({

loading: true,

url: result.openid

})

console.log(result.openid)

openid = result.openid

},

error: function (error) {

// Show the error
message somewhere

console.log("Error:
" + error.code + " " + error.message);

}

});

} else {

console.log('获取用户登录态失败!' + res.errMsg)

common.showTip('获取用户登录态失败!', 'loading');

}

}

})

}

formSubmit: function (e) {

var that = this

console.log(e.detail.formId)

var temp = {

"touser": openid, //

"template_id": "参数template_id为在微信公众号获取到的模板Id",

"page": "",//跳转界面 不填就没有跳转

"form_id": e.detail.formId,

"data": {

"first": {

"value": "您好,Restful 失效,请登录控制台查看。",

"color": "#c00"

},

"keyword1": {

"value": "339208499",

"color": "#173177"

},

"keyword2": {

"value": "339208499",

"color": "#173177"

},

"keyword3": {

"value": "339208499",

"color": "#173177"

},

"remark": {

"value": "如果您十分钟内再次收到此信息,请及时处理。"

}

},

"emphasis_keyword": ""

}

console.log(temp)

Bmob.sendMessage(temp).then(function (obj) {

console.log('发送成功')

},

function (err) {

common.showTip('失败' + err)

console.log(err)

});

},

为什么能解决问题呢,主要是bmob服务器帮你把你服务器上的事完成了,bomb向微信服务器请求openid。

注意要用手机调试运行。开发工具的模拟器获取到的formId是个模拟值。下面是我的运行情况

上述内容可能写的不够详尽,内容繁多,多多少少有些疏漏,若存在问题请在评论区评论,或者私戳我1583702011@qq.com

技术不易,酌情打赏


微信小程序模板发送,openid获取,以及api.weixin.qq.com不在合法域名内解决方法的更多相关文章

  1. PHP实现推送微信小程序模板消息

    这边只会写如何实现,至于在公众号管理后台添加模板消息可以参考这篇文章: https://www.cnblogs.com/txw1958/p/wechat-template-message.html,当 ...

  2. 微信小程序中发送模版消息注意事项

    在微信小程序中发送模版消息 参考微信公众平台Api文档地址:https://mp.weixin.qq.com/debug/wxadoc/dev/api/notice.html#模版消息管理 此参考地址 ...

  3. 微信小程序模板消息群发解决思路

    基于微信的通知渠道,微信为开发者提供了可以高效触达用户的模板消息能力,以便实现服务的闭环并提供更佳的体验.(微信6.5.2及以上版本支持模板功能.低于该版本将无法收到模板消息.) 模板推送位置:服务通 ...

  4. 微信小程序模板消息后端代码

    利用spring 事件发送模板消息 1.定义事件 import com.ruoyi.project.salerauth.domain.TemplateMessage; import org.sprin ...

  5. 微信小程序-form表单-获取用户输入文本框的值

    微信小程序-form表单-获取用户输入文本框的值 <input name='formnickname' class="textarea" placeholder=" ...

  6. 解决微信小程序中Date.parse()获取时间戳IOS不兼容的问题(IOS为NaN的问题)

    前端同事在做微信小程序时发现IOS获取的时间戳为空的问题,后来通过跟踪发现,原来是因为IOS系统不支持2017-01-01格式的时间导致的, var mydata = '2017-01-01 11:0 ...

  7. 120多套各种类别微信小程序模板源码打包下载

    120多套各种类别微信小程序模板源码打包下载,以下是部分截图欢迎下载!120多套各种类别微信小程序模板源码打包下载 下载地址:https://pan.baidu.com/s/1Cfqyc9p2ZDOc ...

  8. 微信小程序模板(template)和组件的区别

    template模块主要是展示,方法需要在使用template的页面中定义,对于通用的数据,最先想到或者理应是template,但是template有个缺点,那就是只是页面效果,不会有对应的js操作. ...

  9. 微信小程序入门与实战 常用组件API开发技巧项目实战*全

    第1章 什么是微信小程序? 第2章 小程序环境搭建与开发工具介绍 第3章 从一个简单的“欢迎“页面开始小程序之旅 第4章 第二个页面:新闻阅读列表 第5章 小程序的模板化与模块化 第6章 构建新闻详情 ...

随机推荐

  1. 十二个 ASP.NET Core 例子——中间件

    目录: 什么是中间件(IApplicationBuilder) 创建 顺序规则 Asp.Net Core 内置的中间件 1.什么是中间件 官方:中间件是组装成应用程序管道以处理请求和响应的软件.每个组 ...

  2. include指令与include动作的区别(面试要考)

    include指令: 语法格式:<%@ include file=" " ...%> 发生作用的时间:页面转换期间 包含的内容:页面的实际内容 转换成的servlet: ...

  3. 重启nginx后丢失nginx.pid的解决方法

    一,nginx的停止操作 停止操作是通过向nginx进程发送信号来实现的. 步骤1:查询nginx主进程号 复制代码 代码如下: ps -ef | grep nginx 在进程列表里 面找master ...

  4. javascript alert乱码的解决方法

    http://www.jb51.net/article/42805.htm 提示时中文乱码,拼音什么的都没有问题呀,下面我在论坛找到一解决办法,下面与大家分享. 解决办法一: 复制代码 代码如下: e ...

  5. 邓_thinkphp口试

    描述php框架开发 通过提供一个开发Web程序的基本架构,PHP开发框架把PHPWeb程序开发摆到了流水线上.换句话说,PHP开发框架有助于促进快速软件开发(RAD),这节约了你的时间,有助于创建更为 ...

  6. JDK、JRE、JVM详解

    JDK.JRE.JVM JDK包含JRE,而JRE包含JVM JDK(Java Development Kit)是针对Java开发员的产品,是整个Java的核心,包括了Java运行环境JRE.Java ...

  7. 【编程技巧】alert vs Ext.Msg.alert

    alert会阻塞程序的运行. Ext.Msg.alert是异步的,它的调用并不会停止浏览器中代码的执行.

  8. MySQL查询性能优化一则

    公司有一套Web系统, 使用方反馈系统某些页面访问速度缓慢, 用户体验很差, 并且偶尔还会出现HTTP 502错误. 这是典型的服务器端IO阻塞引发的问题,通过对访问页面的程序逻辑进行跟踪,发现问题应 ...

  9. ZooKeeper对比Eureka

    刚开始看到Eureka这个单词的时候真心不会念,查了后发现他有一个好听的名字,来,大家一起念 [ jʊ'rikə ] 简介 Eureka本身是Netflix开源的一款提供服务注册和发现的产品,并且提供 ...

  10. Traits技法

    扮演"特性萃取机"角色,萃取各个迭代器的特性(迭代器的相应类型) 模板特例化:提供一份template定义式,而其本身仍为templatization 通过class templa ...