I have been developing an app that uses angularjs and spring mvc. The app runs perfectly in eclipse when I do Run As...Run on Server and view in my web browser at localhost : 8080 / appname.
But now I have used the eclipse maven pugin to build a war file and deploy the war to a remote server. When I type in the domain name on the remote server, I just get the text from the main index page, without any of the javascript, or css. Since the links are all javascript, and the index page relies on client-side includes, all I can access in the browser from the remote server is a small amount of unformatted text with no links.
Is there an extra step to creating an executable war with angularjs that I am not aware of? The methods I used to create the war and install it on the server have worked many times with spring-only apps running on the same server, and developed in the same eclipse installation on the same devbox.
How can I start to diagnose this problem? I am new to angularjs.
how do you render angular files? Do you use JSP + Angular?
If you are using just static files to serve angular html then your static file serving is working.This means that something wrong is going with your javascript and css files mapping (wrong urls)
otherwise if you render jsp + angular then maybe your static content serving is not working properly
Does your browser say that mappings are wrong?(check it out in browsers console)
How did you map paths to your css and javascript?
Related
I have recently started to build my first Node.js app using Express. I have used the latest Express generator to create a skeleton app and I have successfully create several different layouts using Jade and CSS - this all works fine.
However, I cannot seem to get my client side JS to work. In my public folder I have a separate front end JS file and the only thing it contains is an alert (just for testing purposes). I can successfully navigate to the file in the browser and I am not receiving any console errors, however the alert never fires - What am I doing wrong?
In order to solve this problem I had to change the link reference to a script reference in my HTML. I also had to ensure I served static files in Express.
http://expressjs.com/starter/static-files.html
I am developing Web Application using MEAN(Mongo, Express, Angular, Node) JS stack.
I would like to use PhoneGap to compile my clients for Android/iphone native app. At the same time I want to keep same client-side Views & AngularJS code to remain usable for desktop browsers. I am using bootstrapper for Responsive design and it works fine for me on mobile browsers.
I saw, Phonegap require us to include some of it's own Javascript files, and I will be required to have few more .js files in footer of index.html.
If I pressume, I should not be using server side .jade engine for index.html file, and all my .html should remain in client side.
will index.html created for phoneGap will cause problem, if I use it for desktop browser? Should I have different index.html for browser and phoneGap input. Can grunt help me in customizing index.html files.
What are the other things which I should take care of for my needs?
My advice for you is to separate the projects, Phonegap or Cordova Apps doesn't have a running server, they serve the html files through the file:// protocol.
If I pressume, I should not be using server side .jade engine for
index.html file, and all my .html should remain in client side.
You presumed correctly, no .jade templates should be used, your views should be plain html files or, if you want, load them as scripts so you don't have to load them on page request increasing app performance.
will index.html created for phoneGap will cause problem, if I use it
for desktop browser? Should I have different index.html for browser
and phoneGap input. Can grunt help me in customizing index.html files.
Yes it will, if you try to use an index,html from phonegap on a desktop browser you will get a lot of javascript alerts. Since phonegap.js is expecting to get some events that are fired by cordova when running on the device. And this gets worse if you have Cordova plugins.
Within WebSphere Application Server Liberty Profile Guide for Developers pdf in section 1.4 (Frictionless application development), it mentions:
By default, the Liberty profile will monitor deployed applications for changes.
Updates to static files (HTML, CSS, or JavaScript) or JSP files are detected and
served immediately. Changes to servlet classes cause an automatic restart of
the application.
I am not deploying via dropins folder. I have a configured server.xml file within Eclipse
<application location="/Users/path/my_application.ear" type="ear"></application>
I am not able to make any changes to my source UI files and see updates on WebSphere.
I am also not able to find a particular js file deployed anywhere, so it seems the *.ear file is not expanded, so I could edit the file directly on the server.
The only way I can see changes to my UI files is to make the changes to the source files and rebuild the ear file.
I feel like I am not creating a proper mapping to my source files and/or perhaps the Liberty profile on Mac doesn't explode the ear files so that I can edit the deployed UI files.
Thoughts?
If you want to have automatic updates of your files on the server, the best way is to use Eclipse to deploy the project to the server using "Add Remove" option on the server. This configures server.xml to point to your expanded app in the workspace. As result any changes to the files in the workspace are visible and detectable by the server.
If you configured your server.xml with path to the ear, it will monitor only for ear changes. And since your UI files are in totally different place, changes are not detected unless you rebuild your ear.
For deployment options to Liberty see the following links:
Adding and running an application on the Liberty profile by using developer tools
Deploying applications to the Liberty profile
It is possible to indicate path to an already deployed application, in my case it's a web application:
<webApplication location="\programs\wlp\app1_war" name="app1" contextRoot="app1">
<classloader delegation="parentLast"/>
</webApplication>
Changes in some scripts will be loaded automatically, but java classes are loaded by class loader when server starts or when app is redeployed.
See classLoader and classloaderContext, maybe there is a way to make class loader to reload classes at change:
https://www.ibm.com/support/knowledgecenter/SSD28V_8.5.5/com.ibm.websphere.wlp.core.doc/autodita/rwlp_metatype_core.html?view=kc#mtFile17
I'm working on a servlet/web services website, deployed in Tomcat 7.
The website is a single page application. Html/Css/JavaScript files are served as static content by the server, and then all the ajax calls are managed by Java webservices.
I'm using Eclipse for coding in Java, and WebStorm for HTML, CSS and JavaScript.
My problem is that changes made with WebStorm are not immediately reflected on the server, making it difficult to debug (changes made with Eclipse are immediately updated in the deployed site, however). WebStorm works on exactly the same files and folders as Eclipse, not on a copy.
Is it possible to configure the projects so that changes made with WebStorm are reflected in the server, without having to touch Eclipse?
Best,
Eloy
refresh your project in eclipse, or edit your static files with eclipse.
this is because the tomcat in eclipse publish the project in a temp folder to deploy it in tomcat.
you can also try to: open the tomcat server in the eclipse view "servers" by double clicking on it, and select the option "Serve modules without publishing"
Window-Preferenc-Workspac, check Refresh using native hooks or polling.
But you still need to wait 2-3seconds,and need to refresh your browser.
I am looking for a tool that can help me refresh broswer after code change.
WaveMaker is a powerful ajax based UI builder, but its JSON-RPC API standard is incompatible with our web service, which only has a RESTful API. As a result, we would like to design an UI without using any service using WaveMaker, and only extract part of its source code that runs on browser side (discarding all services)
Unfortunately, we can neither view or test the extracted code (all .html files show an empty page), a javascript reference in index.html is pointing to runtimeLoader.js, which we cannot find anywhere. So, is it possible to deploy the browser side code on a web container (not an application container like Tomcat) without runtimeLoader.js? If this is not possible, how do I change the source code so it can be tested without using WaveMaker?
If you don't mind having a java server in the mix, you could "import" REST calls to your API into the application. The XHR service (new in 6.5) targets JSON returning services. The 'Build-a-Service' does best with XML returning services. The browser would then call the WM java server, which in turn calls your REST services.
An easy way to get started with a WaveMaker client only app is to use the phonegap build option. This will build a zip file of a stand alone app. If you unzip that into say an apache served folder, you will render pages, etc. Note this build is targeted towards mobile devices via phonegap, so you will want to make adjustments if you are targeting desktop browsers.
Also, runtimeLoader.js can be found in the client runtime lib folder. e.g. /studio/lib/runtimeLoader.js of the installation.