基于javascript处理二进制图片流过程详解


Posted in Javascript onJune 08, 2020

今天学习怎么生成二维码,我习惯所有请求都用ajax完成

但是今天发现jquery的ajax不支持二进制,只能搞纯文本

于是百度之后手动实现这一功能

function getBinary(url, args, success) {
  var xmlhttp = new XMLHttpRequest();
  var data = eval(args);
  var i = 0;
  for (var key in data) {
    if (i++ === 0) {
      url += '?' + key + "=" + data[key];
    } else {
      url += '&' + key + "=" + data[key];
    }
  }
  xmlhttp.open("GET", url, true);
  xmlhttp.responseType = "blob";
  xmlhttp.onload = function () {
    success(this.response);
  };
  xmlhttp.send();
}

我没有处理不同浏览器的XHR的问题 需要处理的在第一行搞就行

需要三个参数

地一个是请求url,第二个是请求参数,第三个是成功后的处理方法

请求参数用这样的方式

{‘param1':1,'param2':2,'param3':3}

处理方法要接收一个参数 就是响应的数据 也就是下图的data

然后是调用

function submit() {
  getBinary("/request/qrCode", {'data': $('#str').val()},
    function (data) {
      var img = $('#qrcode');
      window.URL.revokeObjectURL(img.src);
      $('#qrcode').attr('src', window.URL.createObjectURL(data));
    })
}

我这里是显示二维码

第五行的代码不能少 少了的话首次执行该方法没问题 再次执行的话图片不会改变 需要刷新页面

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
javascript 冒泡排序 正序和倒序实现代码
Dec 14 Javascript
通过正则表达式实现表单验证是否为中文
Feb 18 Javascript
js怎么判断flash swf文件是否加载完毕
Aug 14 Javascript
很棒的js选项卡切换效果
Jul 15 Javascript
深入理解JavaScript中的尾调用(Tail Call)
Feb 07 Javascript
React进阶学习之组件的解耦之道
Aug 07 Javascript
vue获取当前激活路由的方法
Mar 17 Javascript
BootStrap中的模态框(modal,弹出层)功能示例代码
Nov 02 Javascript
vue-cli3.0如何使用CDN区分开发、生产、预发布环境
Nov 22 Javascript
微信小程序开发常见问题及解决方案
Jul 11 Javascript
p5.js临摹动态图形实现方法详解
Oct 23 Javascript
es5 类与es6中class的区别小结
Nov 09 Javascript
vue-router的hooks用法详解
Jun 08 #Javascript
Vue自定义render统一项目组弹框功能
Jun 07 #Javascript
用云开发Cloudbase实现小程序多图片内容安全监测的代码详解
Jun 07 #Javascript
Electron整合React使用搭建开发环境的步骤详解
Jun 07 #Javascript
vue路由权限校验功能的实现代码
Jun 07 #Javascript
Vue使用自定义指令实现拖拽行为实例分析
Jun 06 #Javascript
JS原型对象操作实例分析
Jun 06 #Javascript
You might like
PHP4实际应用经验篇(5)
2006/10/09 PHP
php读取30天之内的根据算法排序的代码
2008/04/06 PHP
微盾PHP脚本加密专家php解密算法
2020/09/13 PHP
PHP实现将HTML5中Canvas图像保存到服务器的方法
2014/11/28 PHP
示例详解Laravel的注册重构
2016/08/14 PHP
js自动下载文件到本地的实现代码
2013/04/28 Javascript
jquery实现加载等待效果示例
2013/09/25 Javascript
解析URI与URL之间的区别与联系
2013/11/22 Javascript
JS创建对象几种不同方法详解
2016/03/01 Javascript
js实现(全选)多选按钮的方法【附实例】
2016/03/30 Javascript
Validform表单验证总结篇
2016/10/31 Javascript
jQuery实现的简单无刷新评论功能示例
2017/11/08 jQuery
vue项目引入字体.ttf的方法
2018/09/28 Javascript
vue.js中导出Excel表格的案例分析
2019/06/11 Javascript
vue.js中ref及$refs的使用方法解析
2019/10/08 Javascript
JavaScript实现沿五角星形线摆动的小圆实例详解
2020/07/28 Javascript
python处理json数据中的中文
2014/03/06 Python
python3调用R的示例代码
2018/02/23 Python
下载与当前Chrome对应的chromedriver.exe(用于python+selenium)
2020/01/14 Python
Python基础之列表常见操作经典实例详解
2020/02/26 Python
使用Numpy对特征中的异常值进行替换及条件替换方式
2020/06/08 Python
HTML5单页面手势滑屏切换原理分析
2017/07/10 HTML / CSS
H5混合开发app如何升级的方法
2018/01/10 HTML / CSS
英国优质家居用品网上品牌:URBANARA
2018/06/01 全球购物
廉政教育心得体会
2014/01/01 职场文书
公务员职业生涯规划书范文  
2014/01/19 职场文书
珍珠鸟教学反思
2014/02/01 职场文书
2014国庆节幼儿园亲子活动方案
2014/09/16 职场文书
2014年党员整改措施
2014/10/24 职场文书
离婚协议书格式
2014/11/21 职场文书
2014年工程师工作总结
2014/11/25 职场文书
公证处委托书
2015/01/28 职场文书
初中生思想道德自我评价
2015/03/09 职场文书
热血教师观后感
2015/06/10 职场文书
2016大学生暑期三下乡心得体会
2016/01/23 职场文书
JavaScript实现栈结构详细过程
2021/12/06 Javascript