Parsing file using javascript

javascript FileReader — parsing long file in chunks

I have long file I need to parse. Because it’s very long I need to do it chunk by chunk. I tried this:

function parseFile(file)< var chunkSize = 2000; var fileSize = (file.size - 1); var foo = function(e)< console.log(e.target.result); >; for(var i =0; i < fileSize; i += chunkSize) < (function( fil, start ) < var reader = new FileReader(); var blob = fil.slice(start, chunkSize + 1); reader.onload = foo; reader.readAsText(blob); >)( file, i ); > > 

After running it I see only the first chunk in the console. If I change ‘console.log’ to jquery append to some div I see only first chunk in that div. What about other chunks? How to make it work?

6 Answers 6

FileReader API is asynchronous so you should handle it with block calls. A for loop wouldn’t do the trick since it wouldn’t wait for each read to complete before reading the next chunk. Here’s a working approach.

function parseFile(file, callback) < var fileSize = file.size; var chunkSize = 64 * 1024; // bytes var offset = 0; var self = this; // we need a reference to the current object var chunkReaderBlock = null; var readEventHandler = function(evt) < if (evt.target.error == null) < offset += evt.target.result.length; callback(evt.target.result); // callback for handling read chunk >else < console.log("Read error: " + evt.target.error); return; >if (offset >= fileSize) < console.log("Done reading file"); return; >// of to the next chunk chunkReaderBlock(offset, chunkSize, file); > chunkReaderBlock = function(_offset, length, _file) < var r = new FileReader(); var blob = _file.slice(_offset, length + _offset); r.onload = readEventHandler; r.readAsText(blob); >// now let's start the read with the first block chunkReaderBlock(offset, chunkSize, file); > 

This is brilliant. Reading huge 3GB+ files without issue. The small chunk size makes it a bit slow though.

Worked for me as well for large files. However, for larger files (>9GB), I found out incrementing offset by evt.target.result.length was corrupting my file! My quick solution was to increment it by chunkSize instead. I’m not sure if it’s a FS issue (I’m on Ubuntu) or something else, but it works just fine for any filesize if you offset += chunkSize .

according to the docs, onload is only called if there is no error. Use onloadend otherwise. I would however recommend using onload and onerror .In short: the code above is never catching any error.

Wow, this answer is so old and still keeps getting attention. I should probably stop and rewrite this messy code. Glad it’s useful to some.

You can take advantage of Response (part of fetch) to convert most things to anything else blob, text, json and also get a ReadableStream that can help you read the blob in chunks 👍

var dest = new WritableStream( < write (str) < console.log(str) >>) var blob = new Blob(['bloby']); (blob.stream ? blob.stream() : new Response(blob).body) // Decode the binary-encoded response to string .pipeThrough(new TextDecoderStream()) .pipeTo(dest) .then(() => < console.log('done') >)

Old answer (WritableStreams pipeTo and pipeThrough was not implemented before)

I came up with a interesting idéa that is probably very fast since it will convert the blob to a ReadableByteStreamReader probably much easier too since you don’t need to handle stuff like chunk size and offset and then doing it all recursive in a loop

