浅谈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 相关文章推荐
prototype 学习笔记整理
Jul 17 Javascript
JavaScript 判断判断某个对象是Object还是一个Array
Jan 28 Javascript
JS调用页面表格导出excel示例代码
Mar 18 Javascript
用jquery实现动画跳到顶部和底部(这个比较简单)
Sep 01 Javascript
JavaScript开发人员的10个关键习惯小结
Dec 05 Javascript
基于jQuery实现最基本的淡入淡出效果实例
Feb 02 Javascript
JavaScript设置、获取、清除单值和多值cookie的方法
Nov 17 Javascript
jQuery实现鼠标经过购物车出现下拉框代码(推荐)
Jul 21 Javascript
AngularJS基础 ng-keydown 指令简单示例
Aug 02 Javascript
ES6使用let命令更简单的实现块级作用域实例分析
Mar 31 Javascript
vue双花括号的使用方法 附练习题
Nov 07 Javascript
vue导航栏部分的动态渲染实例
Nov 01 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使用DES进行加密与解密的方法详解
2013/06/06 PHP
PHP多个图片压缩成ZIP的方法
2020/08/18 PHP
Laravel监听数据库访问,打印SQL的例子
2019/10/24 PHP
AutoSave/自动存储功能实现
2007/03/24 Javascript
070823更新的一个[消息提示框]组件 兼容ie7
2007/08/29 Javascript
js获取下拉列表的值和元素个数示例
2014/05/07 Javascript
浅谈JS原型对象和原型链
2016/03/02 Javascript
JS传值出现中文参数乱码的解决方法
2016/06/30 Javascript
Angular实现下载安装包的功能代码分享
2017/09/05 Javascript
Vue父子模版传值及组件传值的三种方法
2017/11/27 Javascript
微信小程序分包加载代码实现方法详解
2019/09/23 Javascript
小程序实现按下录音松开识别语音
2019/11/22 Javascript
Angular8 实现table表格表头固定效果
2020/01/03 Javascript
微信小程序wx.navigateTo方法里的events参数使用详情及场景
2020/01/07 Javascript
vue 使用async写数字动态加载效果案例
2020/07/18 Javascript
[01:04:30]Fnatic vs Mineski 2018国际邀请赛小组赛BO2 第二场 8.17
2018/08/18 DOTA
PyQt实现界面翻转切换效果
2018/04/20 Python
解决已经安装requests,却依然提示No module named requests问题
2018/05/18 Python
Python 实现文件读写、坐标寻址、查找替换功能
2019/09/11 Python
Python tkinter常用操作代码实例
2020/01/03 Python
Python使用Tkinter实现转盘抽奖器的步骤详解
2020/01/06 Python
django rest framework serializer返回时间自动格式化方法
2020/03/31 Python
python使用OpenCV模块实现图像的融合示例代码
2020/04/10 Python
详解Anaconda安装tensorflow报错问题解决方法
2020/11/01 Python
python如何获得list或numpy数组中最大元素对应的索引
2020/11/16 Python
python集合的新增元素方法整理
2020/12/07 Python
Rakuten Kobo台湾:电子书、eReaders和Reading应用程式
2017/11/24 全球购物
瑞士最大的图书贸易公司:Orell Füssli
2019/12/28 全球购物
策划主管的工作职责
2013/11/24 职场文书
医学专业应届生的自我评价
2014/02/28 职场文书
2014年大学生四年规划书范文
2014/04/03 职场文书
经济信息系毕业生自荐信
2014/06/02 职场文书
科技工作者先进事迹
2014/08/16 职场文书
爱国主义教育基地观后感
2015/06/18 职场文书
2015年教务主任工作总结
2015/07/22 职场文书
宝宝满月宴答谢词
2015/09/30 职场文书