浅谈ajax请求不同页面的微信JSSDK问题


Posted in Javascript onFebruary 26, 2018

问题场景:

我在A页面有一个表单内容需要使用蓝牙打印机打印,填完表单信息,并通过ajax请求发送到 B文件(PHP)中处理信息,正常通过form表单跳转到B页面后,是可以打印出来的,因为B页面中除了处理 数据的PHP之外还混合了 JS代码,也就是JSSDK部分。然而通过ajax请求发送过去,则无响应,所有jssdk除了wx.ready和wx.config之外都无法执行。(A.B两个文件都有wx.config,wx.ready配置)

比如发送数据的参数:

wx.invoke('sendDataToWXDevice',data,function(res){
  //微信提供的接口,只有这么一个回调函数,如果通过ajax请求,则无法进入回调函数
 if(res.err_msg=='sendDataToWXDevice:ok')
 {
  alert("打印成功");
  window.history.go(-1);
 }
 else
 {
  alert("打印失败");
 } 
 });

于是我就猜测,通过请求PHP文件,返回的数据包含了我的B页面JS代码部分,也就是说,A页面有wx.config和wx.ready,B页面返回的内容也有这两个接口,为了排除这个问题,

我把B页面的所有微信接口全部去掉了。只剩下处理完表单需要发送的内容保存在一个input中。

//返回 处理后的数据
echo '<input type = "hidden" name = "print_str" id = "print_str" value="'.$hex_str.'"/ >';
echo '<input type = "hidden" name = "device_id" id = "device_id" value="'.$device_ID.'"/ >';
?>

由原本跳转页面打印改成异步请求打印,实际上,从微信发送数据给设备还是在A页面执行,B文件只是负责返回由A传给B并通过加密处理的数据,所以,删掉B文件中所有混写的html和JS代码,其中要注意的是config配置中是否包含 beta:true属性,因为涉及到硬件SDK需要,并且接口列表参数中是否也填写上了要用到的硬件SDK接口

我当时觉得我的想法是正确的。但是我每次在wx.invoke包括openWXDeviceLib,sendDataToWXDevice等的 回调函数中用document.write写下返回的结果,但是我很快发现每次wx.invoke后面的输出都不执行了,而且我原本页面的内容也被清空了,此时我还没意识到这个问题,还是不断测试,直到我在invoke之前输出了由B页面返回的数据(以上document.write内容都是我在请求成功后的success回调函数输出的),我才意识到,我要发送的数据,在我执行invoke方法的时候,已经变成了undefind,我才恍然发现,我的页面原本内容被清空了(因为之前是跳转到B页面打印,所以本身就是一片空白,~ ~,习惯了,没发现变化),后来我改用alert输出,就可以正常打印了,也就是说 JQUERY的ajax封装的回调函数中,用document.write输出,会重置页面内容(我之所以用document.write来输出的原因是,之前测试某个阶段中,原本作为调试的config是通过alert窗口弹出信息的,但是不知道为何他却以document.write的形式写在了页面上。我现在已经忘了当时是什么情况,所以才会导致这个错误,不过也算是知道了JQ的这个问题)

谨记:JQuery的ajax的success回调函数中用document.write输出内容会重置页面内容,至于其他回调函数会不会有兴趣可以自己看一下。

以上这篇浅谈ajax请求不同页面的微信JSSDK问题就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquery nth-child()选择器的简单应用
Jul 10 Javascript
Jquery拖拽并简单保存的实现代码
Nov 28 Javascript
JavaScript 注册事件代码
Jan 27 Javascript
PHP+MySQL+jQuery随意拖动层并即时保存拖动位置实例讲解
Oct 09 Javascript
javascript实现查找数组中最大值方法汇总
Feb 13 Javascript
jQuery实现底部浮动窗口效果
Sep 07 Javascript
Vue键盘事件用法总结
Apr 18 Javascript
Vue官方文档梳理之全局配置
Nov 22 Javascript
生成无限制的微信小程序码的示例代码
Sep 20 Javascript
JavaScript实现多球运动效果
Sep 07 Javascript
解决vant title-active-color与title-inactive-color不生效问题
Nov 03 Javascript
微信小程序实现底部弹出模态框
Nov 18 Javascript
详解Node 定时器
Feb 26 #Javascript
node.js基础知识小结
Feb 26 #Javascript
Es6 Generator函数详细解析
Feb 24 #Javascript
JavaScript中利用Array filter() 方法压缩稀疏数组
Feb 24 #Javascript
解决VUE框架 导致绑定事件的阻止冒泡失效问题
Feb 24 #Javascript
JS抛物线动画实例制作
Feb 24 #Javascript
浅谈VUE监听窗口变化事件的问题
Feb 24 #Javascript
You might like
PHP数据类型的总结分析
2013/06/13 PHP
如何使用FireFox插件FirePHP调试PHP
2013/07/23 PHP
Laravel框架生命周期与原理分析
2018/06/12 PHP
PHP safe_mode开启对于PHP系统函数有什么影响
2020/11/10 PHP
js复制到剪切板的实例方法
2013/06/28 Javascript
js 实现的可折叠留言板(附源码下载)
2014/07/01 Javascript
jQuery截取指定长度字符串代码
2014/08/21 Javascript
JavaScript实现获取dom中class的方法
2015/02/09 Javascript
JavaScript程序设计之JS调试
2015/12/09 Javascript
js和jQuery设置Opacity半透明 兼容IE6
2016/05/24 Javascript
浅谈jquery中使用canvas的问题
2016/10/10 Javascript
JavaScript中object和Object的区别(详解)
2017/02/27 Javascript
js a标签点击事件
2017/03/30 Javascript
在vue中添加Echarts图表的基本使用教程
2017/11/22 Javascript
Vue.js实现可配置的登录表单代码详解
2018/03/29 Javascript
如何从零开始利用js手写一个Promise库详解
2018/04/19 Javascript
微信小程序实现简单评论功能
2018/11/28 Javascript
如何在vue中使用HTML 5 拖放API
2021/01/14 Vue.js
Python通过递归遍历出集合中所有元素的方法
2015/02/25 Python
Python的Flask站点中集成xhEditor文本编辑器的教程
2016/06/13 Python
Python实现的栈(Stack)
2018/01/26 Python
详解flask表单提交的两种方式
2018/07/21 Python
用Python和WordCloud绘制词云的实现方法(内附让字体清晰的秘笈)
2019/01/08 Python
简单介绍django提供的加密算法
2019/12/18 Python
python算的上脚本语言吗
2020/06/22 Python
python实现简单遗传算法
2020/09/18 Python
python中pow函数用法及功能说明
2020/12/04 Python
斯凯奇澳大利亚官网:SKECHERS澳大利亚
2018/03/31 全球购物
如何通过 CSS 写出火焰效果
2021/03/24 HTML / CSS
上课看小说检讨书
2014/02/22 职场文书
追悼会主持词
2014/03/20 职场文书
家长寄语大全
2014/04/02 职场文书
金融保险专业求职信
2014/09/03 职场文书
党性分析自查总结
2014/10/14 职场文书
电工实训心得体会
2016/01/14 职场文书
vue项目多环境配置(.env)的实现
2021/07/21 Vue.js