Is it possible to make my app open and run in a server? If yes, how? - angularjs

I am using AngularJs to develop a tool for the company I work for. My issue is that unless the app is running on a server, it will not allow me to make use of things like routing or ng-include—it does not let me request resources from the same directory.
My goal is that, without having to be connected to the internet, the user can just open the html file for the tool using a browser and a server will be created.
I cannot ask for the user to use the command line to make a port listen to the app using things like the http-server in npm. It is assumed that they do not have the ability to do that.

Related

What is the best way to host a static react application on a Windows Server that doesn't have internet connection

I created a React application using Create-React-App and npm.
I intended to simply build it with npm run build, and somehow host the produced build in a windows server.
This windows server doesn't have any internet connection (but I have admin right so I can install offline packages), then I tried :
Hosting the built folder wihth IIS which didn't work (I couldn't find
any good documentation on that)
Packing the "serve" npm package to install it in the server (serve having
a huge amount of dependencies, it's really difficult to get an
offline package)
None of this seems to work... Any suggestion ?
One way of doing it:
1.Install NodeJS on Win Server that has Internet connection.
2. Install Express on that server and get your React app to work with Express.
You might want to look for Express-React boilerplate to save time. I wrote such a boilerplate though it's written in TypeScript. There are others.
3. Copy NodeJS installer and Express installation to the server without Internet connection. Install Node. Then you can optionally use IIS as a proxy for better security.
Another (and more involved) way:
Instead of copying the Express installation, create a Docker container out of it. Then enable Hyper-V on the server without Internet connection and run the container there.
Yet another way (I don't recommend it):
Let IIS create NodeJS run-time environment while serving incoming request using iisnode as described here.
P.S.
Using Express won’t add SSR to your React app. An SPA needs some server-side logic from the server. That's what I meant when suggested get your React app to work with Express. The logic includes mapping and redirects.
IIS has very powerful and flexible configuration and both mapping and redirects could likely be done declaratively by typing the configuration settings including regex(es). I never tried but have feeling this is possible. However it might be a challenge to find instructions about that online. The other way to do the mapping and redirects is programmatically rather than declaratively. Instead of writing it in C# for example, you can do it in JS or TypeScript, utilize Express and add IIS as a proxy.
What mapping and redirects are needed?
Mapping: Map the path /static/js/*.js to the physical folder where the script bundles are. CRA puts the bundles into my-cra-app/build/static/js directory. Note 1: You might want to double check that in the index.html file generated by CRA the path to script bundles (found at the bottom of the file) is indeed /static/js/<bundle>.js. Note 2: Better security would be achieved if the mapping is not wildcarded, rather more restricted e.g. it checks for a pattern match that includes the bundle name(s).
Redirects: Needed to implement the fallback required by all SPAs. The fallback is automatically added by CRA to webpack-dev-server. When people do deployment then in cases when they move from webpack-dev-server to Express or other server, they frequently skip the fallback which is mentioned here as the 3rd pitfall of React-Express integration.

Debugging GAE microservices locally but without using localhost

I would like to debug my Google App Engine (GAE) app locally but without using localhost. Since my application is made up of microservices, the urls in a production environment would be along the lines of:
https://my-service.myapp.appspot.com/
But code in one service can call another service and that means that the urls are hardcoded. I could of course use a mechanism in code to determine whether the app is running locally or on GAE and use urls that are different although I don't see how a local url would handle the since the only way to run an app locally is to use localhost. Hence:
http://localhost:8080/some-service
Notice that "some-service" maps to a servlet, whereas "my-service" is a name assigned to a service when the app is uploaded. These are really two different things.
The only possible solution I was able to find was to use a reverse proxy which would map one url to a different one. Still, it isn't clear whether the GAE development SDK even supports this.
Personally I chose to detect the local development vs GAE environment and build my inter-services URLs accordingly. I feel it was a well-worthy effort, I've been (re)using it a lot. No reverse proxy or any other additional ops necessary, it just works.
Granted, I'm using Python, so I'm not 100% sure a complete similar Java solution exists. But maybe it can point you in the right direction.
To build the per-service URLs I used modules.get_hostname() (the implementation is presented in Resolve Discovery path on App Engine Module). I believe the Java equivalent would be getInstanceHostname() from com.google.appengine.api.modules.
This method, when executed on the local server, automatically provides the particular port the server listens to for each service.
BTW, all my services for an app are executed by a single development server process, which listens on multiple ports (this is, I guess, how it can provide the modules.get_hostname() info). See Running multiple services using dev_appserver.py on different ports. This is part I'm unsure about: if/how the java local dev server can simultaneously run multiple services. Apparently this used to be supported some time ago (when services were still called modules):
Serving multiple GAE modules from one development server?
GAE modules on development server
This can be accomplished with the following steps:
Create an entry in the hosts file
Run the App Engine Dev server from a Terminal using certain options
Use IntelliJ with Remote debugging to attach the App Engine Dev server.
To edit the hosts file on a Mac, edit the file /etc/hosts and supply the domain that corresponds to your service:. Example:
127.0.0.1 my-service.myapp.com
After you save this, you need to restart your computer for the changes to take place.
Run the App Engine Dev server manually:
dev_appserver.sh --address=0.0.0.0 --jvm_flag=-Xdebug
--jvm_flag=-Xrunjdwp:transport=dt_socket,server=y,suspend=n,address=8000
[path_to_exploded_war_directory]
In IntelliJ, create a debug configuration. Use the Remote template to create this configuration. Set the host to the url you set in the hosts file and set the port to 8000.
You can set a breakpoint and run the app in IntelliJ. IntelliJ will attach to the running instance of App Engine Dev server.
Because you are using a port during debugging and no port is actually used when the app is uploaded to the GAE during production, you need to add code that identifies when the app is running locally and when it's running on GAE. This can be done as follows:
private String mServiceUrl = "my-service.my-app.appspot.com";
...
if (SystemProperty.environment.value() != SystemProperty.Environment.Value.Production) {
mServiceUrl += ":8000";
}
See https://cloud.google.com/appengine/docs/standard/java/tools/using-local-server
An improved solution is to avoid including the port altogether and not having to use code to determine whether your app is running locally or on the production server. One way to do this is to use Charles (an application for monitoring and interacting with requests) and use a feature called Remote Mapping which lets you map one url to another. When enabled, you could map something like:
https://my-service.my-app.appspot.com/
to
https://localhost:8080
You would then enable the option to include the original host, so that this gets delivered to the local dev server. As far as your code is concerned it only sees:
https://my-service.my-app.appspot.com/
although the ip address will be 127.0.0.1:8080 when remote mapping is enabled. To use https on local host however does require that you enable ssl certificates for Charles.
For a complete overview on how to setup and debug microservices for a GAE Java app in IntelliJ, see:
https://github.com/JohannBlake/gae-microservices

Debug AngularJS and NodeJS in Webstorm At Once (Without CORS)

I have a client/server app running on NodeJS with an AngularJS frontend. I want to use the built in debugging features of Webstorm, but it just won't work.
Imagine following scenario:
I have a webstorm project with a client folder and a server folder. I can start the debuggers for the client and the server, and it works. But both sessions are on different ports. So an AJAX request to the server inside the client doesn't work without using CORS and telling AngularJS to use a different server address.
In the production version the client will be published under the server, but for developing there is no need to do this.
Does anyone know how achieve this? Something like: The system should behave like one server, under one URL.
Or is my approach stupid?
Best regards,
Kersten

Edit server-side file using GWT

I'm new to GWT. I need to read a text file from the server, display its content in a TextArea widget, allow the user to modify it, and save the updated file back to the server. Can anyone please tell me, is it possible, and what should be the right way to do this?
It is possible.
You can make a service to access the file (read and write) and the GWT client will easily call the service methods and update the user interface (TextArea).
Read here for more details.
Also you can start right away by making a new GWT project in Eclipse and choose to generate sample code. It will generate a simple service and simple GWT page that calls the service. You can add your methods to this service to try it out as a proof of concept.
If you are using Google App Engine server, there's no way to write file to server because of restriction.
To write file to server, you will need to create your own server, create a service (use Java or another server-side language) then use one of these methods to communicate with your server.
If you still want to use GAE server (on appspot.com domain), you can use another method to store your data like Datastore or Google Cloud Storage, see this article for more information.

connection between postgresql db and application(jsf+hibernate) running on cloudfoundry

The application(JSF+hibernate) is been deployed using the vmc commands as on the cloudfoundry site. able to see the welcome page. postgreSQl service is binded with the application but the application is not able to connect with the database.
And also viewed about the VCAP_SERVICES using java but dont know much about it rather how to create it.
Cloud Foundry uses auto-reconfiguration if you have one service (either MySQL or Postgres) bind to your application. That means you don't need to touch your code at all!
Please review the following article on our docs site:
http://docs.cloudfoundry.com/frameworks/java/spring/spring.html#using-cloud-foundry-services-in-spring-applications
If you still have issues, go ahead and upload a war file of your app and we can take a look.

Resources