Can I open a Windows Explorer window from a web app? - javascript

I built a CRM for a client of mine, and now they've requested an interesting feature:
For each customer record, they have a matching directory of files on their local computer. They want the ability to open that folder in Windows Explorer directly from within the web app (the app doesn't need access to the directory/files; it just has to launch Windows Explorer so that the user can interact with their files).
This is obviously not possible with regular JavaScript running in the browser (thankfully). I thought there might be some way to accomplish this by building a Chrome extension for this purpose, but it seems Chrome extensions/apps can only access a sandboxed filesystem, which doesn't serve my needs at all. Building an NPAPI plugin in out of the question since Chrome is discontinuing support for NPAPI.
File URIs don't solve this problem either. Their display is ugly, there's no drag-and-drop, no big icons/thumbnails, no sorting etc. They want the full capability of the Windows Explorer.
The only viable option I thought of is to create a local node.js server, make a localhost CORS request to that server, and then run an exec command from node.
Any better idea?

One possibility is to register a custom URI protocol handler with the user's operating system, and then your web page can contain links using your custom protocol, such as openfolder://c/path/to/folder This sort of customization is probably most commonly seen in practice with itunes:// links.
A quick Google search led me to this decent looking tutorial: https://support.shotgunsoftware.com/hc/en-us/articles/200213756-How-to-launch-external-applications-using-custom-protocols-rock-instead-of-http-
The downside is that the user will have to run a small installer of some sort in order to set the correct registry entries (or whatever the non-Windows equivalent is for other OSes) and to drop a small script on disk. That would be much lighter-weight than running a node.js server like you proposed, though.
The linked tutorial uses a Python script, but even that is probably overkill for your needs. A batch file would likely suffice.
EDIT: One additional note, please be aware of the security implications of implementing a custom handler like this. Any webpage in any browser can potentially take advantage of your custom protocol, and an attacker would be able to pass arbitrary data to your script. You should take steps to ensure that the script will not accidentally execute arbitrary commands that may be injected by a malicious web page, and that it will only open a folder and nothing else.

That would require each customer to run a node.js server, which seems unrealistic in your case.
You could use File URIs.
Browsers will refuse to open them by default. However, as suggested in this answer, you could ask your customers to install LocalLinks.

Related

Run browser toolbar button using jquery or javascript

I have added a chrome extension called "External Application Button".
What it does is we can add external application like sublime.exe, vscode.exe etc to our browser toolbar and on click , it opens the exe.
So using jquery or javascript is it possible to make that button click happen?
My main goal is to make that application run using jquery or javascript code in a webpage.
Both for an extension and a webpage it's impossible to do it on its own, without installing extra software. You are "sandboxed" in what you can do on a computer from your code, and limited to whatever APIs browsers provide.
To invoke an application external to the browser, an extension needs to use something called Native Host. This is why installing something extra is required to make that extension work.
Regular webpages can't use Native Hosts, so that route is closed.
Can we do it from webpage code, if we allow installing an extension?
Yes, an extension that talks to a webpage (through content scripts, or externally_connectable mechanism) can allow websites to trigger extension code, that triggers native host code, that does what you want.
You can't do that with arbitrary third party extensions, so you'll need to write your own.
Can you do it anyway, without an extension, if we allow installing an extra component?
In principle, yes. A typical way to do it is to install a helper program that opens a web server on a local port, e.g. localhost:12345. Then any JavaScript context can try connecting to it.
In practice, there are complications.
How do you secure your local server from arbitrary connections? You'd need some pre-shared secret to not allow other sites, or other software on the local machine, to abuse this.
Connecting to non-HTTPS domains from HTTPS websites is a problem. Making a certificate for localhost that's trusted by the browser is also a problem (that has security implications if circumvented). That complicates installation of the extra component.
Another idea: your extra component can register itself as a protocol handler. For example, you can add a launch-app: protocol and tell the system that your helper application needs to be invoked. Example: Steam uses this approach to communicate with its client from the browser (e.g. to install / start a game).
Note that this is one-way communication, but for the "launch a program" use case it's enough.
Then you can just provide links to that special protocol to do that. Again, this requires installation of an extra component in the target system. You can't do that with just the browser.
So the overall answer is: it's complicated, and needs extra software installation.

Opening file folder present in a FTP site in file explorer on the client-side

I have a folder structure in FTP, that I am trying to access and open in file explorer on the client-side using javascript in my asp.net application. Using window.open("ftp://192.168.1.10/clients/112"); opens the folder in the web browser how do I make it open in the file explorer.
The real answer is that you do not understand what you, in any way, are doing. You are trying to cross standards which is prevented inherently, but by your lack of technical knowledge, you don't know help when you see it. The part below shows ways to possibly handle it.
For a machine to connect to an ftp server, they need to authenticate and do so over the correct protocol. That is not the protocol that browsers use.
Now, that is not to say that I can't go in my browser, type ftp://... and see a directory. But that is totally different. Your browser switches protocols based on your url. That can't just happen when your a webpage in a clients browser.
Your web server can conduct ftp traffic though. You can read that structure and show it to your user. https://msdn.microsoft.com/en-us/library/ms229716(v=vs.110).aspx
A clever guy can make this happen. It used to be easy in flash/flex, but.. progress.

How to make a user-accessible file on the user's filesystem with a chrome extension

I'm making an extension that among other things edit a javascript file in an external editor (one on the user's computer). The extension has the javascript file saved in chrome.storage but it will ofcourse be a lot easier for the user to write code in their own editor.
This is why I decided to find something that creates a file on the user's filesystem which the user can find and edit it themselves, and if any changes are made, sync that back up to the extension (either by periodically checking or by using some listener).
I have looked around but nothing really seems to fit what I'm trying to do. Chrome's fileSystem API only works for chrome apps, not chrome extensions and the HTML5 fileSystem API does not allow for a simple filesystem URL to be requested and opened, instead it obfuscates the stored file and makes it practically impossible to edit that file easily.
Something else I looked at which might be more promising is letting the user edit one of the files in the directory where the extension is stored and somehow retrieving that content. This is however going to be a bit tough to implement with chrome's all the hash checking going on in chrome extensions not to mention the general modifying of those files' contents by the extension (possibly by hacking around by specifying your own update URL and "updating" a dummy javascript file that is going to be written to).
Is there any way to simply ask for a location to store a file and then allow the user to edit that file and sync it back up?
No, extensions are sandboxed from the real filesystem.
As you said, it's possible to read extension's own files; however, this is read-only for the extension and modifying those files on a deployed extension will result in Chrome detecting extension "tampering" and immediate disabling as a precaution.
The only way for a Chrome extension to escape the sandbox is, as wOxxOm suggested, a Native Host module. Note that this cannot be distributed in Chrome Web Store with the extension; it needs a separate installer.
Alternatively, you could use some sort of cloud storage with API to access it; e.g. a user could store something in a Dropbox subfolder, and your extension can authorize access to it via Dropbox API. Unfortunately, there is no "native" solution like syncFileSystem for Apps.

