I have deployed angular app in tomcat7.
What did :
1 Made angular app as an html5 mode to true by adding fallowing code in app.js
if (window.history && window.history.pushState) {
$locationProvider.html5Mode(true);
};
2. Added `<base href="/dist/#/">` in index.html
2. Build the app by using grunt `grunt build`
3. Kept the dist into the folder `TOMCAT_HOME/webapp/ROOT`
Problem :
1. When i refresh the page it show 404
2. When I copy the URL and paste then also it's giving 404 error.
3. Provide me link for tomcat configurations
Note : If i hit the browser with Host/dist app is running (if i navigate state by state).
Please help me where i did mistake. And how to resolve it (with tomcat sever configuration if required).
URL's I fallowed :
Deploy AngularJS app on tomcat
http://diveintohtml5.info/examples/history/fer.html
Removing the fragment identifier from AngularJS urls (# symbol)
Not sure if you are still looking for the answer, but I will share my solution in case anyone needs it.
What I did was basically use http://tuckey.org/urlrewrite/
and set the rule as
<rule>
<from>^/search/$</from>
<to>index.html</to>
</rule>
I want to point out that I used the actual file name instead of the url I want to go.
Hope this helps!
Regards,
Berkan
Any time, I make code changes in .hmtl file or the .js file, the browser still renders the old code and my new code changes don't show up in the browser result.
For example, I add the following 2 lines of code in .html file.
<div class="control-group">
<label class="control-label">First Name</label>
<div class="controls readonly">
{{profile.FirstName}}
</div>
</div>
<div class="control-group">
<label class="control-label">Last Name</label>
<div class="controls readonly">
{{profile.LastName}}
</div>
</div>
Then I do the following:
In VS2013, right click on my project and view in browser (IE or Chrome).
Login to my application.
Go the respective page and I see the rendering of the old html file. I do not see the newly added 2 div elements rendered at all.
I even hit f5 to refresh the browser but still no luck.
What am I doing wrong?
Hit F12 in your browser to bring up the Developer Tools. Disable the Cache. Reload your page.
Besides using Dev Tools to make sure the cache is disabled, you can edit your Web.config file and tell IIS to not cache your Angular files:
<configuration>
<!-- Disable IIS caching for directories containing Angular templates and scripts -->
<location path="app">
<system.webServer>
<staticContent>
<clientCache cacheControlMode="DisableCache"/>
</staticContent>
</system.webServer>
</location>
...
</configuration>
My Angular root directory is app/. You may need to modify according to your file structure.
TypeScript only!
In tsconfig.json add…
"compileOnSave": true,
Try disabling your cache with Dev Tools:
https://developer.chrome.com/devtools/docs/settings#general
Open devTools in chrome and select Network tab, In Network tab Un-check the Disable cache and reload the page.
For me, none of the previous answers worked. I was using Chrome, and the only way I was able to view the update was by opening an incognito window. My regular browser window, for some reason, just will not get the latest assets.
I have tried clearing my cache, disabling cache on devtools, and hard refresh, to no avail. The only way I was able to fix it was by clearing the DNS cache. Here's a link with more details:
How to Clear the DNS Cache on Computers and Web Browsers
Using command line, here's how you go about doing it:
Windows 7 & Earlier
ipconfig /flushdns
Windows 8
ipconfig /flushdns
OSX (Yosemite, El Capitain, and Sierra)
sudo dscacheutil -flushcache
sudo killall -HUP mDNSResponder
You need to change the aspnetcore enviroment variable from production to development. From the official website:
... set an environment variable to tell ASP.NET to run in development mode:
If you’re using PowerShell in Windows, execute $Env:ASPNETCORE_ENVIRONMENT = "Development"
If you’re using cmd.exe in Windows, execute setx ASPNETCORE_ENVIRONMENT "Development", and then restart your command prompt to make the change take effect
If you’re using Mac/Linux, execute export ASPNETCORE_ENVIRONMENT=Development
If you are in linux, you might have to do it as a superuser. i.e.
sudo export ASPNETCORE_ENVIRONMENT=Development
The value of the variable may revert back to Production after re-booting. If you want to work with several environments, I suggest you define them in the launchSettings.json file:
{
"iisSettings": {
"windowsAuthentication": false,
"anonymousAuthentication": true,
"iisExpress": {
"applicationUrl": "http://localhost:40088/",
"sslPort": 0
}
},
"profiles": {
"IIS Express": {
"commandName": "IISExpress",
"launchBrowser": true,
"environmentVariables": {
"ASPNETCORE_ENVIRONMENT": "Development"
}
},
"IIS Express (Staging)": {
"commandName": "IISExpress",
"launchBrowser": true,
"environmentVariables": {
"ASPNETCORE_ENVIRONMENT": "Staging"
}
}
}
}
Read about environments here:
In chrome press F12>go to network tab> disable cache
deleting the dist folder from clientApp folder from source resolve my issue and it started auto refresh again
Or you can use Browserlink in Visual Studio 2013 to automatically reload the page
http://www.asp.net/visual-studio/overview/2013/using-browser-link
You need to run command yarn webpack:build to recompile your client code. Otherwise modifications/updates in .HTML, .json, .ts files will not be reflected.
I simply deleted the dist folder in Visual Studio and it auto refreshed again.
**** this was for Angular 7 ***
Just right click on the page reload button on the browser and choose "Empty cache and Hard Reload"
In my case issue inside Angular.json file "deployUrl": should be relative path Like "/support/yourpagenam/bundle/dist/"
Hence any changes made in Angular files are not reflecting to Browser.
Problem
Client-side (Browser) caching of static files in dev enviornment
Server-side (IIS Express) caching of static files in dev enviornment
Solutions
For Client-side (Browser) caching of static files in dev enviornment
Web.Config/ApplicationHost.config Approch: Web.config Approach
suggested by #NateBarbettini above. Please note that this approach is
also can be applied to 'Applicationhost.config' instead of web.config
file.
"Always Refresh From Server" in IE as suggested above by #Phil Degenhardt. Please find screenshot below.
Navigate to source file location in browser address bar: Try to navigate to the JavaScript file in question by typing the address. It will show you JavaScript file contents. Once you do this, file gets updated.So you can again go back and try to navigate to proper landing page of your application. This time, you will see you get latest JavaScript code getting executed.
e.g. If you have problem with not updating 'app/home/home-account.js'. Then in browser navigate to 'http://[your-host/localhost]:[specified port of your application]/app/home/home-account.js. This will show you the contents. Then again navigate to your application's home page i.e. in this case 'http://[your-host/localhost]:[specified port of your application]/'
For Server-side (IIS-Express) caching of static files in dev enviornment
visit IIS Express appcmd commandline utility. In my case, appcmd is located in "C:\Program Files(x86)\IIS Express\appcmd.exe" this path. Then use SITE list and SITE delete command to remove temporary files cached in iisexpress.
There is also one solution which is specific to IE mentioned here:
Visual Studio 2013 caching older version of .js file
This happens because of cache stored by the browser. Before running your application you can delete cache and cookies stored by your browser.
Set HTTP Response headers to expire content through IIS manager.
Open HTTP Response Headers module for you web application
Click Set Common headers in the Actions pane
https://www.iis.net/configreference/system.webserver/staticcontent/clientcache
I opened link in Incognito mode since in that mode cache is disabled and Voila it worked.
I am trying to follow the tutorial on creating a MEAN app on scotch.io.
I am using the WebStorm IDE and after completely following through I am stuck with a problem that seems to emerge from WebStorm. If I click on the "Open in Chrome"-Button in the IDE I am referred to:
localhost:63342/scotch_mean_tutorial/views/index.html
However, the actual port that I specified in my server.js is 8080 file:
// listen (start app with node server.js) ======================
app.listen(8080);
console.log("App listening on port 8080");
I have built a node API and it works when I go to:
http://localhost:8080/api/todos
However, clicking on the "Open in Chrome" through my WebStorm IDE uses a different port (i.e. 63342) and thus I am left with the following error:
GET http://localhost:63342/api/todos 404 (Not Found)
I am not sure how to resolve this? Any ideas?
You need to create a javascript debug run configuration with the correct URL (http://localhost:8080/api/todos) and use this configuration to open your URL in browser. Another option: specify this URL in Live Edit/Browser tab of node.js run configuration you use to run your server.js and tick 'after launch' checkbox to automatically start the browser with this URL on server start.
In Webstorm 9, you can configure the port for debugging apps. In Preferences:
Build, Execution, Deployment > Debugger > Built-in Server Port
I am using IntelliJ IDEA to develop AngularJS app with Java back-end. HTML/JS is server from Tomcat.
Whenever I changed HTML/JS file, I hit CMD+F10 and select Update resources, then refresh my browser and everything is OK.
I'd like to ask if there is a way that IntelliJ would do this automatically for me. I know that I can check 'Don't ask again', but sometimes I really want to Redeploy or Restart server as well ...
If you go into your Server Run Configuration, on the Server tab there is an option named "On frame deactivation". Set that to "Update resources" and then whenever IDEA loses focus, it will update the resources of the server.
Relevant docs from Intellij http://www.jetbrains.com/idea/webhelp10.5/updating-a-running-java-ee-application.html#update_on_frame_deactivation
Edit 8/19/2020
Thanks to Adi Gerber for providing an updated link, which is https://www.jetbrains.com/help/idea/2016.2/updating-applications-on-application-servers.html#update (the previous one doesn't work anymore)
And here is a link to the current docs as of 8/19/2020: https://www.jetbrains.com/help/idea/updating-applications-on-application-servers.html#update
Another TRUE AUTOMATED APPROACH that works very well is :
Having an imported Maven project
Option: Build Tools > Maven > Importing > Import Maven Project Automatically to keep in sync IDE compiler options specified in POM ( for example maven-compiler-plugin options)
Plugin: File Watcher to watch for resources' updates
Option: Tools > File Watcher > Custom watches to copy updated files via mvn war:exploded ( in our case Javascript and HTML )
Option: Build > Compiler Build Project Automatically to update .class
In our case we deploy on Google Cloud App Engine Devserver which reloads files everytime they are updated
I have been using 1.2.6 and downloaded 1.3 to try it out. I am using wampserver with Apache 2.2.11. I have mod rewrite enabled. When I bake a new application using the cake 1.3 console, after I verify that the webroot/index.php of the application CAKE_CORE_INCLUDE_PATH is set to the Cake1.3 Installation folder. The result is a page thats missing CSS, missing a method. Typing in localhost/app/index.php will enable the program to find the app. Therefore I have to assume the rewrite module isnt functioning properly for v1.3. Is there something I have to add to the cake installation or app folder to make this function as it should?
No, Cake is set up properly from the start. The thing that always trips me up is that I forget to set my Apache virtual host's AllowOverride value to All. This allows the .htaccess file to be read.
Are there any error messages in your apache error logs?
Did you replace the previous application's directory with the new one? If not, you may need to add a tag with the appropriate AllowOverride permissions set inside your httpd.conf file, to allow mod rewrite to execute.
Can you load /css/style.css in your browser or does it give a 404?
This may sound like a silly question, but after you made your changes to AllowOverride in your Apache configuration, did you restart Apache?