วิธีการอ่านไฟล์ข้อความในเครื่อง?


371

ฉันพยายามเขียนโปรแกรมอ่านไฟล์ข้อความอย่างง่ายโดยการสร้างฟังก์ชั่นที่ใช้ในเส้นทางของไฟล์และแปลงแต่ละบรรทัดของข้อความให้เป็นอาร์เรย์อาร์ค แต่มันไม่ทำงาน

function readTextFile() {
  var rawFile = new XMLHttpRequest();
  rawFile.open("GET", "testing.txt", true);
  rawFile.onreadystatechange = function() {
    if (rawFile.readyState === 4) {
      var allText = rawFile.responseText;
      document.getElementById("textSection").innerHTML = allText;
    }
  }
  rawFile.send();
}

เกิดอะไรขึ้นที่นี่?

สิ่งนี้ยังไม่สามารถใช้งานได้หลังจากเปลี่ยนรหัสเล็กน้อยจากการแก้ไขครั้งก่อนและตอนนี้ก็ทำให้ฉันมีXMLHttpRequestข้อยกเว้น 101

ฉันได้ทดสอบสิ่งนี้บน Firefox แล้วมันใช้งานได้ แต่ใน Google Chrome มันใช้งานไม่ได้และมันทำให้ฉันมีข้อยกเว้น 101 ฉันจะทำให้มันทำงานบนไม่ใช่แค่ Firefox เท่านั้น แต่ยังใช้กับเบราว์เซอร์อื่น ๆ )?


สิ่งที่เกิดขึ้นโดยเฉพาะ ไม่มีอะไรในชุด? หรือเพียงแค่สิ่งที่ "ผิด" .. ?
PinkElephantsOnParade

คุณกำลังทดสอบเครื่องท้องถิ่นหรือไม่? ตรวจสอบให้แน่ใจในการทดสอบหาstatusของเช่นเดียวกับ0 200
Jeffrey Sweeney

1
@JeffreySweeney ใช่ฉันกำลังทดสอบสิ่งนี้กับเครื่องจักรในพื้นที่ ฉันได้เก็บไฟล์ข้อความไว้ที่เดียวกับ javascripts และ html
Danny

คำตอบ:


311

คุณต้องตรวจสอบสถานะ 0 (เช่นเมื่อโหลดไฟล์ในXMLHttpRequestเครื่องคุณจะไม่ได้รับสถานะคืนเนื่องจากไม่ใช่จากWebserver)

function readTextFile(file)
{
    var rawFile = new XMLHttpRequest();
    rawFile.open("GET", file, false);
    rawFile.onreadystatechange = function ()
    {
        if(rawFile.readyState === 4)
        {
            if(rawFile.status === 200 || rawFile.status == 0)
            {
                var allText = rawFile.responseText;
                alert(allText);
            }
        }
    }
    rawFile.send(null);
}

และระบุfile://ชื่อไฟล์ของคุณ:

readTextFile("file:///C:/your/path/to/file.txt");

2
ฉันกำลังทำสิ่งนี้อยู่บน mac ดังนั้นฉันจะยังคงระบุไฟล์: // ??
Danny

11
พยายามที่จะใส่file:///User/Danny/Desktop/javascriptWork/testing.txtในแถบ URL ของเบราว์เซอร์ของคุณและดูว่าคุณสามารถดูไฟล์ ..
Majid Laissi

21
มันไม่จำเป็นต้องเป็นเส้นทางที่แน่นอน .. มันใช้งานได้ดีสำหรับฉัน: readTextFile ('Properties / version.txt'); ขอบคุณ!
Sonic Soul

2
เนื่องจากเรามีการอ่านจากเว็บเซิร์ฟเวอร์ที่เราควรจะมีชุด async trueไป หากนี่เป็นการlocalค้นหาแบบง่ายให้ตั้งค่า async falseเป็น ok แต่onreadystatechangeไม่จำเป็นในขณะที่ตั้งค่าเป็นเท็จ นี่คือเอกสาร: w3schools.com/ajax/ajax_xmlhttprequest_send.asp
rambossa

