I need to implement a mechanism in order for a remote web application to communicate with a local desktop (WinForms) application that I cannot modify nor have the source of (except by decompiling). This happens by writing a file to the temporary folder that the desktop application will consume, and waiting for that application to "return" by writing another file into temp folder. Folder has to be temp folder.
Question
Is there a Javascript way to access the file system in a non sandboxed way, even by setting specific browser configuration options?
Environment
The application runs on a private LAN where all computers trust each other within the same AD domain. Plus we are theoretically allowed to map any network drive on any computer. Working in the trust zone, we don't have to care about most security concerns.
Background explanation
I have a PowerBuilder desktop application that I need to "port" to web (using J2EE) and install to a separate server, local to the same LAN. This application (named GP) currently starts a process of the child application (GC) that will not show any UI, instead it will listen for two files on a temporary directory.
When GP needs to open a window from the GC process, it will write two files: GP_to_GC.txt with a syntax I have documentation of, and GP_to_GC.flg that serves as flag file. GC will delete both after retaining and parsing the content of txt file, thus showing the appropriate UI form based on input.
The "return" is exactly the opposite. GC will write a pair of GC_to_GP files to temp and GP will refresh its views.
How can I do this with JavaScript?
Based on what I'm reading, you are porting a Desktop based Java EE application to a web application? If so, then you can continue using Java and access the folder that way; no need to use JavaScript.
What is unclear is that you're saying you can't modify anything, yet you're trying to port an application. Which is it?
If you can't modify anything, and the only thing you can do is drop JavaScript into an existing web application, then your solution is rather simple:
Create an HTTP API application that sits somewhere that has access to those folders, and issue a POST request to that API that will then read and write to the file system. It can be in any server side language you choose: Javascript (Node.js), C#, Java, PHP, whatever. It simply needs the ability to access the file system through the webserver, and most frameworks provide that capability.
I can't give you any code because you haven't mentioned which server side language you want to use to accomplish this approach.
Related
I heard PWA is capable of more things than a regular web app when it comes to client side operations.
As a disclaimer, I'd like to note that the PWA I've been working on is a privately used project, it has no malicious intent to harm any system.
What I want to do is I want to be able to use cec-client to turn the TV on/off on the system, so I want to be able to either run a pre-written bash script, or access CLI on the system. Is it somehow possible using a PWA? Currently the client system has a simple nodejs app that's listening to a call on localhost from the web app, which in turn turns the TV on. I want to change it to a more sophisticated solution, hence I'm wondering if PWA can run scripts on the client's system.
The system that you are currently using (server side code with access to the necessary API) is likely the best method.
Progressive Web Apps are just websites with some extra features to persist state and emulate some functions available to system apps, and the security risks that would be involved if they could execute arbitrary system code would be enormous.
The question is, say I have written a backend REST service using Python, and then some other guy wrote some frontend code in Angular JS. Is the typical workflow putting them into two separate folders and run them separately? So the process will look like below
python manage.py runserver
in Python colder and then probably
# in the angular2 folder
npm start
Or should I place all the JS code into some assets folder and when I start my server, all the JS code will run automatically with them? If so, how should I do it?
Another question related is, when is all the JS code sent to users’ browsers? If the app is a client-side rendering app, is the code sent to browser at the first time of server requesting? How does the server know it should package your JS code and ship it?
Q)The question is, say I have written a backend REST service using Python, and then some other guy wrote some frontend code in Angular JS. Is the typical workflow putting them into two separate folders and run them separately?
Both Angular and Python can be run differently as well as together.
You could choose to place the Angular files (which qualify for all practical purposes as public files) in the public (or related folder) depending on which framework you're using - Django, Flask, Web2py or so on.
You can also choose to run them independently as standalone apps.
Depends on your requirement. Honestly, there are so many ways to answer this question.
Q)Or should I place all the JS code into some assets folder and when I start my server, all the JS code will run automatically with them? If so, how should I do it?
If you place everything in your assets folder, then as soon as the home route or any other route is made a request for [from a browser] , the public folder passes on to the browser.
Although I'm not sure if it is the case with server side rendering.
If you're using Angular 1, I do not think it fits server side rendering although you could use some libraries out there.
Q)Another question related is, when is all the JS code sent to users’ browsers? If the app is a client-side rendering app, is the code sent to browser at the first time of server requesting? How does the server know it should package your JS code and ship it?
All the files in PUBLIC folder on the server are accessible by a browser.
All of your questions seem to essentially ask the same question.
There are many approaches to this problem.
If infrastructure management is difficult for you, than maybe it's easier to place them in the same server. You can create another directory and place your html that is served to browser with your JavaScript code.
In case you have a good pipeline (which I think it pays for it self) than having another server that serves your application is better. You can do more things without affecting your service, like caching etc. And your server that runs your service wont be busy serving assets as well.
I have a case where we run a node server, which serves the html and javascript to our users, because that way we can do server side rendering.enter link description here
The flow of code execution will be this : Once the browser of your user hits the server that is serving html and assets, it will download it locally and it will start with JavaScript execution (Parsing, Compiling and Executing). Your JavaScript app might do some API calls upon initialization or it might not, but your service will be executed only if frontend makes a request.
As for CORS it is irrelevant how you serve them, because you can keep them always in the same domain.
I have AngularJS (1.2.16) application which works on Tomcat 8.0.x I need to add following feature: create a new tab in the application (no problem) and allows to user to select concrete from select box on previously implemented new tab, file from HDD (directory is given but outside from Tomcat) and preview (PDF file). How to connect those two worlds? I have backend also.
I have found very similar question- Simplest way to serve static data from outside the application server in a Java web application but I do not understand how to get in UI a list of files from given dir. There are any best practices on that?
EDIT: I have found also possible duplicate, so you suggest to serve all files under URL? Is it safe? Is it the only one solution?
Security considerations
Providing read/write access to a filesystem folder from an application server is always a bad practice.
It should be considered if the web application will be accessed from internet.
In case we need to handle this kind of situation the better think to do is to understand which information we need to have and to modify, and wen wrap those information inside a specific API that allow to work on strictly what we need.
Or we could have an operation approach which consists in the hardening of the server and the folders that should be accessed in a way that any threat will be contained.
The solution part
This answer was proposed for duplicate of: Simplest way to serve static data from outside the application server in a Java web application.
But this part just explain alf of the requested solution.
The answer here explain how to configure an extension of the default servlet from a custom folder in Tomcat:
You have to act on the conf/server.xml:
<Context docBase="/path/to/files" path="/files" />
Here you configure a folder in a way that Tomcat will access, and connect it to a path that could be requested on the HTTP requests (http://mytomcatserver/files/).
Now you need to configure the web.xml to connect a specific servlet to this path, to be able to handle the folder content.
Once you have your servlet and your Tomcat properly configured it's time to access the folder and files.
This could be done as explained int the answer Display list of files in webpage using servlet.
In short, you cold access the folder with plain java:
File filesFolder = new File(req.getSession().getServletContext().getRealPath("/files"));
And then with the method File.listFiles() you could get the list of files in the folder.
With File.listFiles() you could also add filters that allow you to hide files you don't want the user could access.
I am concerned with the feasibility of this:
On a pre-configured machine I will have a Web-Application pre-installed, next to an Apache-Suite. So client and server are the same!
In this Web-Application Users can drag and drop PDF-Files to an USB-Icon.
Then the Web-App should write the dropped PDF to an attached USB-Stick.
I have never done something like this (writing to USB), so I am fairly insecure.
And I am well aware of the browser-restrictions concerning JavaScript and Filesystem-Access, but...
after researching a bit I found out, that there might be some possible and
relevant (I'm a Web-Platform-Guy) solutions to this:
Make a "Chrome App" with USB-Permission (does this really work?)
Use PHP to find the USB and then write to it (how would that work under Windows?)
Use some Flash as middle man (not preferred)
Now I'd like to know:
Has anyone some good experience with before mentioned possibilities?
Has anybody ever done something similar? Did it work? Which path did you choose?
How would I know which drive the USB is mounted, and how would I get sure?
What other possible solutions to this problem are there?
You have a website ('client-side' user interface) and a back-end server ('server-side') running on the same machine. This gives you 2 options:
Client-side: Download a file through the browser via HTTP GET and let the user choose where they save it.
Server-side: Build your USB interactions into the back-end (Node.js) code, as #mcgraphix suggests.
Interacting with the USB on the server-side provides the most flexibility. Furthermore, there are a number of libraries that you can leverage. Head to npmjs.org and consider, among others, the following Node.js server-side packages:
usb-detection
usb
With the server-side approach, initiate a Webservice request when the user completes the drag & drop action on the client, and implement the USB interaction within the server (Express.js or similar) method which services the request.
If the letter of the stick is known then writing a file from PHP will be simple
file_put_contents( 'E:\\folder\\file.pdf', $data );
Update
You can read a list of drives into a dropdown and allow a user to select a default drive to write to
https://stackoverflow.com/a/8210132/696535
Your question is more an architecture question than a code specific question.
Your web app (if you insist on a web app) should have two major components, a server side component that can be given arbitrary commands, and a client side component (javascript using XMLHttpRequest) that can make requests to the server side component to execute said arbitrary commands.
So your server side component, the component that serves your web page should have some server side code that can write your pdf to the file system, it should probably generate the pdf file as well rather than doing that on the web browser.
Which technology you use is up to you, whether that's PHP, .Net, Node.js etc...
The general gist is you want a server side framework that deals with HTTP requests, in your case probably a post request from the client side containing the encoded pdf, and responds accordingly. Bind a particular http route to trigger your save logic.
Your http post request to the server will contain your payload which is the pdf file to a particular path, e.g. http://localhost/savepdf that whichever technology stack http listens to (you'll need to configure that)
Your server side component should read the incoming data, decode it as appropriate then make a file system request to write the received payload to disk.
I'm trying to wrap my head around how Electron (formerly Atom Shell) works.
I'm coming from a traditional, MVC-style web application where a Browser is calling a Controller Action through a Routing System, the Controller then fetches data from a store (File System, Data Base, ...) and renders a View, which is sent back to the Browser. Some Actions may be sending back JSON instead, as they are called through JavaScript/AJAX instead of the Browser actually navigating to them.
I want to create that, but as a Cross-Platform Desktop Application. I know that Atom Shell combines both a Chromium-Browser and a Node.js/v8 runtime, but I'm not sure how they would communicate.
I guess I could run a full on web server (basically, some Node.js HTTP Middleware like Express), but that creates a network-reachable server (which might also trip up firewalls) - one of the reasons I want to make a desktop app is precisely to avoid running a real server. Basically like the MVP/MVVM pattern in a "normal" desktop app.
Can someone give me a few starting points for what I'm trying to do? How would the browser talk to the node runtime (the "Client" as they call it?) to tell it "Hey, fetch my the record with ID 12345" and would the Client return rendered HTML, or would the browser just get a blob of JSON back and render it through a JavaScript templating engine?
Electron doesn't seem to use Node.js as a web server but merely as an environment to run background JavaScript code, this code can use node modules to access the system. At the same time Chromium provides a user interface for the app, it displays regular web pages that run usual sandboxed JavaScript. Both are being embedded by the Electron executable, the former directly (Node.js can be built as a static library), the latter via libchromiumcontent. In a way, Node.js is the controller part of the application whereas Chromium is the view.
Typically, the concept used for web pages here is that of single-page applications: a web page represents one application window and as such it stays around as long as this window is visible (often for the entire lifetime of the application). Whenever it needs to display something different it requests data from the background code running in Node.js, just like AJAX applications request data from the server. The page itself is not reloaded, usually JavaScript templating will be used to update contents.
There isn't really a server/client relationship here however, the communication can actually go both ways. Both sides can use the ipc module to send messages to each other (main process, renderer). These messages can have any arguments attached to them, these don't need to be encoded explicitly (typically this is implemented by using JSON internally to encode parameters, I didn't verify whether that's the case with Electron). Internally, that message passing is implemented via platform-specific IPC mechanisms, using libuv to be exact.
We implemented fully functional nodejs server & angular UI with sqlite3, sequelize ORM using
*. https://github.com/theallmightyjohnmanning/electron-express
Some of the Projects helped us lot:
Framework: https://github.com/angular-fullstack/generator-angular-fullstack
Windows Packaging: electron-packager": "github:electron-userland/electron-packager"
Creating Shortcuts and Auto Update: "electron-squirrel-startup": "^1.0.0",
Creating Release Installer: "electron-winstaller": "^2.3.4",