0

So, I've made a java program that runs through a list of IPs, pings them, and updates a file on the devices status. I want to know how to open the file into a webpage and update it, so a user can open the webpage and just see a list of data from the file, they don't have to select the file or refresh the page.

Is this feasible to do with javascript/html?

This is the code I'm working with so far:

    <html>
    <head>
    <title>Import Data</title>
    <script>

        var openFile = function() {
            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]);
            setTimeout(openFile(),1000);
        };
    </script>
    </head>
    <body>
    <input type='file' accept='text/plain' onchange='openFile()'><br>
    <div id='output'>
    </body>
    </html>

But I can't seem to hunt down where to hardcode the path to the file in. When I use this manual selection method, it'll update once, whether the file increases in elements or decreases.

EDIT:

I've narrowed it down to where the file needs to be uploaded:

    <html>
       <head>
       <title></title>
       <script>
       function uploadFile() {
           var reader = new FileReader();
           reader.onload = function(event) {
              var contents = event.target.result;
              console.log("File contents: " + contents);
           };

           reader.onerror = function(event) {
              console.error("File could not be read! Code: " + event.target.error.code);
           };

           var fileInputElement = document.getElementById("FileName");
           reader.readAsText(fileInputElement.files[0]);
           console.log(fileInputElement.files[0]);
        }
        </script>
        </head>
        <body>
        <input type='file' accept='text/plain' value='RESULTS.txt' id='FileName' onchange='uploadFile()' style="display:none;">
        </body>
     </html>

If I try to type just a file path in a string, it complains it's not type 'blob'. When I do this, it requires the user to enter a file name, but obviously it can't be seen. How can I make that 'file' variable a static variable so it always opens a that file without prompting the user?

Jonny
  • 65
  • 11
  • 1
    You're looking for web sockets. – SLaks Sep 03 '15 at 18:00
  • It's very possible. Been answered a number of times. http://stackoverflow.com/questions/4644027/how-to-automatically-reload-a-page-after-a-given-period-of-inactivity – CargoMeister Sep 03 '15 at 18:01
  • Don´t know if I got the idea: are you trying to read a local file through a web page? – Raphael do Vale Sep 03 '15 at 20:01
  • The only reason there is a prompt is that seems to be the only way I can get the file to actually load and display. I'd prefer it to be linked via hard code instead of user input. – Jonny Sep 04 '15 at 13:42

1 Answers1

1

Doing some more research, it's security reasons as to why you can't access a file from the local computer.

So, in lieu of all that, I made some code that will constantly load the selected file so you can see whenever it changes:

<html>
<head>
<title>Import Data</title>
<script>
var input;

    var openFile = function() {

        var reader = new FileReader(event);
        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]);
        setTimeout(openFile,1000);
    };
</script>
</head>
<body>
<input type='file' accept='text/plain' onchange='input = event.target; openFile(event);'><br>
<div id='output'>
</body>
</html>
Jonny
  • 65
  • 11