Wednesday, June 15, 2016

Deploying .war file to tomcat 8 works fine in IDE but I lose all my JS and CSS when I deploy to my VPS

Leave a Comment

I have a spring-boot application. When I start run it Tomcat 8.0_35 in my intellij IDE I have no issues, looks great. I decided to deploy in on my VPS and only the HTML renders. I replicated this issue on my localhost by manually dropping the .war file into webapps. Since I was getting all 404 errors I thought maybe I need to set up a webconfig class:

@Configuration public class WebConfiguration extends WebMvcAutoConfiguration.WebMvcAutoConfigurationAdapter {      private static final Logger log = Logger.getLogger(WebMvcAutoConfiguration.class);      @Override     public void addResourceHandlers(ResourceHandlerRegistry registry) {          registry.setOrder(Ordered.HIGHEST_PRECEDENCE);          registry.addResourceHandler("/css/**").addResourceLocations("/resources/css/");          registry.addResourceHandler("/image/**").addResourceLocations("/resources/image/");          registry.addResourceHandler("/images/**").addResourceLocations("/resources/images/");          registry.addResourceHandler("/javascripts/**").addResourceLocations("/resources/javascripts/");          registry.addResourceHandler("/libs/**").addResourceLocations("/resources/lib/");      }      @Override     public void configureDefaultServletHandling(DefaultServletHandlerConfigurer configurer) {         configurer.enable();     }      @Bean     public DispatcherServlet dispatcherServlet(){         DispatcherServlet dispatcherServlet = new DispatcherServlet();          dispatcherServlet.setThrowExceptionIfNoHandlerFound(true);          return dispatcherServlet;     }      @Bean     public ServletContextTemplateResolver templateResolver() {         ServletContextTemplateResolver resolver = new ServletContextTemplateResolver();         resolver.setPrefix("/WEB-INF/");         resolver.setSuffix(".html");         resolver.setTemplateMode("HTML5");         resolver.setOrder(1);         return resolver;     }  }   

I needed the ServletContextTemplateResolver because I am using spring-mobile and I was having issues rendering my pages.

I am not seeing anything in the logs on tomcat either localhost.log and cataline.log

@SpringBootApplication public class StidhamFinancialApplication extends SpringBootServletInitializer {      public static void main(String[] args) throws UnknownHostException {         SpringApplication app = new SpringApplication(StidhamFinancialApplication.class);          Environment env = app.run(args).getEnvironment();        System.out.println(String.format("Access URLs:\n----------------------------------------------------------\n\t" +                 "Local: \t\thttp://127.0.0.1:%1s\n\t" +                 "External: \thttp://%2s:%3s\n----------------------------------------------------------",             env.getProperty("server.port"),             InetAddress.getLocalHost().getHostAddress(),             env.getProperty("server.port")));     }      @Override     protected SpringApplicationBuilder configure(SpringApplicationBuilder builder) {         return builder.sources(StidhamFinancialApplication.class);     } } 

All my JS, and CSS file are found in my IDE and everything seems to be configured correctly. I am not sure what to try next. I have been debugging this for days with no luck.

I uploaded it on git at https://github.com/drewjocham/financial

Any advice would be greatly appreciated.

Only thing the logs are complaining about is a few jar files:

org.apache.jasper.servlet.TldScanner$TldScannerCallback.scan No TLD files were found in [file:/Library/apache-tomcat-8.0.35/webapps/stidhamfinancial/WEB-INF/lib/jandex-1.1.0.Final.jar]. Consider adding the JAR to the tomcat.util.scan.StandardJarScanFilter.jarsToSkip property in CATALINA_BASE/conf/catalina.properties file. 

in my logging.properties I added the following:

org.apache.jasper.compiler.TldLocationsCache.level = FINE  org.apache.catalina.startup.TldConfig.jarsToSkip=antlr-2.7.7.jar org.apache.catalina.startup.TldConfig.jarsToSkip=spring-boot-1.3.5.RELEASE.jar org.apache.catalina.startup.TldConfig.jarsToSkip=groovy-2.4.6.jar org.apache.catalina.startup.TldConfig.jarsToSkip=javassist-3.18.1-GA.jar org.apache.catalina.startup.TldConfig.jarsToSkip=aopalliance-1.0.jar 

After doing some research but that doesn't seem to work. However I do not think this could be the issue.

2 Answers

Answers 1

Drew1208

I opened this Pull request that will solve your problem https://github.com/drewjocham/financial/pull/1

I added some hibernate configs to be able to run and also execute the tests. And also removed the '/' from the resources path.


UPDATE

I found the issue. The resources folder structure looks like that:
resources css style.css images team-6-med-blur.png

So in the file style.css the image path are relative to this file and not to the application context. Then you need to change from:
background-image:url('resources/images/stidhamfinancial/team-6-med-blur.png');
to
background-image:url('../images/stidhamfinancial/team-6-med-blur.png');

It will show the images.

Also I've opened this PR#2 in your repo.

Answers 2

Always use relative paths for referencing the resource.

Snippet from your index.html

    <link rel="stylesheet" type="text/css" href="/resources/css/superfish.css"/>     <link rel="stylesheet" type="text/css" href="/resources/css/nivo-slider.css"/>     <link rel="stylesheet" type="text/css" href="/resources/css/jquery.qtip.min.css"/>     <link rel="stylesheet" type="text/css" href="/resources/css/jquery-ui.css"/>     <link rel="stylesheet" type="text/css" href="/resources/css/jquery.fancybox.css"/>     <link rel="stylesheet" type="text/css" href="/resources/css/jquery.fancybox-buttons.css"/> 

Should be

    <link rel="stylesheet" type="text/css" href="resources/css/superfish.css"/>     <link rel="stylesheet" type="text/css" href="resources/css/nivo-slider.css"/>     <link rel="stylesheet" type="text/css" href="resources/css/jquery.qtip.min.css"/>     <link rel="stylesheet" type="text/css" href="resources/css/jquery-ui.css"/>     <link rel="stylesheet" type="text/css" href="resources/css/jquery.fancybox.css"/>     <link rel="stylesheet" type="text/css" href="resources/css/jquery.fancybox-buttons.css"/> 

Explanation

When somebody uses "/" at the start of URL/resource, browser will try to load that resource from ROOT context of web server. A root context for web server may or may not be same as your application as application can be deployed at root context or any other context.

It is always advised to use relative paths to link your resource

You should use relative path for all static urls. I also found that many resources are not available in your github repo like superfish.css. Include those else they will result in 404

If You Enjoyed This, Take 5 Seconds To Share It

0 comments:

Post a Comment