149
สิ่งนี้จะไม่ทำงานใน Chrome (เบราว์เซอร์อื่น ๆ ที่เป็นไปได้) คุณจะได้รับ "คำขอข้ามแหล่งกำเนิดสนับสนุนเฉพาะโปรโตคอลโปรโตคอล: http, data, chrome, chrome-extension, https, chrome-extension-resource"
Rick Burgess

102

เยี่ยมชมJavascripture ! และไปส่วนreadAsTextและลองตัวอย่าง คุณจะสามารถทราบว่าฟังก์ชั่นreadAsTextของFileReaderทำงานอย่างไร

    <html>
    <head>
    <script>
      var openFile = function(event) {
        var input = event.target;

        var reader = new FileReader();
        reader.onload = function(){
          var text = reader.result;
          var node = document.getElementById('output');
          node.innerText = text;
          console.log(reader.result.substring(0, 200));
        };
        reader.readAsText(input.files[0]);
      };
    </script>
    </head>
    <body>
    <input type='file' accept='text/plain' onchange='openFile(event)'><br>
    <div id='output'>
    ...
    </div>
    </body>
    </html>

14
ลิงก์ดี แต่คุณควร "อ้างอิงส่วนที่เกี่ยวข้องที่สุดของลิงก์สำคัญเสมอในกรณีที่ไซต์เป้าหมายไม่สามารถเข้าถึงหรือออฟไลน์ถาวร" ดูฉันจะเขียนคำตอบที่ดีได้อย่างไร
4ae1e1

16
ตัวอย่างนี้เกี่ยวข้องกับไฟล์ข้อความที่ผู้ใช้ป้อน แต่ฉันคิดว่าคำถามเกี่ยวกับไฟล์ที่อยู่ภายในเซิร์ฟเวอร์
S. Kirby

@ S.Kirby ดังที่ได้กล่าวไว้โดย OP เพื่อตอบคำถามเกี่ยวกับว่ามันทำงานในพื้นที่หรือบนเซิร์ฟเวอร์ระยะไกล: เป็นของท้องถิ่นทั้งหมด ทั้งหมดในโฟลเดอร์เดียวไม่มีอะไรอื่น . นอกจากนี้คนอื่น ๆ (เช่นฉัน) อาจมีคำถามเกี่ยวกับวิธีการทำในพื้นที่
Simon Forsberg

102

หลังจากแนะนำfetch apiใน javascript แล้วการอ่านเนื้อหาไฟล์อาจไม่ง่ายกว่านี้

อ่านไฟล์ข้อความ

fetch('file.txt')
  .then(response => response.text())
  .then(text => console.log(text))
  // outputs the content of the text file

อ่านไฟล์ json

fetch('file.json')
  .then(response => response.json())
  .then(jsonResponse => console.log(jsonResponse))     
   // outputs a javascript object from the parsed json

อัปเดต 30/07/2018 (ข้อจำกัดความรับผิดชอบ):

เทคนิคนี้จะทำงานได้ดีในFirefoxแต่มันดูเหมือนว่าChromeของfetchการดำเนินการไม่สนับสนุนfile:///โครงการ URL ณ วันที่ของการเขียนโปรแกรมปรับปรุงนี้ (ทดสอบใน Chrome 68)

Update-2 (ข้อจำกัดความรับผิดชอบ):

เทคนิคนี้ไม่ได้ทำงานกับFirefoxเวอร์ชั่นสูงกว่า 68 (9 กรกฎาคม 2019) สำหรับเดียวกัน (ปลอดภัย) เหตุผลว่า CORS request not HTTPChrome: ดูhttps://developer.mozilla.org/en-US/docs/Web/HTTP/CORS/Errors/CORSRequestNotHttp


