는 로컬 파일을 열 수 없습니다 - 크롬 : 크롬의 버전 : 지역 자원

Question

테스트 브라우저를로드 할 수 없습니다 52.0.2743.116

그것은 C '와 같은 지역에서 이미지 파일을 열 수있는 간단한 자바 스크립트입니다 : \ 002.jpg '

function run(){ 

    var URL = "file:///C:\002.jpg"; 

    window.open(URL, null); 

} 
run(); 

여기 내 샘플 코드입니다. https://fiddle.jshell.net/q326vLya/3/

적절한 제안을 해주십시오.

Answer 1

크롬 특히 블록 로컬 파일 액세스 보안상의 이유로 이런 식으로. 여기

은 크롬에서 플래그를 해결 (과 취약점에 시스템을 개방)하는 기사의 :

http://www.chrome-allow-file-access-from-file.com/

Answer 2

이렇게 할 수 있다면 파일 시스템에 액세스 할 수 있고 거기에서 사용할 수있는 데이터에 대해 잠재적으로 행동 할 수 있으므로 큰 보안 문제가됩니다 ... 운 좋게도 수행하려는 작업을 수행 할 수 없습니다.

로컬 리소스에 액세스해야하는 경우 컴퓨터에서 웹 서버를 시작하려고 할 수 있습니다.이 경우 사용자의 방법이 작동합니다. Chrome 설정에서 작동하는 것과 같은 다른 해결 방법이 가능하지만 항상 로컬 서버를 설치하는 등 다른 방법을 선호합니다 (아니요, 그렇게 어렵지 않습니다).

은 참조 :

