Uploading files to node js using html form? - html

var fs = require('fs'); // require file system module
var http = require('http'); // require http module
http.createServer(function(request,response){
var newFile = fs.createWriteStream("readme_copy.txt");
request.pipe(newFile);
request.on('end',function(){response.end('uploaded')});
}).listen(8888);
I am trying to use this piece of code.I am uploading a file to node server and I am creating a new copy of the uploaded file.
I mentioned My HTML file below.It is hitting the server and uploading the file but the copy of file is empty.
If I am using curl in command prompt for uploading the same file it is working fine.
Any idea what I am missing??
<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html;charset=ISO-8859-8">
</head>
<body>
<form action="http://localhost:8888/">
<input type="file" name="readme.txt" method="post" enctype="multipart/form-data">
<input type="submit">
</form>
<p><strong>Note:</strong> The accept attribute of the input tag is not supported in Internet Explorer 9 and earlier versions.</p>
<p><strong>Note:</strong> Because of security issues, this example will not allow you to upload files.</p>
</body>
</html>

Your Javascript is missing the actual piece that does the writing to the readme_copy file that you created by calling createWriteStream.
Here's an example of what you need to do:
http://www.html5rocks.com/en/tutorials/file/filesystem/

Related

JQuery reads old version of file

So I am working on a project for my rPi which collects network speed information and logs it in a webserver locally. The Script is working all fine, but for some reason the JQuery code runs differently in Windows (where it read a file and displayed correctly) as in my rpi. Let me explain: The file is modified every so often to change what is displayed in the webserver so it is up-to-date. For some reason, without modifying anything, the JQuery code reads the file incorrectly (old data after changing the file, even after restarting the whole program). I have even tried to move the file out of the dir it was in, to verify that there wasn't any other duplicate file, and there wasn't another.
This is the HTML file
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<script src='jquery-3.6.0.min.js'></script>
<script>
$.get('./assets/current.txt', function(data) {
var items = data.split(',');
$('#date').html(items[0]);
$('#ping').html(items[1]);
$('#download').html(items[2]);
$('#upload').html(items[3]);
})
</script>
<p>Date: <span id="date"></span></p>
<p>ping: <span id="ping"></span> ms</p>
<p>dowload: <span id="download"></span> MB/s</p>
<p>upload: <span id="upload"></span> MB/s</p>
</body>
</html>
This behaviour is possible if browser is caching the file. In order to force the file from server all the time extend the url as $.get('./assets/current.txt?_u='+Date.now(), function (){...})

Is there a way to render an HTML page from Ruby?

I am developing an application that takes in the address of a web page and generates an HTML file with the source of that page. I have successfully generated the file. I can't figure out how to launch that file in a new tab. Here
This is running in Repl.it, a web-based code editor. Here's what I have:
def run
require 'open-uri'
puts "enter a URL and view the source"
puts "don't include the https:// at the beginning"
url = gets.chomp
fh = open("https://"+url)
html = fh.read
puts html
out_file = File.new("out.html", "w")
out_file.puts(html)
out_file.close
run
end
Then I'm running that code.
As I understand you just want to save html of site and open new file in your browser.
You can do it this way (I use Firefox).
require 'net/http'
require 'uri'
uri = URI.parse('https://bla-bla-bla.netlify.com/')
response = Net::HTTP.get_response(uri)
file_name = 'out.html'
File.write(file_name, response.body)
system("firefox #{file_name}")
Note: Keep in mind that site owners often block parsers, so you may have to use torify.
Now check the file
$ cat out.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Bla-bla-bla</title>
</head>
<body>
<p>Bla-bla</p>
</body>
</html>
Everything worked out.
Hope it helps you.
If all you need is to open this file locally in your computer, I would perform a system call.
For example on my macOS the following would open the HTML page on my default browser:
system("open #{out_file.path}")
If you want to supply the rendered HTML to other users in your network then you will need a HTTP server, I suggest Sinatra to start with.

Can I run a batch file when I open my html document