4
ยอดเยี่ยม! การอ้างถึงมาตรฐานการดึงข้อมูล: "ให้การจัดการที่สอดคล้องกันของ: แผนการ URL, การเปลี่ยนเส้นทาง, ความหมายข้ามแหล่งกำเนิด, CSP, พนักงานบริการ, เนื้อหาแบบผสม, Referer" ฉันเดาว่านี่หมายถึงลาเพื่อ ol'FileReaders และ HttpRequests ที่ดี (และฉันจะไม่คิดถึงพวกเขาสักนิด)
Armfoot

1
แต่คุณจะใช้ข้อความและวางลงในตัวแปรสตริงเพื่อใช้งานที่อื่นได้อย่างไร (ฉันยังคงได้รับ 'ไม่ได้กำหนด' ไม่ว่าฉันจะทำอะไร)
not2qubit

2
@ not2qubit การดึงไฟล์ข้อความเป็นการดำเนินการแบบ async คุณไม่ได้กำหนดเนื่องจากคุณใช้ตัวแปรก่อนที่ไฟล์จะถูกอ่านอย่างสมบูรณ์ คุณต้องใช้มันในสัญญาการติดต่อกลับหรือใช้ตัวดำเนินการอย่าง javascript "async คอย"
Abdelaziz Mokhnache

13
Fetch API cannot load file:///C:/Users/path/to/file/file.txt. URL scheme must be "http" or "https" for CORS request.
Jacob Schneider

1
ความเข้ากันได้ของเบราว์เซอร์: developer.mozilla.org/en-US/docs/Web/API/…
Sam Murphy

39

var input = document.getElementById("myFile");
var output = document.getElementById("output");


input.addEventListener("change", function () {
  if (this.files && this.files[0]) {
    var myFile = this.files[0];
    var reader = new FileReader();
    
    reader.addEventListener('load', function (e) {
      output.textContent = e.target.result;
    });
    
    reader.readAsBinaryString(myFile);
  }   
});
<input type="file" id="myFile">
<hr>
<textarea style="width:500px;height: 400px" id="output"></textarea>


9
ฉันไม่แน่ใจว่านี่ตอบคำถามอายุ 4 ปีนี้หรือไม่ OP ไม่ได้อัปโหลดเอกสาร แต่พวกเขาพยายามอ่านไฟล์ข้อความในไดเรกทอรีเดียวกันจากพา ธ และถ้าคุณจะตอบคำถามอย่างน้อยคนนี้อย่างน้อยก็เขียนสรุปสั้น ๆ ว่าทำไมคุณถึงคิดว่าคำตอบของคุณดีกว่าคนอื่นหรือว่าภาษามีการเปลี่ยนแปลงอย่างไรตั้งแต่คำถามเพื่อรับประกันคำตอบใหม่
Matthew Ciaramitaro

1
ใช้ html ที่ป้อนไฟล์อัพโหลดที่มีอยู่ของฉันเอง - คัดลอกบรรทัดจากvar reader = new FileReader();ถึงreader.readAsBinaryString(..)- มันอ่านเนื้อหาของไฟล์ข้อความของฉัน สะอาดสง่างามทำงานเหมือนมีเสน่ห์ คำตอบที่ดีที่สุดในหัวข้อนี้สำหรับฉัน - ขอบคุณ!
Gene Bo

18

Jon Perryman

ใช่ js สามารถอ่านไฟล์ท้องถิ่น (ดู FileReader ()) แต่ไม่โดยอัตโนมัติ: ผู้ใช้มีการส่งผ่านไฟล์หรือรายการของไฟล์สคริปต์กับ <input type=file>HTML

จากนั้นด้วย js จะสามารถประมวลผล (มุมมองตัวอย่าง) ไฟล์หรือรายการไฟล์คุณสมบัติบางอย่างของพวกเขาและเนื้อหาไฟล์หรือไฟล์

สิ่งที่ js ไม่สามารถทำได้ด้วยเหตุผลด้านความปลอดภัยคือการเข้าถึงโดยอัตโนมัติ (โดยไม่มีการป้อนข้อมูลผู้ใช้) ไปยังระบบไฟล์ของคอมพิวเตอร์

