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 相关文章推荐
javascript级联下拉列表实例代码(自写)
May 10 Javascript
自己写的Javascript计算时间差函数
Oct 28 Javascript
JS中attr和prop属性的区别以及优先选择示例介绍
Jun 30 Javascript
jquery实现简单的轮换出现效果实例
Jul 23 Javascript
详解JavaScript基于面向对象之创建对象(2)
Dec 10 Javascript
原生js实现中奖信息无间隙滚动效果
Jan 18 Javascript
在Vue中使用echarts的实例代码(3种图)
Jul 10 Javascript
详解vuex的简单使用
Mar 12 Javascript
vue全局组件与局部组件使用方法详解
Mar 29 Javascript
在Vue项目中用fullcalendar制作日程表的示例代码
Aug 04 Javascript
vue路由传参页面刷新参数丢失问题解决方案
Oct 08 Javascript
Vue——解决报错 Computed property &quot;****&quot; was assigned to but it has no setter.
Dec 19 Vue.js
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
PHP去掉从word直接粘贴过来的没有用格式的函数
2012/10/29 PHP
JavaScript实现滚动栏效果的方法
2015/04/27 PHP
php将html转成wml的WAP标记语言实例
2015/07/08 PHP
Centos PHP 扩展Xchche的安装教程
2016/07/09 PHP
php微信开发之带参数二维码的使用
2016/08/03 PHP
PHP判断文件是否被引入的方法get_included_files用法示例
2016/11/29 PHP
JavaScript 滚轮事件使用说明
2010/03/07 Javascript
jQuery对象和DOM对象使用说明
2010/06/25 Javascript
JS Pro-深入面向对象的程序设计之继承的详解
2013/05/07 Javascript
图片翻转效果具体实现代码
2014/01/09 Javascript
父页面显示遮罩层弹出半透明状态的dialog
2014/03/04 Javascript
ExtJS中设置下拉列表框不可编辑的方法
2014/05/07 Javascript
如何调试异步加载页面里包含的js文件
2014/10/30 Javascript
javascript实用方法总结
2015/02/06 Javascript
javascript结合canvas实现图片旋转效果
2015/05/03 Javascript
javascript从定义到执行 你不知道的那些事
2016/01/04 Javascript
基于JavaScript实现本地图片预览
2017/02/08 Javascript
在Js页面通过POST传递参数跳转到新页面详解
2017/08/25 Javascript
vuejs router history 配置到iis的方法
2018/09/20 Javascript
详解webpack 最简打包结果分析
2019/02/20 Javascript
原生js拖拽实现图形伸缩效果
2020/02/10 Javascript
electron踩坑之remote of undefined的解决
2020/10/06 Javascript
python常规方法实现数组的全排列
2015/03/17 Python
黑科技 Python脚本帮你找出微信上删除你好友的人
2016/01/07 Python
Windows下安装python MySQLdb遇到的问题及解决方法
2017/03/16 Python
python中不能连接超时的问题及解决方法
2018/06/10 Python
设置jupyter中DataFrame的显示限制方式
2020/04/12 Python
深入理解Python 多线程
2020/06/16 Python
匡威意大利官方商店 :Converse意大利
2018/11/27 全球购物
英国旅行箱包和行李箱购物网站:Travel Luggage & Cabin Bags
2019/08/26 全球购物
人力资源管理专业毕业生推荐信
2013/11/07 职场文书
企业安全生产演讲稿
2014/05/09 职场文书
公司投资建议书
2014/05/16 职场文书
python使用pygame创建精灵Sprite
2021/04/06 Python
golang中的并发和并行
2021/05/08 Golang
教你使用TensorFlow2识别验证码
2021/06/11 Python