• Open local files(file://) using Chrome
• Opening local files from chrome

Answer 3

좋아 사람들이, 내가 완전하게, 때로는이 오류 메시지 뒤에 보안상의 이유를 이해하지만 우리 해결 방법이 필요합니다 ... 여기에 제 것이 있습니다. ASP.Net (이 질문에 기초한 JavaScript가 아닌)을 사용하지만, 누군가에게 유용 할 수 있기를 바랍니다.

Google의 사내 앱에는 사용자가 네트워크 전체에 퍼져있는 유용한 파일에 대한 바로 가기 목록을 만들 수있는 웹 페이지가 있습니다. 이 바로 가기 중 하나를 클릭하면 이러한 파일을 열려고합니다 ... 물론 Chrome의 오류로 인해 이러한 문제가 발생하지 않습니다.

이 웹 페이지는 다양한 단축키를 나열하는 AngularJS와 1.x에서 사용합니다.

원래 내 웹 페이지는 파일을 가리키는 <a href..> 요소를 직접 만들려고했지만이 링크 중 하나를 클릭하면 "Not allowed to load local resource"오류가 발생합니다.

<div ng-repeat='sc in listOfShortcuts' id="{{sc.ShtCut_ID}}" class="cssOneShortcutRecord" > 
    <div class="cssShortcutIcon"> 
     <img ng-src="{{ GetIconName(sc.ShtCut_PathFilename); }}"> 
    </div> 
    <div class="cssShortcutName"> 
     <a ng-href="{{ sc.ShtCut_PathFilename }}" ng-attr-title="{{sc.ShtCut_Tooltip}}" target="_blank" >{{ sc.ShtCut_Name }}</a> 
    </div> 
</div> 

용액 ... 함수 자체가 매우 간단 ... 내 각도 컨트롤러 함수를 호출하는 코드로

<div ng-click="OpenAnExternalFile(sc.ShtCut_PathFilename);" > 
    {{ sc.ShtCut_Name }} 
</div> 

을 그 <a href..> 요소를 대체하는 것이었다

$scope.OpenAnExternalFile = function (filename) { 
    // 
    // Open an external file (i.e. a file which ISN'T in our IIS folder) 
    // To do this, we get an ASP.Net Handler to manually load the file, 
    // then return it's contents in a Response. 
    // 
    var URL = '/Handlers/DownloadExternalFile.ashx?filename=' + encodeURIComponent(filename); 
    window.open(URL); 
} 

그리고 내 ASP에서.인터넷 프로젝트,이 코드를 포함 DownloadExternalFile.aspx라는 핸들러 파일 추가 :

namespace MikesProject.Handlers 
{ 
    /// <summary> 
    /// Summary description for DownloadExternalFile 
    /// </summary> 
    public class DownloadExternalFile : IHttpHandler 
    { 
     // We can't directly open a network file using Javascript, eg 
     //  window.open("\\SomeNetworkPath\ExcelFile\MikesExcelFile.xls"); 
     // 
     // Instead, we need to get Javascript to call this groovy helper class which loads such a file, then sends it to the stream. 
     //  window.open("/Handlers/DownloadExternalFile.ashx?filename=//SomeNetworkPath/ExcelFile/MikesExcelFile.xls"); 
     // 
     public void ProcessRequest(HttpContext context) 
     { 
      string pathAndFilename = context.Request["filename"];    // eg "\\SomeNetworkPath\ExcelFile\MikesExcelFile.xls" 
      string filename = System.IO.Path.GetFileName(pathAndFilename);  // eg "MikesExcelFile.xls" 

      context.Response.ClearContent(); 

      WebClient webClient = new WebClient(); 
      using (Stream stream = webClient.OpenRead(pathAndFilename)) 
      { 
       // Process image... 
       byte[] data1 = new byte[stream.Length]; 
       stream.Read(data1, 0, data1.Length); 

       context.Response.AddHeader("Content-Disposition", string.Format("attachment; filename={0}", filename)); 
       context.Response.BinaryWrite(data1); 

       context.Response.Flush(); 
       context.Response.SuppressContent = true; 
       context.ApplicationInstance.CompleteRequest(); 
      } 
     } 

     public bool IsReusable 
     { 
      get 
      { 
       return false; 
      } 
     } 
    } 

을 그리고 그것 뿐이다.

사용자가 바로 가기 링크 중 하나를 클릭하면 OpenAnExternalFile 함수가 호출되어이 .ashx 파일을 열고 열고 자하는 파일의 경로 + 파일 이름을 전달합니다.

이 처리기 코드는 파일을로드 한 다음 해당 내용을 HTTP 응답으로 다시 전달합니다.

그리고 작업이 완료되면 웹 페이지에서 외부 파일을 엽니 다.

피어! 다시 - 크롬이 "Not allowed to load local resources"예외를 던져 버리는 이유가 있습니다. 따라서이 코드를주의 깊게 읽으십시오. 그러나이 코드를 게시하면이 제한 사항을 해결하는 데 매우 간단합니다.

그냥 마지막 코멘트 : 원래 질문은 파일 "C:\002.jpg"을 열려고했습니다. 은 수 없습니다. 귀하의 웹 사이트는 하나의 서버 (자체 C : 드라이브)에 설치되며 사용자의 C : 드라이브에 직접 액세스 할 수 없습니다. 따라서 가장 좋은 방법은 네트워크 드라이브의 어딘가에있는 파일에 액세스하기 위해 광산과 같은 코드를 사용하는 것입니다.

Answer 4

는

우리는 교실에서 크롬을 많이 사용하고 로컬 파일 작업에 필수입니다 ...이 나이의 종류 알고 있지만,이 같은 많은 질문을 참조하십시오.

우리가 사용하고있는 것은 "Chrome 용 웹 서버"입니다. 시작하고 폴더를 선택하고 URL (예 : 127.0.0.1:port)을 선택하십시오.

간단한 서버이며 PHP를 사용할 수 없지만 간단한 작업을 위해 해결책이 될 수 있습니다.

https://chrome.google.com/webstore/detail/web-server-for-chrome/ofhbbkphhbklhfoeikjpcbhemlocgigb

Answer 5

Web Server for Chrome를 사용하여 해결 방법이 있습니다.
다음은 단계입니다.

1. 크롬에 확장 프로그램을 추가하십시오.
2. (C : \ images)을 선택하고 원하는 포트에 서버 을 실행하십시오.

   function run(){ 
       // 8887 is the port number you have launched your serve 
       var URL = "http://127.0.0.1:8887/002.jpg"; 
   
       window.open(URL, null); 
   
   } 
   run(); 
   

   PS :

이제 쉽게 로컬 파일에 액세스하면 오류 어떤 크로스 원산지 액세스 에러에 직면 넣다 당신은 고급 설정에서 CORS 헤더 옵션을 선택해야 할 수도 있습니다.