Lauching .bat or .exe client-side

I face an issue for a client who need to launch an application from a ASP.Net website client side. For the moment the solution is using ActiveX, but we all want to find an other way to do this action.
I read this links to find informations :
Is it possible to run an .exe or .bat file on 'onclick' in HTML
https://msdn.microsoft.com/en-us/library/aa767914%28v=vs.85%29.aspx
I know that for security issues, browsers don't allow the launch of client applications, but did someone find a hack to do something like that and have a sample to post ?
Have a good day
The technology exists for YEARS and it's called ClickOnce.
https://msdn.microsoft.com/en-us/library/142dbbz4%28v=vs.90%29.aspx
It requires the .NET Framework at the client side and a support from a browser (some browsers require a plugin to correctly handle ClickOnce apps).
Applications are deployed either in a form of a self-extracting installer (setup.exe) or a link to an XML document, the manifest, that describes location of other components (appname.application). In any case, a client just clicks a link, the app is downloaded and run locally, using local client permissions.
In particular, the app can read/write local files, use certificates from the local store, print documents using local printers, call other services ever if they are cross-domain etc.
And note that such ClickOnce application can run client local processes without any restrictions. We use this feature for years and it sounds like this is exactly your scenario.
Theoretically it could happen if a service was listening on some predefined port and the application simply sent a specific request to that port.
Other than that, I don't think it's possible to directly execute an application on the user's computer.

Work around for Html5 Local File Access

We are currently looking at porting a enterprise silverlight application over to html5. The major roadblock that we have hit is the ability to open files from the user's local disk. Currently they have a document library which just links to files on their computer that they can open from within the app and view or print out. All that I read is that you can only access the local sandbox of the web app with the html5 file api's. We want to load these files from code.
Does anyone know of any workarounds to this?
Thanks
There is no way for html5 to access local file without user selection. But FSO: FileSystemObject works for IE and MAYBE could be regarded as a work around. But still there are some requirements to meet.
It is possible to use chrome's filesystem API to access files on a users local filesytem. So you'd have to be willing to make this a chrome only application.
Using java you can create a "Signed" applet which has access to the local filesystem. (if the applet is signed you can request filesystm permissions)
then there is a tutorial for accessing methods of your java code directly from javascript here: http://docs.oracle.com/javase/tutorial/deployment/applet/invokingAppletMethodsFromJavaScript.html
you should be able to perform something similar from silverlight.
There is no workaround in pure HTML5/Javascript. You need the use of plugins, such as Java or Silverlight (maybe you shouldn't port it after all). As for workarounds, HTML5 gives you an easy way drag and drop multiple files that you could transfer on the server and then display back to your users. Another workaround would be to install a custom agent (a software with only a tray icon) that would send the information about the current user "document library" to server and then again, you could display it back to the user.
Note: I've heard somewhere that browsers will eventually stop supporting plugins. http://www.howtogeek.com/179213/why-browser-plug-ins-are-going-away-and-whats-replacing-them/
Ya, I agree with Markain. However, if you were to limit your audience solely to chrome users, I daresay, you would most likely use some of your users. If Huazhihao is right, then your number of leaving customers should decrease but users who regularly use firefox won't be happy. Overall, I think that this will not work. Otherwise, there would be too many websites that trashed your hard driver (or at least wherever you have the rights to edit/delete files). I think it would be best if your product was setup to synchronize the file whenever an internet connection was detected and a change was made to the file. That way the user would not need to visit the website whenever the file was uploaded. If this is some kind of an error file, then it would be most beneficial if you were to make a link in the application that when clicked, would upload the file to the website and the website were to do whatever was necessary. If this is a purely online thing, then I don't see what business you would have looking through other peoples' files =-). Hope I helped!

Categories