I am trying to get a batch file to load in my head tag when I open my document
I have tried these and they don't seem to work:
<head onLoad="shutdown.bat">
<head onLoad="window.open('shutdown.bat')">
I've tried this as well putting it in to a function then calling it on load up
<head onLoad="shut">
<script>
function shut() {
}
</script>
</head>
I have made sure the batch file works by opening it as well
This is only possible to do when you are opening your HTML file through file:/// on your local computer. As soon as you host it on a server it will throw an error.
What you want to do though is this:
window.open("file:"///C:/Path/To/File/some_bat_file.bat"

How to include a code fragment from a text file into html?

Is there a simple way (or what could be the simplest way) to include a html-code fragment, which is stored in a text file, into a page code?
E.g. the text file fragment.txt contains this:
<b><i>External text</i></b>
And the page code should include this fragment "on the fly". (Without php ...?)
The Javascript approach seems to be the preferred one. But with the examples below you possibly can get problems with cross origin requests (localhost to internet and vice versa) or you can have security problems when including external scripts which are not served via HTTPS.
An inline solution without any external libraries would be:
<!DOCTYPE html>
<html>
<body>
<div id="textcontent"></div>
<script>
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
document.getElementById('textcontent').innerText = xhttp.responseText;
};
xhttp.open("GET", "content.txt", true);
xhttp.send();
</script>
</body>
</html>
Here you need a file content.txt in the same folder as the HTML file. The text file is loaded via AJAX and then put into the div with the id textcontent. Error handlings are not included in the example above. Details about XMLHttpRequest you can find at http://www.w3schools.com/xml/xml_http.asp.
EDIT:
As VKK mentioned in another answer, you need to put the files on a server to test it, otherwise you get Cross-Origin-Errors like XMLHttpRequest cannot load file:///D:/content.txt. Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https, chrome-extension-resource.
You need to use Javascript to do this (or perhaps an iframe which I would avoid). I'd recommend using the JQuery framework. It provides a very simply DOM method (load) that allows you to load the contents of another file into an HTML element. This is really intended for AJAX calls, but it would work in your use case as well. The fragment.txt would need to be in the same server directory as the html page (if it's in a different directory just add on a path).
The load method is wrapped in the $(document).ready event handler since you can only access/edit the contents element after the DOM (a representation of the page) has been loaded.
Most browsers don't support local AJAX calls (the load method uses AJAX) - typically the HTML and txt files would be uploaded to a server and then the html file would be accesed on the client. Firefox does support local AJAX though, so if you want to test it locally use Firefox.
<!DOCTYPE html>
<html>
<head>
<script src="https://code.jquery.com/jquery-2.2.4.js"></script>
<script>
$(document).ready(function() {
$("#contents").load("fragment.txt");
});
</script>
</head>
<body>
<div id="contents"></div>
</body>
</html>
With javascript. I use it.
Example:
<!DOCTYPE html>
<html>
<script src="http://www.w3schools.com/lib/w3data.js"></script>
<body>
<div w3-include-html="content.html"></div>
<script>
w3IncludeHTML();
</script>
</body>
</html>

Rich Text Editor not loading when opened through django server

I tried to embed a rich text text editor in my HTML page. The text editor works when the page is loaded seperately. But when I load the page through my django server, the Rich Text Editor does not work. the HTML page:
<html>
<head>
<script type="text/javascript" src="/home/aswin/python/myblog/tinymace/js/tinymce/tinymce.min.js"></script>
<script type="text/javascript">
tinymce.init({
selector: "textarea"
});
</script>
</head>
<body>
<form method="post" action = "/home/add/">
<input type = "text" value = "Title" name = "title">
<textarea >Hello</textarea>
<input type = "submit" value = "Post">
</form>
</body>
</html>
Can anyone help me?
You are trying to load a JavaScript file from location directly on your local hard drive (/home/aswin/python/myblog/tinymace/js/tinymce/tinymce.min.js). Websites you load from a server (even a Django development server running on your local machine) are not supposed to be able to load files from user's local hard drive, so your browser blocks this.
Please, read about managing static files through Django.