ในการอนุญาตให้ js เชื่อมต่อกับ local fs โดยอัตโนมัติจำเป็นต้องสร้างไม่ใช่ไฟล์ html ที่มี js อยู่ข้างใน แต่เป็นเอกสาร hta

ไฟล์ hta สามารถมี js หรือ vbs อยู่ข้างใน

แต่ไฟล์ปฏิบัติการ hta จะทำงานบนระบบ windows เท่านั้น

นี่คือพฤติกรรมของเบราว์เซอร์มาตรฐาน

Google Chrome ยังทำงานที่ fs api, ข่าวสารเพิ่มเติมได้ที่นี่: http://www.html5rocks.com/en/tutorials/file/filesystem/


นี่คือความคิดเห็นที่ฉันต้องการ ทุกคนใส่รหัสสำหรับการป้อนข้อมูลของผู้ใช้ของไฟล์เป็นแท็กอินพุต แต่คำถามคือการใช้ไฟล์โดยอัตโนมัติจากเส้นทางที่กล่าวถึงในรหัสโดยผู้ใช้ ขอบคุณ!
Kumar Kartikeya


12

ลองสร้างสองฟังก์ชัน:

function getData(){       //this will read file and send information to other function
       var xmlhttp;

       if (window.XMLHttpRequest) {
           xmlhttp = new XMLHttpRequest();               
       }           
       else {               
           xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");               
       }

       xmlhttp.onreadystatechange = function () {               
           if (xmlhttp.readyState == 4) {                   
             var lines = xmlhttp.responseText;    //*here we get all lines from text file*

             intoArray(lines);     *//here we call function with parameter "lines*"                   
           }               
       }

       xmlhttp.open("GET", "motsim1.txt", true);
       xmlhttp.send();    
}

function intoArray (lines) {
   // splitting all text data into array "\n" is splitting data from each new line
   //and saving each new line as each element*

   var lineArr = lines.split('\n'); 

   //just to check if it works output lineArr[index] as below
   document.write(lineArr[2]);         
   document.write(lineArr[3]);
}

สำหรับสิ่งที่เบราว์เซอร์ใช้งานได้ (ดูเหมือนว่ามี 6 คนลองใช้งาน :-))
Xan-Kun Clark-Davis

11

ตัวอย่างอื่น ๆ - โปรแกรมอ่านของฉันพร้อมคลาส FileReader

<html>
    <head>
        <link rel="stylesheet" href="http://code.jquery.com/ui/1.11.3/themes/smoothness/jquery-ui.css">
        <script src="http://code.jquery.com/jquery-1.10.2.js"></script>
        <script src="http://code.jquery.com/ui/1.11.3/jquery-ui.js"></script>
    </head>
    <body>
        <script>
            function PreviewText() {
            var oFReader = new FileReader();
            oFReader.readAsDataURL(document.getElementById("uploadText").files[0]);
            oFReader.onload = function (oFREvent) {
                document.getElementById("uploadTextValue").value = oFREvent.target.result; 
                document.getElementById("obj").data = oFREvent.target.result;
            };
        };
        jQuery(document).ready(function(){
            $('#viewSource').click(function ()
            {
                var text = $('#uploadTextValue').val();
                alert(text);
                //here ajax
            });
        });
        </script>
        <object width="100%" height="400" data="" id="obj"></object>
        <div>
            <input type="hidden" id="uploadTextValue" name="uploadTextValue" value="" />
            <input id="uploadText" style="width:120px" type="file" size="10"  onchange="PreviewText();" />
        </div>
        <a href="#" id="viewSource">Source file</a>
    </body>
</html>

2
ไฟล์ที่ส่งคืน base64
VP

6

ใช้ฟังก์ชั่นFetchและ async

const logFileText = async file => {
    const response = await fetch(file)
    const text = await response.text()
    console.log(text)
}

logFileText('file.txt')

