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编程起步(第六课)
Jan 10 Javascript
Mootools 1.2教程 选项卡效果(Tabs)
Sep 15 Javascript
扩展JS Date对象时间格式化功能的小例子
Dec 02 Javascript
AngularJS入门心得之directive和controller通信过程
Jan 25 Javascript
jquery遍历json对象集合详解
May 18 Javascript
javascript中数组和字符串的方法对比
Jul 20 Javascript
详解ESLint在Vue中的使用小结
Oct 15 Javascript
解决使用layui的时候form表单中的select等不能渲染的问题
Sep 18 Javascript
原生JS实现天气预报
Jun 16 Javascript
Vue-router中hash模式与history模式的区别详解
Dec 15 Vue.js
利用JS判断元素是否为数组的方法示例
Jan 08 Javascript
Vue如何实现组件间通信
May 15 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导入模块文件分享
2015/03/17 PHP
各种效果的jquery ui(接口)介绍
2008/09/17 Javascript
用apply让javascript函数仅执行一次的代码
2010/06/27 Javascript
理解Javascript_08_函数对象
2010/10/15 Javascript
Node.js和MongoDB实现简单日志分析系统
2015/04/25 Javascript
JS实现简洁、全兼容的拖动层实例
2015/05/13 Javascript
JQuery菜单效果的两个实例讲解(3)
2015/09/17 Javascript
Vue.js每天必学之表单控件绑定
2016/09/05 Javascript
JQuery获取鼠标进入和离开容器的方向
2016/12/29 Javascript
AngularJS学习第一篇 AngularJS基础知识
2017/02/13 Javascript
使用jQuery的load方法设计动态加载及解决被加载页面js失效问题
2017/03/01 Javascript
js 简易版滚动条实例(适用于移动端H5开发)
2017/06/26 Javascript
Angularjs单选框相关的示例代码
2017/08/17 Javascript
angular4自定义组件详解
2017/09/28 Javascript
实现div滚动条默认最底部以及默认最右边的示例代码
2017/11/15 Javascript
vue使用vuex实现首页导航切换不同路由的方法
2019/05/08 Javascript
深入解析koa之中间件流程控制
2019/06/17 Javascript
npm qs模块使用详解
2020/02/07 Javascript
Element Carousel 走马灯的具体实现
2020/07/26 Javascript
[00:20]TI9不朽观赛名额抽取
2019/08/05 DOTA
在Python中使用异步Socket编程性能测试
2014/06/25 Python
举例讲解Python程序与系统shell交互的方式
2015/04/09 Python
python 日期操作类代码
2018/05/05 Python
Python实现的tcp端口检测操作示例
2018/07/24 Python
python3.6数独问题的解决
2019/01/21 Python
python 实现return返回多个值
2019/11/19 Python
使用CSS媒体查询(Media Queries)和JavaScript判断浏览器设备类型的方法
2014/04/03 HTML / CSS
美国礼品卡交易网站:Cardpool
2018/08/27 全球购物
争论的故事教学反思
2014/02/06 职场文书
教师远程培训感言
2014/03/06 职场文书
2015年幼儿教师个人工作总结
2015/05/20 职场文书
中秋节晚会开场白
2015/05/29 职场文书
标枪加油稿
2015/07/22 职场文书
《三国志》赏析
2019/08/27 职场文书
七年级作文(600字3篇)
2019/09/24 职场文书
JavaScript中MutationObServer监听DOM元素详情
2021/11/27 Javascript