IE7下不允许显示用户本地图片的问题

最新推荐文章于 2018-09-26 17:14:11 发布

sallay

最新推荐文章于 2018-09-26 17:14:11 发布

阅读量2.5k

点赞数

分类专栏： JS&amp;HTML&amp;CSS 文章标签： ie javascript server iis file 工作

本文链接：https://blog.csdn.net/sallay/article/details/2932415

版权

JS&HTML&CSS 专栏收录该内容

34 篇文章 1 订阅

订阅专栏

在IE6.0中，用户可以在javascript中或许最终用户本地图片的长宽：

 
   <Script language=Javascript>
    function getLocalImageInfo( imgUrl )
    {
        var objImg = new Image();
        objImg.src = imgUrl;
        alert( objImg.width )     //the width of the local image  
        alert( objImg.height )    //the height of the local image  
    }
    //调用如下  
    getLocalImageInfo("file://c:/1.jpg");
</Script>
 
  

并且，在IE6.0中，在客户端本地上传图片前可以通过Javascript/html预览要上传的图片，并获取图片的文件大小：

 
   <html>
  <head>
     <title>Upload file</title>
  </head>
  <body>
     <input type="file" onchange="javascript:previewImage(this.value)" >
     <img id="img" />
     <script language="javascrtip">
          function previewImage( imgUrl )
          {
             var objImg = document.getElementById("img");
             objImg.src = imgUrl;
             alert( "the size of the image file:" + objImg.fileSize )
          }
     </script>
  </body>
</html>
 
  

Note: 上面的代码最好在img图片加载完毕后再取图片的大小，例如：objImg.onreadystatechange()=function{ if(objImg.readystate=="complete")............}

当在IE7中，如果上述代码放在客户机本机（以html的形式放在客户机器上，而不是放在IIS中通过http访问）以文件方式打开时仍然能实现IE6中的功能，但如果上述代码放在IIS中，用IE7 通过HTTP协议访问则不能正常工作。

经过查找资料才发现IE7在安全性方面做了提升，通过http访问的页面默认是没有访问用户本机图片文件的权限的，所以通过javascript获取不了本机的图片长宽，也不能将本机图片地址赋值给<img>对象。如果将所访问的站点放入“可信站点”列表中（IE7->工具->Internet选项->安全->可信站点），则可以如IE6一样正常工作。

如果不想通过客户将本站点设置为“可信”站点的方式来实现上传图片的预览及获取图片长宽信息，则可以利用style的"DXImageTransform.Microsoft.AlphaImageLoader" 滤镜来实现：

 
   <html >
<head id="Head1" runat="server">
    <title>Untitled Page</title>
    <script language=javascript>
        function setImagePreview( fileUrl )
        {            
            var objDivFilter = document.getElementById("divFilter")            
            
            if( fileUrl )
            {   
                objDivFilter.style.width = "400px";    
                objDivFilter.style.height = "400px";        //这个设置初始大小是必须的
                
                objDivFilter.style.filter="progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod = image)";   
                objDivFilter.filters.item("DXImageTransform.Microsoft.AlphaImageLoader").src = fileUrl;                           
        
                // get width and height
                alert( objDivFilter.offsetWidth)
                alert( objDivFilter.offsetHeight)
            }
        }
        
    </script>
</head>
<body>
    <form id="form1" runat="server">
    <div>
        <asp:FileUpload ID="txtFile" runat="server" Width="508px" onchange="javascript:setImagePreview( this.value );" />
  
        <br />
        <div id="divFilter" />
        
    </div>
    </form>
</body>
 
  

但上述办法还不能在客户端获取图片文件的大小，我也没有找到很好的解决方案。

另外：在.net中，可以在C#后台代码中获取图片的相应信息，只不过这种方式增加了一些不必要的网络传输过程，有一定的性能代价。

sallay

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
IE7下不允许显示用户本地图片的问题

在IE6.0中，用户可以在javascript中或许最终用户本地图片的长宽： function getLocalImageInfo( imgUrl ) { var objImg = new Image(); objImg.src = imgUrl; alert( objImg.width ) /
复制链接

扫一扫