7
ฉันได้รับ 'แบบแผน URL ต้องเป็น "http" หรือ "https" สำหรับคำขอ CORS'
Qwerty

ขอบคุณใช้งานได้สำหรับฉัน!
oscarAguayo

5

สิ่งนี้อาจช่วย

    var xmlhttp = window.XMLHttpRequest ? new XMLHttpRequest() : new ActiveXObject("Microsoft.XMLHTTP");

    xmlhttp.onreadystatechange = function () {
        if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
            alert(xmlhttp.responseText);
        }
    }

    xmlhttp.open("GET", "sample.txt", true);
    xmlhttp.send();

5

โซลูชั่นที่ทันสมัย:

<input type="file" onchange="this.files[0].text().then(t => console.log(t))">

เมื่อผู้ใช้อัปโหลดไฟล์ข้อความผ่านทางอินพุตนั้นมันจะถูกบันทึกไว้ในคอนโซล นี่คือตัวอย่าง jsbin ที่ใช้งานได้

นี่เป็นเวอร์ชั่นที่ละเอียดมากขึ้น:

<input type="file" onchange="loadFile(this.files[0])">
<script>
  async function loadFile(file) {
    let text = await file.text();
    console.log(text);
  }
</script>

ปัจจุบัน (มกราคม 2020) สิ่งนี้ใช้ได้เฉพาะใน Chrome และ Firefox ตรวจสอบความเข้ากันได้ที่นี่หากคุณกำลังอ่านสิ่งนี้ในอนาคต: https://developer.mozilla.org/en-US/docs/Web/API/Blob/text

สำหรับเบราว์เซอร์รุ่นเก่าสิ่งนี้ควรใช้งานได้:

<input type="file" onchange="loadFile(this.files[0])">
<script>
  async function loadFile(file) {
    let text = await (new Response(file)).text();
    console.log(text);
  }
</script>

2

เมื่อเพิ่มคำตอบข้างต้นโซลูชันที่ปรับเปลี่ยนนี้ใช้งานได้สำหรับฉัน

<input id="file-upload-input" type="file" class="form-control" accept="*" />

....

let fileInput  = document.getElementById('file-upload-input');
let files = fileInput.files;

//Use createObjectURL, this should address any CORS issues.
let filePath = URL.createObjectURL(files[0]);

....

function readTextFile(filePath){
    var rawFile = new XMLHttpRequest();
    rawFile.open("GET", filePath , true);
    rawFile.send(null);

    rawFile.onreadystatechange = function (){
        if(rawFile.readyState === 4){
            if(rawFile.status === 200 || rawFile.status == 0){
                var allText = rawFile.responseText;
                console.log(allText);
            }
        }
    }     
}

2
function readTextFile(file) {
    var rawFile = new XMLHttpRequest(); // XMLHttpRequest (often abbreviated as XHR) is a browser object accessible in JavaScript that provides data in XML, JSON, but also HTML format, or even a simple text using HTTP requests.
    rawFile.open("GET", file, false); // open with method GET the file with the link file ,  false (synchronous)
    rawFile.onreadystatechange = function ()
    {
        if(rawFile.readyState === 4) // readyState = 4: request finished and response is ready
        {
            if(rawFile.status === 200) // status 200: "OK"
            {
                var allText = rawFile.responseText; //  Returns the response data as a string
                console.log(allText); // display text on the console
            }
        }
    }
    rawFile.send(null); //Sends the request to the server Used for GET requests with param null
}

readTextFile("text.txt"); //<= Call function ===== don't need "file:///..." just the path 

- อ่านข้อความไฟล์จากจาวาสคริปต์
- ข้อความคอนโซลบันทึกจากไฟล์โดยใช้จาวาสคริปต์
- Google chrome และ mozilla firefox

ในกรณีของฉันฉันมีโครงสร้างของไฟล์นี้:ป้อนคำอธิบายรูปภาพที่นี่

ผลลัพธ์ console.log:
ป้อนคำอธิบายรูปภาพที่นี่


