0

I'm sorry for this very basic question, but I can't find it out. Basically I'm trying to read this file line-by-line, then in another HTML page whenever there is a string that match one of these lines, then it will be wrapped within the <span class="hello">...</span> tag. For the latter I can use the findAndReplaceDOMText library, and I thought that the former should be easy too. But I can only find answers to read an uploaded file. That is, using

<input type="file" name="file" id="file">

to upload it. For example: How to use Javascript to read local text file and read line by line?, Reading line-by-line file in JavaScript on client side. Googling js read line by line only returns results for Node.js

Ooker
  • 1,969
  • 4
  • 28
  • 58
  • Is the page you want to run this code on within the same domain as the remote file? If not you will need to get it's contents user server side code due to CORS restrictions, or use a third party CORS proxy service – charlietfl Jan 08 '22 at 15:41
  • check out [fetch()](https://developer.mozilla.org/en-US/docs/Web/API/fetch) – Thomas Jan 08 '22 at 15:48
  • @charlietfl yes, it's on one same domain. But is there a way to code it on local before pushing it to the host? – Ooker Jan 08 '22 at 16:06
  • 1
    As mentioned above use `fetch()` then split the lines as per the node answer you have – charlietfl Jan 08 '22 at 16:32
  • @charlietfl if I can make the file text a json file, then would it be more efficient than using `fetch()` – Ooker Jan 08 '22 at 16:42
  • Sure. Then you wouldn't need to do all the manual line splitting – charlietfl Jan 08 '22 at 16:43
  • @charlietfl I mean, it's just easier for js to process it, but the cors procedure is still the same, right? After all it's just a text file, and the server still need to allow the clients to access it? – Ooker Jan 09 '22 at 11:22

1 Answers1

2

You can use the Fetch API and read the response as text and iterate line by line

(async () => {
  const response = await fetch("https://xn--qucu-hr5aza.cc/files/M%E1%BB%99t%20h%E1%BB%87%20th%E1%BB%91ng%20ni%E1%BB%81m%20tin/Node%20list");
  const data = await response.text();
  const lines = data.split("\n");
  console.log(lines)
})();
Arnav Kumar
  • 162
  • 2
  • 3