zoukankan      html  css  js  c++  java
  • 在客户端展示本地图片

    当用户在客户端上请求本地图片的时候,我们需要把本地的图片展示。

    1.在控制器端把图片转换成流的形式

    2.前台请求控制器端的方法,输出图片

    控制器端:

     public class ImageController : Controller {
            private static readonly string PATH = @"C:UsersxiechongxiDesktop";
            //这个key就是图片的名字和后缀名
            public ActionResult GetImage(string key) {
                //path就包含了路径和文件名,后缀
                string path = Path.Combine(PATH, key);
                //ext是用GetExtension方法获取路径的后缀名
                string ext = System.IO.Path.GetExtension(path);
                //判断这个路径是否有图片
                if (System.IO.File.Exists(path)) {
                    //通过http返回一个image类型的文件
                    using (FileStream fs = System.IO.File.OpenRead(path)) {
                        return File(StreamToBytes(fs), "image/" + ext);
                    }
                }
                else {
                    return null;
                }
            }
    
            private byte[] StreamToBytes(Stream stream) {
                byte[] bytes = new byte[stream.Length];
                stream.Read(bytes, 0, bytes.Length);
                // 设置当前流的位置为流的开始
                stream.Seek(0, SeekOrigin.Begin);
                return bytes;
            }
        }
    Cotroller

    前台获取:

    //image表示的是ImageCotroller,@scene.LocalKey表示的是文件名,包含后缀名
    <img src="/image/@scene.LocalKey"/>
    Html

    是不是感觉Html里面很奇怪,<img src="/image/40ed9c2c-1d1c-470c-a760-7f860e9c309c.jpg">这种形式

    实际上为了美观更改了路由,可以参考一下以下路由设置

    public static void RegisterRoutes(RouteCollection routes) {
                routes.IgnoreRoute("{resource}.axd/{*pathInfo}");
    
                routes.MapRoute(
                    "Image",//路由名称
                    "Image/{key}",
                    new { controller = "Image", action = "GetImage" }
                );
    
                routes.MapRoute(
                    "Default", // 路由名称
                    "{controller}/{action}/{id}", // 带有参数的 URL
                    new { controller = "Follow", action = "Index", id = UrlParameter.Optional } // 参数默认值
                );
    
            }
    路由设置

    新添加的路由一定要放在默认路由上面,这里有个优先级,我也就不多说。

    流程是这样的img标签里面的src后面这个地址,是请求ImageCotroller中的GetImage方法(路由设置效果),并且传递参数(文件名和后缀),然后GetImage返回的是文件。


    注:此篇随笔只供参考使用,而且也有很多小瑕疵,最主要的不是代码,逻辑才是最重要的。

  • 相关阅读:
    LeetCode15题: 寻找三数和,附完整代码
    LeetCode 11 水池蓄水问题
    分布式初探——分布式事务与两阶段提交协议
    高等数学——讲透求极限两大方法,夹逼法与换元法
    书籍推荐——一本老书,吴军老师《数学之美》
    概率统计——期望、方差与最小二乘法
    算法浅谈——递归算法与海盗分金问题
    机器学习基础——带你实战朴素贝叶斯模型文本分类
    线性代数精华——从正交向量到正交矩阵
    LeetCode10 Hard,带你实现字符串的正则匹配
  • 原文地址:https://www.cnblogs.com/Joker37/p/7297773.html
Copyright © 2011-2022 走看看