AJAX를 사용하여 로컬 파일 읽기

Question

저는 AJAX의 초심자이며 다음과 같이 확인하고 싶습니다. 바탕 화면의 폴더에 모든 코드가 있고 AJAX를 사용하여 HTML의 div에 파일 내용을 출력하고 있습니다. AJAX를 통해 로컬 파일에 액세스하거나 서버에 파일이 있어야합니다.

난 그냥 처음 AJAX 기능을 테스트하고 있는데이 표시 오류 등의 문제에 직면하고의 .js에

Answer 1

자바 스크립트가 클라이언트 측에서 작동하지만이 제한되는 파일 액세스 "액세스가 거부되었습니다"가 할 수없는 너무 클라이언트 컴퓨터에서 로컬 파일에 액세스하십시오.

아약스를 사용하고 div를 통해 클라이언트를 표시 할 수있는 것보다 서버에 콘텐츠를 배치해야합니다.

Answer 2

파일 액세스는 모든 브라우저의 JavaScript 구현에서 시작부터 금지됩니다. 누군가는 브라우저에서 "보안 기능"을 수동으로 비활성화 할 수 있습니다. 예를 들어 Google 크롬의 경우 명령 줄 인수로 --disabled-web-security으로 실행 파일을 시작해야합니다. Firefox는 그 안에 about:config을 비활성화 할 수 있습니다.

어쨌든 공개적으로 코드를 작성하는 경우에는 그 방법에 의존 할 수 없습니다. 그러나 터널 끝에는 빛이 있습니다. "새로운"자바 스크립트 File API은 이미 Chrome에서 사용할 수 있으며, 다른 공급 업체는 추후에 추측합니다. 이 API는 "공식적으로"스크립트가 로컬 시스템의 파일을 읽을 수있게합니다.

Answer 3

보안상의 이유로 클라이언트의 파일 시스템에 대한 JavaScript 액세스가 제한되어 있습니다. (다른 사람의) JavaScript로 중요한 문서를 읽으 려 할 것인지를 고려하십시오.

현실적인 토폴로지로 실험하는 것이 가장 좋습니다. 실제 시스템에서 제공되는 서버에서 제공되는 것을 제공하십시오.

Apache와 같은 웹 서버를 개발 디렉토리를 가리 키도록 설정하는 것이 정말 쉽습니다. "서버"는 데스크톱을 위장한 것입니다. 따라서 편집/테스트주기가 정말 빠릅니다.

Answer 4

Ajax를 사용하여 파일에 로컬로 액세스 할 수 있기를 바랍니다. mozilla firefox로 시도해 보았습니다. 나는 2 개의 텍스트 파일을 만들고 같은 폴더에 넣었다. 여기에 코드가 있습니다. 실수가 있으면 죄송합니다.

function getXmlHttpRequestObject() { 
    if (window.XMLHttpRequest) { 
     return new XMLHttpRequest(); //Not IE 
    } 
    else if(window.ActiveXObject) { 
     return new ActiveXObject("Microsoft.XMLHTTP"); //IE 
    } 
    else { 
     alert("Your browser doesn't support the XmlHttpRequest object. Better upgrade to Firefox."); 
    } 
}   
var receiveReq = getXmlHttpRequestObject();  
function sayHello(fname) { 
    if (receiveReq.readyState == 4 || receiveReq.readyState == 0) { 
     receiveReq.open("GET", fname, true); 
     receiveReq.onreadystatechange = handleSayHello; 
     receiveReq.send(null); 
    }   
} 
function handleSayHello() { 
    if (receiveReq.readyState == 4) { 
     document.getElementById('span_result').innerHTML = receiveReq.responseText; 
    } 
} 

Here is the html code 
<select name="files" onchange="sayHello(this.value)"> 
<option value="">Select a file</option> 
<option value="file.txt">file.txt</option> 
<option value="file2.txt">file2.txt</option> 
<option value="ajax.html">Ajax.html</option> 
</select><br> 
<p>Contents of the file will be displayed below</p> 
<div id="span_result"></div> 

Answer 5

테스트 용으로 원할 경우 크롬에서 웹 보안을 사용하지 않도록 설정하면 작동합니다.