Running and interacting with a Java program within a web application - javascript

I have a Java program that has some input and output displayed through the monitor, and I want to create a web application that can run the Java program with some inputs and then receive any outputs from the program and display them using some JS functions, and I'm wondering how I could go about doing something like that.
I essentially want to create a GUI for my Java program using html/css and JavaScript.
I have already made a static webpage using html/JS that has the appropriate inputs, now I need to figure a way to start the Java program with those inputs and evaluate the outputs.

That's.. generally not how its done.
Instead you run a JVM (a java app) that keeps running and answers web requests itself. In other words, write a webapp. In java.
For example, by using Dropwizard, spark, etc - one of the many, many web frameworks for java.
Your web service can just answer in JSON, keep things simple, no problem. You can also set up your apache, nginx or whatever it is to redirect most calls to your usual web frameworks, and some subset to your jvm webserver that is otherwise 'hidden' from outside view (firewalled off).

Related

How JavaScript Program Can Communicate With C# Console Application?

I'm trying to write a program that is composed of two parts. The logic part that I prefer to write in C# language because it's object oriented and more important it's the language witch I know the best among objective languages, and the graphic part witch I want to write it with Html, Css and JavaScript and again because they're the most familiar graphical languages witch I can use. Now my question is that how can I transfer data between a C# console app and a JavaScript browser app.
Any help will be appreciated.
Edit:
I must clarify that I just need C# console app and not a web app or web api, and therefor this part is not a backend project. And I need to run these two program separately and want them to communicate with each other.
What you describe should be a full stack application to be honest
With ASP.NET you create your C# backend, setup controllers which handle the interaction between backend code and the front end, and then on the front end you can utilize both Razor markup for HTML templating alongside standard Javascript.
With Blazor web apps, you can take it a step further and have your backend code compile to web assembly and execute directly on the client engine, but it also integrates javascript interop as well. Just be mindful about whether you want a client side or server side Blazor app, as each do things a certain way and are meant for different use cases
What you describe though, sounds more precisely like you want a seperate javascript app, which should be in communication with an ASP.NET Web API. This way you create your backend and api endpoints, which the javascript app can then make requests against. You can start your research for that with MS's tutorial here
The dotNet command line tools can generate solutions for all of these, an ASP.NET fullstack web app, ASP.NET Web API solution, as well as the various blazor app options. And of course, the standard IDE's like Visual Studio and Rider can create these solutions as well
If you're looking to have direct interop, blazor might be what you're looking for.
https://learn.microsoft.com/en-us/aspnet/core/blazor/javascript-interoperability/call-javascript-from-dotnet?view=aspnetcore-6.0

Node.js about architecture and development of simple webapp

I've been reading about Node.js hoping to expand my web development skills.
Now I don't quite understand how I will use it to develop my own mini-project, what I'm trying to achieve is to have, say, a html webpage (www.example.com/routine/video.php) that will display a series of videos.
I would like to then have another html webpage say(www.example.com/routine/controller.php) that will have a button that will pause/unpause the video thats currently playing on video.php. (why do I need another html page?, because my goal is to have like a remote controller inside a mobile device, it might even add a login to this working experience and after the login that will lead me to the controller.php page and while on my monitor the video.php will be playing, I can pause and unpause with my phone using controller.php).
Another thing that I don't quite understand is, I would like video.php be like dynamic with for example 3 videos(v1,v2,v3), and open it on monitor1, then have another monitor open that same webpage and run other 3 videos (v4,v5,v6) all working like parallel. (maybe using some ids for the post? video.php?type=sequence1)
Some people have told me to use node.js, but the video.php cannot be dynamic because if I understood correctly the js creates a server with a ip and a port, and I cannot create multiple servers on the same port.
Any ideas?
Just some comments:
It doesn't matter if you using PHP, Node.js, or even Ruby if you want to make certain type of apps, they eventually can be built, just using different implementations.
Node.js essentially allows you to write server side code in JavaScript, so that you can just use 1 language for front-end and back-end.
You probably will need to look at web socket to realize your 'remote' functionality. (think about a live chat app.) Some idea would be you can streaming your video via a readable stream, and your app provide an API to control how it would response by watching the change of states.
You may want to lookup some Node frameworks, such as Express.js to save your time.
I don't understand why you say 'video.php' can not be dynamic (BTW, in Node.js you don't need .php, the idea between PHP and Node.js is totally different). And of course, 1 port can only serve 1 server, because you don't want multiple server against one another.
IMO, I'll assume you just adapted Node.js from PHP, so I will suggest you to look how Node.js is different than PHP, and try to build an normal website (such as a forum, blog or something similar). Your 'mini project' is actually not 'mini' at all, it requires you to leverage many concepts (e.g. readable/writable stream, etc.)...

