I'm developing an application which runs on a localhost server.! In this application I do ajax calls and get items from a local h2 DB! Using the response I create dynamic elements using jQuery. The elements use an item image as background and the requirement is that I should get the images from a local folder. ( The folder is created when the server is first started and the images are synchronized from a main server over the intranet. ) The folder hierarchy is shown below.
c:/----
|
zharaimages/ -----
|
[item id]/-----
|
[image].jpg
The image can contain any name for it but will be a jpg. How can I read the file system using jQuery to get the necessary image file when the item is dynamically loaded. I thought of this method but for that I can only read a file with a static name. I want to write a method where the image name can be anything.
clone.css('background-image','c:/zharaimages/' + items[i].itemId + '/image.jpg');
Any ideas or plugins are welcome.
Thank you.
update
This is a deployable application which uses an embedded jetty server. The folders are in the same computer as the application is!
Unfortunately a big NOOOOOO...
javaScripts cannot read or write files on users' computers (File API - not currently supported by many browsers - allows files to be read by scripts if the user specifically chooses to allow it),
though they can cause the browser to load remote pages and resources like scripts or images, which the browser may choose to cache locally.
They cannot create files on the server (except by communicating with a server side script that creates files for them).
You have to make a server request(many ways...) for the resources.
I'm not sure weather its possible with HTML5 or not
jQuery runs on the browser.
The files are on the server.
The only way that jQuery can read the files on the server is if it makes an AJAX call to the server, and your web server enumerates them.
Related
I have a sub folder named "images". I want to load all the file names from "images" folder into my html page using jQuery/JavaScript on a secure web site.
How can I do this?
I know how to do this for an unsecured site:
How to load all the images from one of my folder into my web page, using Jquery/Javascript
EDITED:
It's an https page. I can get the contents of a folder in an http page, but I get an '403 - Forbidden: Access is denied.' error for the folder in an https page.
I have access to webserver. I use ASP.NET and tried to set permissions in web.config on the folder for all users.
I want to get the list from the client side.
The client script is executed through the same-origin policy.
I use an ASP.NET web page (but I want to get the files through JavaScript/jQuery).
I might use web services.
Thanks for the details. Im sorry I cant set up an ASP.Net website right now, but I still have a few questions.
Is the client script executed through the same-origin policy or do you need to enable CORS / JSONP ?
https://learn.microsoft.com/en-us/aspnet/web-api/overview/security/enabling-cross-origin-requests-in-web-api
Do you use ASP.Net WebPage, MVC, WebApi, which version or the new ASP.Net Core version?
My recommendation is to build a webservice/API that reads the folder and delivers the list of files:
you can deliver any format you want like a nice JSON, works well with jQuery
you don't need to add/manipulate the web.config which is always better
you will be able to cache the response and avoiding to much disc access. Therefore you need to watch the folder for changes and update the cache
if you want to move/split the folder, moving to a db, anything you might need later, its still gonna work: the url will remain the same
With WebApi this might helps: https://stackoverflow.com/a/25986573/117314
I have created a webapp using JSP,Html and Javascript which currently runs on my localhost using apache webserver. I want to display the files and folders and of a directory in local computer. I also want to create a download link or view link of those so that when anyone click on it it will be viewed in new tab or become downloadable as it happens in any ftp server. I know similar type of question has
been asked but none of them worked for me.
To create the download link I used
Download
this does not work as it is not in my webapp path and download attribute also does not work in internet explorer.
I'm not sure why you are exposing your local drive contents on the web but here's an option:
On the page that should display the files, in java code, list all
folders and files then for each file/folder show a link to some page
(for example "navigateLocalDrive" that sends the path of the clicked
file/folder like this:
Download
Now in that jsp, check if the GET variable is a path for a file or a directory,
if its a file, just send it back in the response, if its a
directory, list all files/folders and do the same as in step 1
Please note:
How I encoded the file path in the href in order to work properly.
The Access permissions for the webserver should allow write/read to that path (I'm already doing it on my Tomcat server on local host with the default setup no change needed)
For your reference, here are some helpers for this task:
How to list contents of a server directory using JSP?
Downloading file from JSP/Java
I am not sure if this is possible. In general the access rights are limited to the src and webContent Folder (for your html coding mentioned above for sure) . This is also reasonable, because you do not want to access or change data on your Computer in general, because after local development you want to deploy your web application to a server.
To make a test copy some file to the webContent and you will be able to download it. Within your Java coding you can use some IO package like java.io.File to navigate over folders and files. However keep in mind, that you will get some exceptions like
java.io.FileNotFoundException: C:\WeatherExports\export.txt (Access is denied)
if you want to access files outside the server.
I am trying to develop a simple app using node.js and express.js that works as follows. Attaching the screen shot of my app for reference
The user basically enters a location in his computer where image files are stored and then I dynamically generate the HTML file that displays those images as thumbnails. I am almost done except that Express is not serving my images and they appear as empty square boxes. Need help in trying to address this.
Before people mark this question as duplicate I would like to point out that this is not static web content where I can use the static middleware to sort this out. The user can input any directory on his computer and if there are any image files present then I need to display them.
EDIT:
This is how the standalone HTML page looks like. There are no problems with respect to paths in img
When you are opening standalone html in the browser, the protocol of the opened page is FILE. When you run a server on your localhost, the protocol is http or https. Modern browsers, do not allow to cross from the http protocol to the file protocol, that is why you are getting error:
Not allowed to load local resource
I can suggest you to create a buffer directory under the server directory root, and copy all the images from the desired folder there. That will allow you to show the images without any restrictions.
It seems that this has been asked a number of times, but I would like to make sure there are still no other alternatives.
So what I need to do is:
Generate a .JSON file from .net (easy)
Read the local JSON file with JavaScript and produce an html page with useful graphs etc (using Raphaeljs).
Deliver the outcome (HTML + associated JavaScript) to the client.
I wouldn't mind installing a local Apache to read the JSON file easily but since I cannot ask the client to do this, I am looking for a way to read a local JSON file (on the filesystem, no web server) with JavaScript, so that I eventually provide the client with the HTML, .js and .json and he can see the associated graphs.
I 've been reading that FileReader class is an option but I want to have the flexibility to support these on a number of IE browsers (let say IE7 to IE10).
Any help on how to work round this would be much appreciated.
Web browsers are not able to read files from the file system due to security reasons. If I've understood correctly, you have a .NET application running on the local machine?
If this is the case, you can host a WCF service to serve the JSON from your application. WCF self-hosting is described on this MSDN page. You should be able to make AJAX requests from the browser to a server hosted within you application on localhost.
If you want to support older IE, you need to go into ActiveX Security setting hell. Look into var fso = new ActiveXObject("Scripting.FileSystemObject");
But if you are delivering the content and HTML files to the client, why don't you just add the JSON markup directly into the html document? Seems like the EASY solution.
You can't read file from local disk in browser (security restriction). But once you are going to deliver HTML + js and JSON (in zip?) you can read json like from regular web server. Just use relative links and if JSON will be in same folder where HTML and JS is located. Or you may put your JSON as a part of HTML you deliver to customer.
But if you are going to show a page (HTML and JS) on your site in web, you should better ask client to upload their JSON file, and than download it from server (in AJAX style).
I want to upload a bunch of image files to a directory that I've set up on my ISP's free hosting service. It's something like http://home.ISPname.net/~username/subdir.
I want my Javascript code to be able to get a directory listing and then preload whatever it finds.
But getting such a thing even possible? My impression is not.
I suspect I will have to instead rename my files to 00000.jpg and upward, and attempt to detect what files are there using try.
FYI, I know that my ISP does not support using FTP protocol to get a directory listing.
Thanks for any help.
Under the assumption that your JavaScript code is code on your pages and not code on your server, then no, there's no API provided for JavaScript in a web browser other than a server-side API accessible via HTTP that you would create yourself. If the directory full of files is on the server, then it's going to have to be some server-side code that delivers the directory listing anyway. You could write such code in the server-side programming environment of your choice (including a server-side JavaScript solution, if that's what you want and if such a thing is possible at your ISP). As Pekka notes, it may be possible to simply enable directory browsing in your server, though that's generally a fairly low-level service that will deliver some sort of HTML page to you, and parsing through that might be somewhat painful (compared to what you could get from a tailor-made service).
Another, simpler thing you could do would be to upload a manifest file along with the other image files. In other words, create the directory listing in some easy-to-digest form, and maintain it separately as a simple file to be fetched.
javascript not suport directory listing in a direct way. but you can create a directory dumper php file, and send via AJAX.