function streamBlob(blob) < const reader = new Response(blob).body.getReader() const pump = reader =>reader.read() .then((< value, done >) => < if (done) return // uint8array chunk (use TextDecoder to read as text) console.log(value) return pump(reader) >) return pump(reader) > streamBlob(new Blob(['bloby'])).then(() => < console.log('done') >)

Источник

Text file parsing with JavaScript

A module called ‘First’ allows for the reading of files line by line. As a new JavaScript user, I have a text file (test.txt) with hundreds of lines of code, formatted with the first number representing the source and the second number representing the target. How can I use JavaScript to parse this file line by line and display each line in its own HTML element?

Parsing the text file in js

My aim is to analyze the text that possesses the subsequent arrangement;

name=Rachel surname=Chung age=21 

after parsing i want to get;

Initially, I segmented it based on line breaks resulting in obtaining,

name=Rachelsurname=Chungage=21 

Attempting to split based on the «=» character only resulted in further complicating the retrieval of initial key values, therefore, it is not advisable.

 name,Rachelsurname,Chungage,21 

Could you recommend a solution for extracting keys from a text file?

var result = yourFileData.match(/^.+=/gm).join('\r\n') 

Assuming that you are using Node, based on reading files .

A module known as readline can be utilized to process read files in a sequential manner.

var readline = require('readline'); var path = 'path/to/your/text/file.txt'; var readStream = readline.createInterface(< input: fs.createReadStream(path), output: process.stdout, terminal: false >); var keys = []; var values = []; readStream.on('line', function(line) < var l = line.split('='); keys.push(l[0]); values.push(l[1]); >); readStream.on('close', function() < console.log(keys); console.log(values); >); 

How to Read Text File in Javascript Line By Line, In this video tutorial, you will learn how to read text file in javascript line by line. Duration: 4:55

How to Read Text File in Javascript Line By Line

In this video tutorial, you will learn how to read text file in javascript line by line. Duration: 4:55

How to Read and Write to Text Files in JavaScript

Hello everyone, welcome to SteamCode! In this video, I will show you how to read and write to Duration: 5:02

Parsing text file to objects in an array in javaScript

As a beginner in JavaScript, let’s say I possess a text file named «test.txt» that consists of numerous lines of code, all in a particular format.

Currently, I aim to convert the provided data into JavaScript objects, where the initial number on every line represents the source and the latter number represents the target.

Assuming you already possess the content of your file in a string called filecontent (which can be complex depending on the location of your javascript), implementing it straightforwardly is as follows:

var lines = filecontent.split('\n');//puts the lines in an array var links = []; for(var i = 0; i < lines.length; ++i)< var values = lines[i].split(' ');//transforms "4 6" into ["4", "6"] links[i] = ; //then into the format you wanted ! > 

How to make JS read the contents of a local text file, I know using JS to read the contents of a .txt is possible. And I have index.js . I would like to use the contents of code.txt to create an

How to read url from .txt file and use in html src?

Is there a way to extract a URL from a txt file and incorporate it into an HTML document? I have a video source URL stored in a .txt file that I wish to utilize. Additionally, there may be instances when I need to modify the video source within the .txt file.

http://www.videoexaple.com/videos/video.mp4 

fetch('file.txt') .then(response => response.text()) .then(text => < document.getElementById("videosource ").src =text;>) 

I suggest reading the following resource: https://www.w3schools.com/php/php_file_open.asp. By reviewing the initial example, you can view the file’s output.

This demonstrates the process of retrieving data from a file, which can then be appropriately positioned.

One way to keep things simple is by placing a .js file, such as video.js, in the same directory as your html file.

const videoURL = "https://www.videoexaple.com/videos/video.mp4"; 

Parse text file into three categories and display as html, Here’s the high level approach I would take: Once the document has loaded up, using jQuery I would grab all of the data output. Then, I would write some logic

JS parsing a text file line by line

How can I use JavaScript to read this file one line at a time and display each line in a separate HTML element?

Provided that data is assigned to your files contents variable, which is a string, you may separate it by using as the delimiter for a new line. To do this in your function, follow these steps:

 var splitted = data.split("\n"); var i = 0; document.querySelector("#track").innerHTML = splitted[i++]; document.querySelector("#by").innerHTML = splitted[i++]; document.querySelector("#artist").innerHTML = splitted[i++]; document.querySelector("#from").innerHTML = splitted[i++]; document.querySelector("#album").innerHTML = splitted[i]; 

How to read txt file and save it in array in javascript in html, I managed to create html web page (as shown below) and display basics like text and numbers in script mode. I also managed to load txt file and

Источник

How can I parse a text file using javascript

The code below is to read a text file using javascript. it works. However, I just want to read part of the content. For example, the content of the file is :»Hello world!» I just want to display «Hello». I tried function split(), but it only works on strings. I don’t know how to insert it here.

 var urls = ["data.txt"]; function loadUrl()

Please clarify your specific problem or add additional details to highlight exactly what you need. As it’s currently written, it’s hard to tell exactly what you’re asking.

3 Answers 3

jQuery.get('http://localhost/foo.txt', function(data) < var myvar = data; >); 

, and got data from my text file.

JQuery provides a method $.get which can capture the data from a URL. So to «read» the html/text document, it needs to be accessible through a URL. Once you fetch the HTML contents you should just be able to wrap that markup as a jQuery wrapped set and search it as normal.

Untested, but the general gist of it.

var HTML_FILE_URL = '/whatever/html/file.html'; $(document).ready(function() < $.get(HTML_FILE_URL, function(data) < var fileDom = $(data); fileDom.find('h2').each(function() < alert($(this).text()); >); >); >); 

Try this to read separate words if I understood correctly what you need. Create a file with the contents «hello world» and browse to it with the example script. The output is «hello».

Reading directly has to be with an ajax request due to the javascript restrictions regarding safety. This code shoudl perform the requested operation:

Источник

Parse a local file to an array using JavaScript

I am trying to read a local file and have each line as an index in an array using JavaScript. I have been searching for the past 20 minutes and either I’m stupid or there really isn’t an answer that pertains to my problem (. but it’s probably the former :P). I am really new to JavaScript so if you have an answer could you please comment the code just to I know what’s going on? Also, from the searching I’ve done on the internet some people said JavaScript can’t read local file for security reasons so if that is correct is there another language I can use? I’m a bit familiar with PHP if that is an option, which I doubt it is. EDIT As per thg435’s question, I’ll explain what I am trying to accomplish. My project is to analyze a BUNCH of water quality data that has been collected by the Ontario gov’t (which I’ve done) and display it in some way. I have chosen to display it on a webpage using the Google Maps API. I currently have a file of chemicals that were found. Each line is a different chemical. I would like to read the file in an array then create an option menu displaying the chemicals in the array. Also, the local file I would like to read will the be the same name and location all the time. I have seen people have boxes where the user clicks and chooses their file or to drag and drop but that’s not what I’m looking for. I don’t think I explained this properly. I have a file in the same directory as my HTML and JavaScript files that contains words. Example: Line 1: «Iron» Line 2: «Aluminum» Line 3: «Steel» etc. I would like to read the file and parse each line into a different index in an array. I don’t want the user to be able to choose which file to read using the thing.

This is a vague, if not off topic, question. You’ll get better answers if you tell us what your project is all about: I guess reading a text file into an array is not the ultimate goal.

2 Answers 2

You’re going to want to take a look at the FileReader API. This should allow you to read the text of a local file via readAsText() . This won’t work in every browser but should work in all modern browser. You can see which browsers support it here.

var filesInput = document.getElementById("file"); filesInput.addEventListener("change", function (event) < var files = event.target.files; var file = files[0]; var reader = new FileReader(); reader.addEventListener("load", function (event) < var textFile = event.target; alert(textFile.result); >); reader.readAsText(file); >); 

It’s not possible to invoke the FileReader API without user interaction. Consequently, your user would have to select whatever file to load in order for it to be read in pure JS. Since I’m assuming this will be up on a server, why not just put the list of chemicals also up on the server and GET the JSON encoded array of the results. Then you can decode them with Javascript.

Источник