C# interaction with browser for simple check

Alright so I got a big project which I will start from the beginning. I've only done PHP and other web languages (Javascript, Jquery, node) and I have no experience with any of the languages mentioned above.
What I need to achieve is to have a small program written in C# that will make a call to my website, and the website will simply give me an "Okay" if it did recieve the message.
This simply makes the browser checks if a certain local program is running or not.
Where would I need to start to achieve such thing?

Browser-based app needing IO control

This is a question about the best way to structure an app that has both server-side and client-side needs. Forgive the length -- I am trying to be as clear as possible with my vague question.
For a standalone non-web-connected art project, I'm creating a simple browser-based app. It could best be compared to a showy semi-complicated calculator.
I want the app to take advantage of the browser presentation abilities and run in a single non-reloading page. While I have lots of experience writing server-side apps in perl, PHP, and Python, I am newer to client-side programming, and neophyte at JavaScript.
The app will be doing a fair bit of math, a fair bit of I/O control on the Raspberry Pi, and lots of display control.
My original thought (and comfort zone) was to write it in Python with some JS hooks, but I might need to rethink that. I'd prefer to separate the logic layer from the presentation layer, but given the whole thing happens on a single non reloading html page, it seems like JavaScript is my most reasonable choice.
I'll be running this on a Raspberry Pi and I need to access the GPIO ports for both input and output. I understand that JavaScript will not be able to do I/O directly, and so I need to turn to something that will be doing AJAX-ish type calls to receive and sent IO, something like nodejs or socket.io.
My principle question is this -- Is there a clear best practice in choosing between these two approaches:
Writing the main logic of the app in client-side JavaScript and using server-side scripting to do I/O, or
Writing the logic of the app in a server-side language such as Python with calls to client-side Javascript to manage the presentation layer?
Both approaches require an intermediary between the client-side and server-side scripting. What would be the simplest platform or library to do this that will serve without being either total overkill or totally overwhelming for a learner?
I have never developed for the Raspberry Pi or had to access GPIO ports. But I have developed stand-alone web apps that acted like showy semi-complicated calculators.
One rather direct approach for your consideration:
Create the app as a single page HTML5 stand-alone web app that uses AJAX to access the GPIO ports via Node.JS or Python. Some thoughts on this approach based on my experience:
jQuery is a wonderful tool for keeping DOM access and manipulation readable and manageable. It streamlines JavaScript for working with the HTML page elements.
Keep your state in the browser local storage - using JavaScript objects and JSON makes this process amazingly simple and powerful. (One line of code can write your whole global state object to the local storage as a JSON string.) Always transfer any persistent application state changes from local variables to local storage - and have a page init routine that pulls the local storage into local variables upon any browser refresh or system reboot. Test by constantly refreshing your app as part of your testing as you develop to make sure state is managed the way you desire. This trick will keep things stable as you progress.
Using AJAX via jQuery for any I/O is very readable and reliable. It's asynchronous approach also keeps the app responsive as you perform any I/O. Error trapping and time-out handling is also easily accomplished.
For a back end, if the platform supports it, do consider Node.JS. It looks like there is at least one module for your specific I/O needs: https://github.com/EnotionZ/GpiO
I have found node to be very well supported and very easy to get started with. Also, it will keep you using JavaScript on both the front and back ends. Where this becomes most powerful is when you rely on JavaScript object literals and JSON - the two become almost interchangeable and allow you to pass complicated data structures to/from the back end via a few (or even one!) single object variable.
You can also keep your options open now on where you want to execute your math functions - since you can execute the exact same JavaScript functions in the browser or in the node back end.
If you do go the route of JavaScript and an HTML5 approach - do invest time in using the browser "developer tools" that offer very powerful debugging tools and dashboards to see exactly what is going on. You can even browse all the local storage key/value pairs with ease. It's quite a nice development platform.
After some consideration, I see the following options for your situation:
Disable browser security and directly communicate with GPIO. No standard libaries?
Use a JavaScript server environment with GPIO access and AJAX. Complexity introduced by AJAX
Use the familiar Python and use an embedded web browser If libraries are around, easy
Don't add too much complexity if you're not familiar with the tooling and language
Oh what a nice question! I'm thinking of it right now. My approach is a little difference:
With old MVC fashion, you consider the V(iew) layer is the rendered HTML page with Javascript CSS and many other things, and M and C will run on the server. And one day, I met Mr.AngularJS, I realized: Wow, some basic things may change:
AngularJS considers the View ( or the thing I believed is view ) is not actually view. AngularJS gave me Controllers, Data resources and even View templates in that "View", in another word: Client side itself can be a real Application. So now my approach is:
Server do the "server job" like: read and write data , sends data to the client, receive data from client ect....
And client do the "client job": interact with user, do the logic processes of data BEFORE IT WAS SENT such as validation, or format the information collected from user ect...
Maybe you can re-think of your approach: Ask your self what logic should run at client, what should at server. Client with javascript do its I/O, Server with server-side script do its I/O. The server will provide the needed resource for client and javascript use that resources as M(odel) of it's MVC. Hope you understand, my bad English :D
Well... it sounds like you've mostly settled on:
Python Server. (Python must manage the GPIO.)
HTML/JavaScript client, to create a beautiful UI. (HTML must present the UI.)
That seems great!
You're just wondering how much work to do on each side of the client/server divide... should be functionally equivalent.
In short: Do most of the work in whichever language you are more productive in.
Other notes come to mind:
Writing the entire server as standalone python is pretty
straightforwad.
You don't have to , but it's nice and
self-contained if you serve the page content itself from it.
If you
keep most of the state on the server/python side, you can make the
whole app a little more robust against page reloads (even though I
know you mentioned, that should never happen).

