잡히지 않은 ReferenceError : XLSX가 드롭 파일에 정의되지 않았습니다.

Excel 파일을 끌어다 놓을 수 있기를 원합니다. 그러나 내 통합 문서를 선언 할 때 어떤 이유로 인해 정의되지 않았습니다.잡히지 않은 ReferenceError : XLSX가 드롭 파일에 정의되지 않았습니다.

나는이 index.js를 var XLSX = require('xlsx');이있는 server.js에 연결하는 것이 없다고 생각합니다. 나는 보았고 온라인으로 보았고 올바른 해결책을 찾지 못했습니다. 나는 require() 안에 HTML을 사용하는 것을 피하고 싶다.

내가 생각하는 중요한 코드 :

server.js :

var express = require("express"); 
var app = express(); 
var XLSX = require('xlsx'); 
var fs = require('fs'); 
var JSON = require('JSON'); 
var path = require('path');

하는 index.js :

$(document).ready(function(){ 
var rABS = true; // true: readAsBinaryString ; false: readAsArrayBuffer 
    $excelHolder.on('drop', function(e){ 
     e.preventDefault(); 
     var files = e.originalEvent.dataTransfer.files; 
     var file = files[0]; 
     var reader = new FileReader(); 
     console.log("got to before reader"); 
     reader.onload = function (e) { 
      console.log("got to reader.onload"); 
      var data =e.target.result; 
      var workbook = XLSX.read(data, {type: rABS ? 'binary':'array'}); 

      var sheet_name_list = workbook.SheetNames; 
      var excelObj = XLSX.utils.sheet_to_json(workbook.Sheets[sheet_name_list[0]]); 
      var json = JSON.stringify(excelObj); 
      var callback = "looks like it worked"; 
      console.log("did it upload?"); 

      fs.writeFile('excelfile.json', json, function(err){ 
       (err) ? console.error(err) : console.log(callback.toString()); 
      }); 
      // preview? 
     }; 
     if(rABS) reader.readAsBinaryString(file); else reader.readAsArrayBuffer(file); 

    }); 
}

index.html을 :

<div class="huge">22</div> 
    <div>Uploads!</div> 
    <input name="uploads[]" type="file" accept=".xls,.xlsx,.ods,.csv" style="display: none;" id="excelInput">

하나를 도움을 많이 주시면 감사하겠습니다.

출처

2017-11-08 Christopher Chalfant

이 코드가 실행되는 위치가 명확하지 않습니까? 브라우저에 있습니까? –

예, 브라우저에서 실행 중입니다. –

나는 여기에 몇 가지 문제를 볼 수 있습니다

fs 및 path이 NodeJs에 내장 된 모듈이며, 따라서 그들이 브라우저에서 사용할 수 없습니다.
require을 클라이언트 측 코드로 사용하려면 JS 용 빌드 도구가 필요합니다. Browserify 및 Webpack은 좋은 출발점입니다.
당신이 그것에 들어가기를 원하지 않는다면 (나는 복잡하지 않으므로 당신을 비난하지 않을 것입니다!) <script> 태그를 가진 브라우저에 XLSX 모듈을 추가 할 수 있습니다 : 작동해야하는 것처럼 보입니다.
XLSX GitHub 페이지에 몇 가지 예가 있습니다. 그 중 하나는 드래그 & 드롭을 포함하며 원하는 위치로 이동할 수 있습니다. https://github.com/SheetJS/js-xlsx (구체적으로 https://github.com/SheetJS/js-xlsx/tree/master/demos/datagrid)

출처

2017-11-08 23:33:48

확인. 귀하의 답변에 감사드립니다. 나는 이것을 나중에 끝내기를 기다리고있다. 아마도 Browerify 나 Webpack을 사용하게 될 것입니다. –

잡히지 않은 ReferenceError : XLSX가 드롭 파일에 정의되지 않았습니다.

답변

관련 문제