ด้านล่างนี้เป็นข้อผิดพลาดที่แสดง: การเข้าถึง XMLHttpRequest ที่ 'file: /// C: / {myLocalPath} PropertiesFile.txt' จากจุดเริ่มต้น 'โมฆะ' ถูกบล็อกโดยนโยบาย CORS: การร้องขอข้ามต้นทางสนับสนุนเฉพาะโครงร่างโปรโตคอล: http, ข้อมูล, chrome, chrome-extension, https
Kumar Kartikeya

1
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <script src="https://code.jquery.com/jquery-1.10.2.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {            
                $.ajax({`enter code here`
                    url: "TextFile.txt",
                    dataType: "text",
                    success: function (data) {                 
                            var text = $('#newCheckText').val();
                            var str = data;
                            var str_array = str.split('\n');
                            for (var i = 0; i < str_array.length; i++) {
                                // Trim the excess whitespace.
                                str_array[i] = str_array[i].replace(/^\s*/, "").replace(/\s*$/, "");
                                // Add additional code here, such as:
                                alert(str_array[i]);
                                $('#checkboxes').append('<input type="checkbox"  class="checkBoxClass" /> ' + str_array[i] + '<br />');
                            }
                    }                   
                });
                $("#ckbCheckAll").click(function () {
                    $(".checkBoxClass").prop('checked', $(this).prop('checked'));
                });
        });
    </script>
</head>
<body>
    <div id="checkboxes">
        <input type="checkbox" id="ckbCheckAll" class="checkBoxClass"/> Select All<br />        
    </div>
</body>
</html>

1

รับข้อมูลไฟล์โลคัลในโหลด js (data.js):

function loadMyFile(){
    console.log("ut:"+unixTimeSec());
    loadScript("data.js?"+unixTimeSec(), loadParse);
}
function loadParse(){
    var mA_=mSdata.split("\n");
    console.log(mA_.length);
}
function loadScript(url, callback){

    var script = document.createElement("script")
    script.type = "text/javascript";

    if (script.readyState){  //IE
        script.onreadystatechange = function(){
            if (script.readyState == "loaded" ||
                    script.readyState == "complete"){
                script.onreadystatechange = null;
                callback();
            }
        };
    } else {  //Others
        script.onload = function(){
            callback();
        };
    }

    script.src = url;
    document.getElementsByTagName("head")[0].appendChild(script);
}
function hereDoc(f) {
  return f.toString().
      replace(/^[^\/]+\/\*![^\r\n]*[\r\n]*/, "").
      replace(/[\r\n][^\r\n]*\*\/[^\/]+$/, "");
}
function unixTimeSec(){
    return Math.round( (new Date()).getTime()/1000);
}

ไฟล์ของ data.js เช่น:

var mSdata = hereDoc(function() {/*!
17,399
1237,399
BLAHBLAH
BLAHBLAH
155,82
194,376
*/});

dynamic unixTime queryString ป้องกันแคช

AJ ทำงานในเว็บ http: //


ทำไมคุณไม่ใช้ไวยากรณ์ตัวอักษร ES6 สำหรับสตริงหลายบรรทัด? (ดูdeveloper.mozilla.org/en-US/docs/Web/JavaScript/Reference/ ...... )
Sapphire_Brick

1

ไม่รองรับการโทร AJAX ท้องถิ่นใน Chrome เนื่องจากนโยบายถิ่นกำเนิดเดียวกัน

ข้อความแสดงข้อผิดพลาดบน chrome เป็นเช่นนี้: "ไม่รองรับการร้องขอข้ามต้นทางสำหรับรูปแบบโปรโตคอล: http, data, chrome, chrome-extension, https."