Avoiding writing the same algorithm in multiple different languages

I am a web developer, and I have observed that many times I need the same function on both client and server. So I write it in JS as well as in PHP or whichever server side language. I am fed up with this. If I have to change it then I need to change it in both places. If I want to use it for some hand held devices, then I will have to rewrite that code yet again using objective-C or Java etc. Then if I need to change that function then I will need to change it everywhere.
Is there a solution for this? If I will call some webservice via ajax, then the client will have a delay. If it will be in JS then it can't be accessed from within PHP or Java, etc. If I use some service in PHP from another language then that can also become a performance issue.
It is also possible that some time we need such functions output from some paramters as input using db or without db.
I know there would be some pretty simpler solution but I am not aware of that. Please tell some language independent solution as I don't have VPS always.
I am not sure if my question actually belongs to stackoverflow.com or programmers.stackexchange.com so please transfer it to programmers.stackexchange.com instead of closing this question if it belongs to there.
Typically, the solution to this problem is to write common code in one language and use translators or library linking to allow access from other languages.
Node.js allows you to write server-side code in JavaScript.
Node.js is a platform built on Chrome's JavaScript runtime for easily building fast, scalable network applications. Node.js uses an event-driven, non-blocking I/O model that makes it lightweight and efficient, perfect for data-intensive real-time applications that run across distributed devices.
You can also use JavaScript to write HTML5 apps for mobile devices.
"Building iPhone Apps with HTML, CSS, and JavaScript"
Now web designers and developers can join the iPhone app party without having to learn Cocoa's Objective-C programming language. It's true: You can write iPhone apps quickly and efficiently using your existing skills with HTML, CSS, and JavaScript. This book shows you how with lots of detailed examples, step-by-step instructions, and hands-on exercises.
If you don't want to try to write large complex applications in JavaScript, GWT provides a way to write Java and via-translation, run it on the client.
The GWT SDK contains the Java API libraries, compiler, and development server. It lets you write client-side applications in Java and deploy them as JavaScript.
If you develop in .Net languages: C# -> JavaScript ScriptSharp
Script# is a free tool that enables developers to author C# source code and subsequently compile it into regular script that works across all modern browsers
you could use the spidermonkey extension to translate php into javascript. this way you can write your functions in php then simply convert them to javascript and re-use them at the browser.
here is a good tutorial to show you how this is done

Categories