I've been doing Code Year at Codecademy and I wanted to start practicing Javascript for myself, but I've been having a tough time figuring out some basic issues.
For my first project, I want to read in from a spreadsheet. I can't figure out how to access the data from its original source online, so I thought I would just save it as a text file. My question, then, is how to read from that.
So it looks like you can't read local files in Javascript. (Although apparently that's changing with HTML5? I don't have any familiarity with that.) So do I have to upload the text file someplace? Can I upload files to JS Bin? If not, does anyone have any recommendations for where I can upload the text file? And either way, once I do, what's the code to read from it?
Thanks in advance. I am sure this question is riddled with misstatements and improprieties, but I've spent a significant amount of time on this and I can't find anything that seems to answer my question. I honestly thought it would be something simple, like "var inputfile = c:\file.txt" but that seems not to be the case. I am totally lost. Thanks!
You can't. File system and storages in Javascript (or rather the client) is sandboxed.
That means you can only read what is written there in the first place. This has to do with security.
You will need to drop (or select) the local files into the browser and have some mechanism there to receive the drop/selection and store the file to one of the local storing mechanisms such as indexedDB or file API (the latter currently only supported in Chrome). For text files localStorage works fine too.
Resources:
http://updates.html5rocks.com/2011/08/Saving-generated-files-on-the-client-side
http://www.w3schools.com/html/html5_webstorage.asp
http://www.w3.org/TR/webstorage/
http://www.w3.org/TR/FileAPI/
http://www.w3.org/TR/IndexedDB/
The other option is to upload it to server and download it from there when you need it.
When you get to this point in your development, its time to run your own webserver for testing as it makes things much easier. If you must insist on doing it your way, uploading the file to a file hosting site and reading it in is still possible. Codecademy is great for getting started, but when you get into dealing with persistent data sources (either files or databases) its time to get web hosting or set up your own test server.
Even then you don't REALLY need your own test server, just a folder on your computer. You can access the files with File://, and link in the file you want to read as a relative path. If the .txt file is in the same directory, you just link it in as "Example.txt" when you open the html file in that directory.
Related
I have a relatively simple task that I want to achieve, but I am totally stumped on how to achieve it. I want to create an HTML page that allows users to select a local JSON file. I want to pass the path to this local file to some Javascript code. Then I want to read that file using Javascript every time the file changes.
I've investigated a few different methods for achieving this. First, I tried just using Javascript. This worked great until I wanted to read the file multiple times as it was changing. Evidently there are security concerns that make this impossible.
Next, I investigated using Node.js to solve this problem. It has some file utilities that seem perfect, and it's server-side, which may help with the security issues. But using just Node, I couldn't figure out how to select a local file in HTML and pass the path to the Javascript code. From investigation online, it seems like Express.js would be useful.
So now I'm trying to use Node.js and Express.js. Now I can figure out the file name from an HTML form! But I can't figure out the path to the local file so that I can read it using the Node file utilities... From looking at similar questions online, it looks like everyone uploads files, then reads them. Is that what I have to do with Express? If so, is it possible for me to monitor changes to the original file, upload the file when those changes get made, then read the changed file? Is what I'm trying to do possible? If so, does anyone have any recommendations on libraries/modules to use? Thank you so much for any help - please let me know if I can be more clear about anything.
I know that JavaScript is not allowed by browsers to do much directly with the computer, and that is not my question. My question is: How to, with JavaScript, create a file on the web and then ask, perhaps with a popup window, to download the folder and any files within. This folder would need to allow access for JavaScript to place files within, like image files. This folder might originally be just another JavaScript value (like an object) or a URL.
I have done research, but much of what I found was asking whether JavaScript could create a folder directly to the computer, while my question is asking about creating the folder, and then asking to download it. There must be some way, because when in Google Drive, drive has a way to place multiple files in a .zip folder for download, and this works not just with Chrome but with Firefox and Internet Explorer. Some sites like http://stuk.github.io/jszip/ provide their own way to create .zip files, but I would prefer not to use a JavaScript library, if possible.
This would be useful for generating multiple image files, but only asking the user once for downloading them, instead of for each file.
I would prefer to create the zips client-side.
So this is an interesting question and I shall do my best to answer it. The simple solution is to not do this at all. Use javascript to asynchronously request the server to create the required .zip and then give the user a link/prompt to download. But I digress, you want it all in-house!
JSzip Option
You'll not be able to write a solid library that can .zip files client-side. JSzip is the best option out there, and it's not as solid as it could be. If you have the time you could go through the source and make improvements where required.
Cheeky Option
Your best option - baring the actual best one (server side) which you have discounted - is explained here. That is - create an iframe for each file.
Unfortunately you'll not find any better than those options if you're insisting on client-side work. Browsers weren't made to be zipping files.
I have a single text input box where user enters a path to a directory. I want to fetch names of all the files from that directory using File API in JavaScript.
I was reading from this article: http://www.html5rocks.com/en/tutorials/file/filesystem/#toc-dir and tried executing the code under Reading a Directory's contents but was unable to understand the code since we are mentioning the directory name anywhere in the code.
So, how can i accomplish my task?
As far as the SPECS are concerned,
It is not possible to read normal file system directories from the browser apart from the upload button / flash etc.
The browser can, however create a sandbox (in its user files) which appears as a directory structure you can manipulate. This is useful for apps that need to play with actual files and store them locally rather than on server.
Real Life story
The filesystem API is not supported, rather dead specs which may find its way to implementation if need arise.
Nearest currently working functionality is local storage
got some great feedback last time.
I'm essentially setting up a Wiki-type system on my local computer. I'm linking between HTML files, with some already existing and some not. I'm using XMLHttpRequest to check to see if the files exist.
The problem comes when I need to check files that are in different directories. I've come to find out this is a security thing in place. However, I'd like to disable it if possible, just for my local files. It seems rather odd that I can't have simple Javascript that returns the text on any web page at all, but even more so on my own computer.
I don't have any sort of server software running, just a bundle of HTML files with Javascript in them.
Thanks in advance!
javascript can not talk to the local filesystem. The reason for this is to keep people from writing destructive scripts that break your computer.
If this isn't a learning exercise, perhaps you might be interested in TiddlyWiki?
As you mention your self, "this is a security thing in place". In general, JavaScript is not allowed to access local files as it violates the sandbox.
However, have a look at these SO posts that discuss a few possible solutions:
Can JavaScript access a filesystem?
Local file access with javascript
You can also have a look at this HTML5 feature:
Reading local files in JavaScript
I am offering zip files of a plugin I wrote with JS, PHP and CSS files for the user to upload to their server. However, in some user cases the JS file gets uploaded as one line, obviously causing a massive FAIL and a complaint from users. To get it working again, I just open the file and copy/paste from my properly formatted version onto theirs. Presto! So, can someone explain what is going wrong here and how I can prevent this easy-to-fix but time consuming problem? I am using Notepad++ on Win, is there some kind of setting I should be using to save my files? Or is it a remote server problem that I just can't prevent?
Most likely this is caused by different line endings and their interpretations on various operating systems. I would thought that nowadays these problems are over, apparently not.
Ask your customer for any file created on the target system and see what line ending is natively used there. Then simply give them file for the target platform (AFAIR Notepadd++ allows you to save file in with any EOL).