如何显示二进制流的图片(利用img控件)

原创 2016年06月11日 08:47:09

之前在http://www.cnblogs.com/JsonZhangAA/p/5568575.html博文中是利用的image控件来显示的二进制流图片,我现在想的是能

通过普通的<img id="xx" src="xx"/>这种形式来显示我的二进制流图片吗?必须可以(◑▽◐),就是写法稍微麻烦了一点,img要写成这个样子:

,对你看的没错,它的地址指向了一个aspx页面,这个页面有个奇特之处,

就是我们新建后,不用写任何前台代码,WebForm1前后台代码如下:

前台:

<%@ Page Language="C#" AutoEventWireup="true" CodeBehind="WebForm1.aspx.cs" Inherits="显示爬虫所爬的数据库中的图片.WebForm1" %>

后台代码:

复制代码
using System;
using System.Collections.Generic;
using System.IO;
using System.Linq;
using System.Web;
using System.Web.UI;
using System.Web.UI.WebControls;
using 显示爬虫所爬的数据库中的图片.Models;

namespace 显示爬虫所爬的数据库中的图片
{
    public partial class WebForm1 : System.Web.UI.Page
    {
        protected void Page_Load(object sender, EventArgs e)
        {
            int id = int.Parse(Request["id"].ToString());
            DataClasses1DataContext db = new DataClasses1DataContext();
            Response.ContentType = "application/binary;";
            //这个地方图片可以从数据库中读取二进制图片  
            //byte[] img = DBHelper.ReadImg();  
            byte[] img = db.pictureUrl.Where(p=>p.Id==id).First().pictureUrl1.ToArray();
            Response.BinaryWrite(img);

            Response.Flush();
            Response.End();  
        }
    }
}
复制代码

我们主页面的前后台代码如下:

前台:

复制代码
<%@ Page Language="C#" Inherits="System.Web.Mvc.ViewPage<dynamic>" %>

<!DOCTYPE html>

<html>
<head runat="server">
    <meta name="viewport" content="width=device-width" />
    <title>Index</title>
</head>
<body>
    <div>
        <%foreach(var item in ViewBag.Pictures) %>
        <%{ %>
             <img src="WebForm1.aspx?id=<%:item.Id %>" />
        <%} %>
    </div>

</body>
</html>
复制代码

后台代码:

复制代码
using System;
using System.Collections.Generic;
using System.Drawing;
using System.IO;
using System.Linq;
using System.Text;
using System.Web;
using System.Web.Mvc;
using 显示爬虫所爬的数据库中的图片.Models;

namespace 显示爬虫所爬的数据库中的图片.Controllers
{
    public class HomeController : Controller
    {
        //
        // GET: /Home/
        DataClasses1DataContext db = new DataClasses1DataContext();
        public ActionResult Index()
        {
            ViewBag.Pictures = db.pictureUrl;
            return View();
        }
    }
}
复制代码

最后运行的结果:

相关文章推荐

前端将图片二进制流显示在html端

工作中碰到的问题,在处理接口返回的验证码图片时,由于返回的是encode编码代码,在js端获取到数据之后,通过函数encodeURI()来进行解码,之后可以通过在src中设置来实现图片显示: 实...

HTTP请求一张图片,转为流返回

简述: 实现用HTTP连接获取一张图片,在servlet中转为流之后输出,这样访问一个service之后就能直接得到图片流并显示出来 类似于访问一个图片的src(html)中会向一个http://...

将图片转成二进制并生成Base64编码,可以在网页中通过url查看图片

data格式的Url最直接的好处是,这些Url原本会引起一个新的网络访问,因为那里是一个网页的地址,现在不会有新的网络访问了,因为现在这里是网页的内容。这样做,会减少服务器的负载,当然同时也增加了当前...

html img Src base64 图片显示

大家可能注意到了,网页上有些图片的src或css背景图片的url后面跟了一大串字符,比如:data:image/png;base64, iVBORw0KGgoAAAANSUhEUgAAAAEAAAAk...

Java将图片作为二进制进行保存和读取

package com.suncn.common.util; import java.awt.image.BufferedImage; import java.io.ByteArrayI...

将接收的二进制流转换成图片保存

将接收的二进制流转换成图片保存/**

html中img显示图片的两种常用方式

html中img显示图片的两种常用方式

java IO流读取图片供前台显示

最近项目中需要用到IO流来读取图片以提供前台页面展示,由于以前一直是用url路径的方式进行图片展示,一听说要项目要用IO流读取图片感觉好复杂一样,但任务下达下来了,做为程序员只有选择去执行喽,于是找了...

ajax请求二进制流图片并渲染到html中img标签

说明后台返回图片二进制流,需要使用get请求获取返回结果,并且将返回的二进制流以图片形式显示在页面img中。 但是日常显示图片都诸如这种形式:以上需求不能将后端地址直接填入src(原因是需要获取图片...

在Delphi 中使用TFileStream以二进制方式保存文本文件注意事项

使用TFileStream 保存文本文件的一些注意事项
  • staryy
  • staryy
  • 2011年04月20日 16:07
  • 1682
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:如何显示二进制流的图片(利用img控件)
举报原因:
原因补充:

(最多只允许输入30个字)