jquery控制显示服务器生成的图片流


Posted in Javascript onAugust 04, 2015

首先把图片路径作为参数,ajax异步传到后台方法中上传服务器,直接用Jquery传是不行的,它没有权力跟服务器打交道,具体内容不废话了,直接看下文,介绍的很详细。

首先给大家展示下效果图:

jquery控制显示服务器生成的图片流

jquery控制显示服务器生成的图片流<

首先是第一副是初始的页面,第二副是点击submit之后服务端生成的二维码,没有保存图片直接将图片流转成字符串返回到页面。

简介:
首先,这种生成二维码方式,而且不需要保存的情况可以在前端使用脚本来实现,那我在项目里也是这样做的。

然后js好像是不能接受服务端的文件流进行操作的,出于安全考虑。如果这种方式是可以的话,请告诉我,谢谢。

既然不能获取文件流,那就获取字符串,<img>标签又有一种特殊的用法,在src中这般写法 data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAEAAAAkCAYAAABId……………. 后面一长串是图片的字符串,然后就是代码,写法很容易。

服务端:

public ActionResult GetFileASCII(string content)
{ 
  System.IO.MemoryStream ms=new System.IO.MemoryStream();
  //这一步是获取二维码
  QRCodeHelper.GetQRCode(content, ms);
  return Content(Convert.ToBase64String(ms.GetBuffer()));
}

客户端:

$.get('url/*服务端地址*/', { content: 'http://blog.sina.com.cn/s/blog_50042fab0100mcuy.html/*要生成二维码的内容*/' }, function (data) {
  $('#testimg').attr('src', 'data:image/png;base64,' + data);
});

总结:
代码很简单,不仅是二维码,然而不需要保存的图片就可以这样做,像'data:image/png;base64, 也可在服务端生成。

以上内容就是本文的全部内容,希望对大家有所帮助。

Javascript 相关文章推荐
js post方式传递提交的实现代码
May 31 Javascript
JavaScript 面向对象与原型
Apr 10 Javascript
JavaScript中的anchor()方法使用详解
Jun 08 Javascript
JavaScript 对象深入学习总结(经典)
Sep 29 Javascript
简单理解js的冒泡排序
Dec 19 Javascript
通过npm引用的vue组件使用详解
Mar 02 Javascript
微信小程序实现弹出菜单功能
Jun 12 Javascript
jQuery实现轮播图及其原理详解
Apr 12 jQuery
vue实现全匹配搜索列表内容
Sep 26 Javascript
微信小程序调用wx.getImageInfo遇到的坑解决
May 31 Javascript
Nuxt配置Element-UI按需引入的操作方法
Jul 06 Javascript
Element Cascader 级联选择器的使用示例
Jul 27 Javascript
JavaScript实现LI列表数据绑定的方法
Aug 04 #Javascript
用js编写的简单的计算器代码程序
Aug 04 #Javascript
javascript记住用户名和登录密码(两种方式)
Aug 04 #Javascript
js实现简易的单数字随机抽奖(0-9)
Mar 19 #Javascript
JavaScript运动减速效果实例分析
Aug 04 #Javascript
JavaScript仿静态分页实现方法
Aug 04 #Javascript
JavaScript实现选择框按比例拖拉缩放的方法
Aug 04 #Javascript
You might like
调整优化您的LAMP应用程序的5种简单方法
2011/06/26 PHP
PHP使用适合阅读的格式显示文件大小的方法
2015/03/05 PHP
mysql_escape_string()函数用法分析
2016/04/25 PHP
php封装的单文件(图片)上传类完整实例
2016/10/18 PHP
php 文件下载 出现下载文件内容乱码损坏的解决方法(推荐)
2016/11/16 PHP
PHP设计模式之装饰器模式定义与用法详解
2018/04/02 PHP
PHP实现数组根据某个字段进行水平合并,横向合并案例分析
2019/10/08 PHP
asp javascript 实现关闭窗口时保存数据的办法
2007/11/24 Javascript
下载站控制介绍字数显示的脚本 显示全部 隐藏介绍等功能
2009/09/19 Javascript
jquery 分页控件实现代码
2009/11/30 Javascript
Nodejs+express+html5 实现拖拽上传
2014/08/08 NodeJs
jQuery实现表单提交时判断的方法
2014/12/13 Javascript
实例详解jQuery Mockjax 插件模拟 Ajax 请求
2016/01/12 Javascript
javascript实现数字配对游戏的实例讲解
2017/12/14 Javascript
JS+CSS实现滚动数字时钟效果
2017/12/25 Javascript
Servlet3.0与纯javascript通过Ajax交互的实例详解
2018/03/18 Javascript
AngularJS 应用模块化的使用
2018/04/04 Javascript
vue刷新页面时去闪烁提升用户体验效果的实现方法
2018/12/10 Javascript
Python操作MySQL简单实现方法
2015/01/26 Python
python 网络爬虫初级实现代码
2016/02/27 Python
Python操作dict时避免出现KeyError的几种解决方法
2020/09/20 Python
python实现图片转字符画的完整代码
2021/02/21 Python
分享CSS3中必须要知道的10个顶级命令
2012/04/26 HTML / CSS
Html5新特性用canvas标签画多条直线附效果截图
2014/06/30 HTML / CSS
用html5的canvas和JavaScript创建一个绘图程序的简单实例
2016/07/06 HTML / CSS
英国最受信任的在线眼镜商之一:Fashion Eyewear
2019/10/31 全球购物
美国美食礼品篮网站:Gourmet Gift Baskets
2019/12/15 全球购物
python+selenium小米商城红米K40手机自动抢购的示例代码
2021/03/24 Python
小学音乐教学反思
2014/02/05 职场文书
计算机专业毕业生自荐信范文
2014/03/06 职场文书
2015入党自荐书范文
2015/03/05 职场文书
2016优秀教师先进个人事迹材料
2016/02/25 职场文书
测量JavaScript函数的性能各种方式对比
2021/04/27 Javascript
Python中常见的反爬机制及其破解方法总结
2021/06/10 Python
MySQL 那些常见的错误设计规范,你都知道吗
2021/07/16 MySQL
php双向队列实例讲解
2021/11/17 PHP