2011-06-22 20 views
0

我正在嘗試使用HTML5和Javascript在Chrome中製作音頻播放器。但是,我得到了一個錯誤,在開始(文件不可讀)...Chrome上的HTML5中的文件輸入問題

下面是我的HTML代碼:

<head> 
    <meta charset="utf-8" /> 

    <!-- Always force latest IE rendering engine (even in intranet) & Chrome Frame 
    Remove this if you use the .htaccess --> 
    <meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1" /> 

    <title>index</title> 
    <meta name="description" content="" /> 
    <meta name="generator" content="Studio 3 http://aptana.com/" /> 
    <meta name="author" content="liuuzyan" /> 

    <!--<meta name="viewport" content="width=device-width; initial-scale=1.0" />--> 

    <!-- Replace favicon.ico & apple-touch-icon.png in the root of your domain and delete these references --> 
    <link rel="shortcut icon" href="/favicon.ico" /> 
    <link rel="apple-touch-icon" href="/apple-touch-icon.png" /> 

    <script src="js/jquery-1.6.1.min.js" type="text/javascript"></script> 
    <script src="js/fun.js" type="text/javascript"></script> 
</head> 

<body> 
    <audio id="player" controls="controls"> 
     Please use Firefox/Chrome/IE9 to browse this page. 
    </audio> 
    <input type="file" multiple="multiple" id="fileChose" /> 
</body> 

而下面是我的Javascript代碼:

$(document).ready(function() { 
    $('#fileChose').change(function() { 
     var fileList=this.files; 
     for(var i=0;i<fileList.length;i++) { 
      var reader=new FileReader(); 
      reader.onloaded=function(e){ 
       $('#player').attr('src',e.target.result) 
      } 
      reader.onerror=function(e){ 
       switch(e.target.error.code) { 
        case e.target.error.NOT_FOUND_ERR: 
          alert("file not found"); 
          break; 
        case e.target.error.NOT_READABLE_ERR: 
          alert("file not readable"); 
          break; 
        case e.target.error.ABORT_ERR: 
          alert("aborted"); 
          break; 
        default: 
          alert('generic error?'); 
       } 
      } 
      reader.readAsDataURL(fileList[i]); 
     } 
    }); 
}); 

任何人都可以幫助我解決這個問題?非常感謝!

+0

我已將Chrome更新到最新版本。和以前的錯誤代碼(4)被更改爲2 ...真的很奇怪我... – Zation

+0

問題解決了。只需上傳代碼到服務器,它工作正常。我認爲問題是由Chrome的安全系統與本地靜態HTML文件引起的。 – Zation

+0

是 - 我相信所有的瀏覽器,不僅僅是Chrome,都會阻止網頁讀取用戶機器上的文件。如果他們不這樣做,那將是專業安全研究人員稱之爲「一個巨大的安全漏洞」。 –

回答

0

在Chrome中,您可以添加: - 允許從文件訪問文件到Chrome命令行,以允許從本地HTML頁面讀取本地文件。

您也可以將代碼綁定爲Chrome擴展程序,並以此方式獲取本地文件訪問權限。

或者將HTML文件上傳到服務器,如前所述。