ซึ่งหมายความว่าโครเมี่ยมสร้างดิสก์เสมือนสำหรับทุกโดเมนเพื่อให้ไฟล์ที่ให้บริการโดยโดเมนที่ใช้โปรโตคอล http / https การเข้าถึงไฟล์นอกดิสก์เสมือนนี้ถูก จำกัด ภายใต้นโยบายกำเนิดเดียวกัน คำขอและการตอบกลับของ AJAX เกิดขึ้นบน http / https ดังนั้นจะไม่ทำงานกับไฟล์ในเครื่อง

Firefox ไม่ได้ จำกัด ข้อ จำกัด ดังกล่าวดังนั้นโค้ดของคุณจะทำงานอย่างมีความสุขบน Firefox อย่างไรก็ตามมีการแก้ปัญหาสำหรับโครเมี่ยมมากเกินไป: ดูที่นี่


0

คุณสามารถนำเข้าห้องสมุดของฉัน:

<script src="https://www.editeyusercontent.com/preview/1c_hhRGD3bhwOtWwfBD8QofW9rD3T1kbe/code.js?pe=yikuansun2015@gmail.com"></script>

จากนั้นฟังก์ชั่นfetchfile(path)จะกลับไฟล์ที่อัพโหลด

<script src="https://www.editeyusercontent.com/preview/1c_hhRGD3bhwOtWwfBD8QofW9rD3T1kbe/code.js"></script>
<script>console.log(fetchfile("file.txt"))</script>

โปรดทราบ: ใน Google Chrome หากรหัส HTML เป็นรหัสท้องถิ่นข้อผิดพลาดจะปรากฏ แต่บันทึกรหัส HTML และไฟล์ออนไลน์จากนั้นเรียกใช้ไฟล์ HTML ออนไลน์


0

ในการอ่านข้อความในเครื่องผ่านการJavaScriptใช้ chrome เบราว์เซอร์ chrome ควรรันด้วยอาร์กิวเมนต์--allow-file-access-from-filesเพื่ออนุญาตให้ JavaScript เข้าถึงไฟล์ในเครื่องจากนั้นคุณสามารถอ่านได้โดยใช้XmlHttpRequestสิ่งต่อไปนี้:

var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function () {
   if (xmlhttp.readyState == 4) {
       var allText = xmlhttp.responseText;          
            }
        };
xmlhttp.open("GET", file, false);
xmlhttp.send(null);

0

จะอ่านไฟล์ในเครื่องได้อย่างไร?

ด้วยการใช้สิ่งนี้คุณจะโหลดไฟล์โดย loadText () จากนั้น JS จะรอจนกระทั่งไฟล์อ่านและโหลดหลังจากนั้นมันจะออกมาอ่านฟังก์ชั่น readText () เพื่อให้คุณสามารถใช้ตรรกะ JS ปกติต่อไปได้ บล็อกในฟังก์ชั่น loadText () ในกรณีที่เกิดข้อผิดพลาดใด ๆ ) แต่สำหรับตัวอย่างนี้ฉันเก็บไว้ที่น้อยที่สุด

async function loadText(url) {
    text = await fetch(url);
    //awaits for text.text() prop 
    //and then sends it to readText()
    readText(await text.text());
}

function readText(text){
    //here you can continue with your JS normal logic
    console.log(text);
}

loadText('test.txt');

ดูเหมือนว่าคุณมีกรณีของ ฟังก์ชัน -isis
Sapphire_Brick

0

ฉันรู้ว่าฉันมาสายในงานปาร์ตี้นี้ ให้ฉันแสดงสิ่งที่ฉันมี

นี่คือการอ่านไฟล์ข้อความอย่างง่าย

var path = C:\\established-titles\\orders\\shopify-orders.txt
var fs = require('fs')
fs.readFile(path , 'utf8', function(err, data) {
  if (err) throw err;
  console.log('OK: ' + filename);
  console.log(data)
});

ฉันหวังว่านี่จะช่วยได้.

โดยการใช้ไซต์ของเรา หมายความว่าคุณได้อ่านและทำความเข้าใจนโยบายคุกกี้และนโยบายความเป็นส่วนตัวของเราแล้ว
Licensed under cc by-sa 3.0 with attribution required.