Programing/JavaScript

javascript 자바스크립트 파일 텍스트 읽기 text file read 방법, 파일데이터 추출, 공백제거

리커니 2017. 9. 22.
반응형

 

javascript 자바스크립트 파일 텍스트 읽기 text file read 방법, 파일데이터 추출, 공백제거

 

아래와 같은 파일을 읽어서 원하는 데이터를 추출해달라는 요청을 받았습니다.

 

 

우선 파일 읽어 데이터를 가져옵니다.

 

방법1. file값이 바뀔경우 바로 read

 

1
<input id="file1" class="ml8" type="file" style="width:300px;"/>
cs

 

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
 $(function(){
    //이벤트 리스너 등록.
    document.getElementById('file1').addEventListener('change', readFile1, false);
 
)};
 
function readFile1(e) { 
    var file = e.target.files[0];
 
    if (!file) {
           return;
    }
    var reader = new FileReader();
    reader.onload = function(e) {
        fileData = e.target.result;
        //file데이터를 읽어서 처리할 로직.
    };
    reader.readAsText(file, 'euc-kr');
}
cs

 

 

방법2. 특정 버튼을 눌렀을 경우 read

 

1
2
3
4
5
6
7
8
9
10
11
12
13
function readFile2(){ 
    var target = document.getElementById('file1'); 
 
    var file = target.files[0];
        if (!file) {
            return;
    }
    var reader = new FileReader();
    reader.onload = function(e) {
        fileData = e.target.result;
    };
    reader.readAsText(file, 'euc-kr');
cs

 

readFile1, readFile2 함수를 타게되면 input file로 선택한 파일의 텍스트를 읽어오게 됩니다.

읽어온 데이터를 프로토콜정의에 맞게 잘라서 사용하면 되겠죠 ㅎ 

복수의 파일을 읽어 처리하는 로직은 아래의 Link를 참고하세요.

 

혹시나 필요한 공백제거 함수는 아래 코드를 확인하세요.

 

1
2
3
4
5
6
7
8
9
10
11
12
13
function removeBlank(data){ 
    data = data.replace(/\n/g, "");//행바꿈제거
    data = data.replace(/(\s*)/g, "");  //모든 공백 제거
    data = data.replace(/\r/g, "");//엔터제거
    return data;

cs

 

Link : javascript 자바스크립트 멀티 파일 읽기, 복수의 파일 읽기, 여러개 파일 읽기, multi FileReader

 

 

반응형

댓글

💲 추천 글