Spring, Prime Faces application not showing CSS when deploying to Heroku - java

I am working with Spring 3.1.3, Prime Faces 3.4.2, Hibernate 3.6.8 and Pretty Faces 2.0.4.
The CSS is showing when I deploy the app in a local Server (Apache Tomcat 7), but when I deploy the same project to Heroku the CSS is not showing.
This is how I input the CSS in my main.xhtml template file:
<h:outputStylesheet library="css" name="bootstrap.css" />
<h:outputStylesheet library="css" name="custom.css" />
This is the result in the html source (local server):
<link type="text/css" rel="stylesheet" href="/evaluation-cloud/javax.faces.resource/theme.css.jsf?ln=primefaces-cupertino" />
<link rel="stylesheet" media="screen" type="text/css" href="/evaluation-cloud/javax.faces.resource/bootstrap.css.jsf?ln=css" />
<link rel="stylesheet" media="screen" type="text/css" href="/evaluation-cloud/javax.faces.resource/custom.css.jsf?ln=css" />
<link rel="stylesheet" media="screen" type="text/css" href="/evaluation-cloud/javax.faces.resource/primefaces.css.jsf?ln=primefaces" />
This is the result in the html source when deployed to Heroku
<link type="text/css" rel="stylesheet" href="//javax.faces.resource/theme.css.jsf?ln=primefaces-cupertino" />
<link rel="stylesheet" media="screen" type="text/css" href="//javax.faces.resource/bootstrap.css.jsf?ln=css" />
<link rel="stylesheet" media="screen" type="text/css" href="//javax.faces.resource/custom.css.jsf?ln=css" />
<link rel="stylesheet" media="screen" type="text/css" href="//javax.faces.resource/primefaces.css.jsf?ln=primefaces" />
Notice the '//' in the href
I don't know why this is happening. If someone have experienced the same issue please help me.
Thank you.

I changed the configuration to use jetty runner and that solved the problem.

Related

Unable to see the highlight code on browser side in source code in Spring boot(thymeleaf-extras-springsecurity5) application?

I'm working on embedded Okta login page in that I'm using 'thymeleaf'.This Thymleaf code not shown in browser side code and after Authentication below code not working. Please help on this code.
========= Code =========
<!DOCTYPE html>
<html lang="en"
xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org"
xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity5">
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width=device-width, initial-scale=1.0" />
<meta http-equiv="X-UA-Compatible" content="ie=edge" />
<title>Login</title>
<link href="css/bootstrap.min.css" rel="stylesheet" type="text/css" />
<link href="css/bootstrap-datetimepicker.min.css" rel="stylesheet" type="text/css"/>
<link th:href="#{/css/touch-style.css}" rel="stylesheet" type="text/css"/>
<link href="https://fonts.googleapis.com/css?family=Open+Sans" rel="stylesheet" type="text/css" />
<link href="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"/>
<link href="https://netdna.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"/>
<link href="css/okta.css" rel="stylesheet" type="text/css"/>
<script src="https://global.oktacdn.com/okta-signin-widget/6.6.2/js/okta-sign-in.min.js" type="text/javascript"></script>
<link href="https://global.oktacdn.com/okta-signin-widget/6.6.2/css/okta-sign-in.min.css" type="text/css" rel="stylesheet"/>
<link href="https://ok1static.oktacdn.com/assets/js/sdk/okta-signin-widget/2.13.0/css/okta-theme.css" type="text/css" rel="stylesheet"/>
</head>
<body class="login-page">
<div id="okta-login-container"></div>
<div sec:authorize="isAuthenticated()">
<script type="text/javascript">
window.location.href = "/dashboard";
</script>
</div>
<div>Normal Text Message</div>
<div th:replace="fragments/footer :: footer"></div>
<script th:src="#{/js/login.js}"></script>
</body>
</html>

using multiple header, footer when using thymeleaf

when using thymeleaf, i created a seperate header and footer. but when i'm using it in another page it will generate error in IDE since xmlns:th="http://www.thymeleaf.org is not there. but the code is working in chrome. how can i eliminate error in IDE?
<!DOCTYPE html >
<html xmlns:th="http://thymeleaf.org">
<head th:fragment="head">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title> Data Tables</title>
<!-- Tell the browser to be responsive to screen width -->
<meta content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no" name="viewport">
<link rel="stylesheet" th:href="#{/css/bootstrap.min.css}">
<link rel="stylesheet" th:href="#{/css/buttons.bootstrap.min.css}">
<link rel="stylesheet" th:href="#{/css/font-awesome.min.css}">
<link rel="stylesheet" th:href="#{/css/dataTables.bootstrap.min.css}">
<link rel="stylesheet" th:href="#{/css/fonts.css}">
<link rel="stylesheet" th:href="#{/css/AdminLTE.min.css}">
<link rel="stylesheet" th:href="#{/css/_all-skins.min.css}">
<link rel="stylesheet" th:href="#{/css/style.css}">
</head>
header.html
<div th:replace="fragments/head.html :: head "></div>
<div th:replace="fragments/header.html :: header"></div>
<div th:replace="fragments/sidenav.html :: sidenav"></div>
<div th:replace="fragments/footer.html :: footer"></div>
index.html
in index.html there is an error

Thymeleaf namespace in html files display errors in Netbeans - How can I get it pass HTML checking?

Netbeans HTML checking doesn't like my thymeleaf namespace.
Here is my HTML Thymleaf file:
<!DOCTYPE html>
<html xmlns:th="http://www.thymeleaf.org">
<head th:fragment="head">
<object th:include="fragments/meta :: meta" th:remove="tag" />
<link href='http://fonts.googleapis.com/css?family=Source+Sans+Pro:400,700|Open+Sans:300italic,400,300,700' rel='stylesheet' type='text/css'/>
<link href="/../../../webjars/Semantic-UI/2.0.6/semantic.min.css" rel="stylesheet" th:href="#{/webjars/Semantic-UI/2.0.6/semantic.min.css}"/>
<link href="../../../css/core.css" rel="stylesheet" th:href="#{/css/core.css}" />
<link href="../../../css/product.css" rel="stylesheet" th:href="#{/css/product.css}" />
</head>
<body>
</body>
</html>
This is the error displayed in Netbeans:
How can I get Netbeans to play nicely with Thymeleaf?
Try to fix it in this way you may ignore spring security thing.
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml"
xmlns:th="http://www.thymeleaf.org"
xmlns:sec="http://www.thymeleaf.org/thymeleaf-extras-springsecurity3">
<head>
<meta charset="utf-8"/>
<title>Sample</title>
<link th:href="#{/resources/css/bootstrap.css}" rel="stylesheet" type="text/css"/>
<link th:href="#{/resources/css/bootstrap-theme.css}" rel="stylesheet" type="text/css"/>
</head>
I found out how to disable these errors when I was taking this spring security tutorial
Simply by adding this to html tag:
xmlns="http://www.w3.org/1999/xhtml"
what's even cooler, netbeans now tracks if you closed every tag with slash "/" in document.

Can I get the url of the page that I downloaded with jsoup?

Is there a way that I could get the url of the page that I just downloaded? Not the links that are contained in the html page, but the url of the actual html page itself
?
I tried doing this,
org.jsoup.nodes.Document doc = Jsoup.parse(child, "UTF-8", "");
string url = doc.location();
System.out.println(url);
but then the url would return an empty string.
Assuming the page you downloaded is a Document, simply call Document.location() to get the URL it was served from. If the URL you passed to Jsoup.connect() was a redirect, the Document location will give you the URL it was eventually served from.
If you used WinHTTrack usually it saves the URL, but what you could do is look for PHP files or JavaScript files that are connected to the site's URL. For instance the downloaded site below has a few links:
<html lang="en-US">
<!-- Mirrored from brigade3.com/ by HTTrack Website Copier/3.x [XR&CO'2014], Sat, 13 Dec 2014 04:02:28 GMT -->
<!-- Added by HTTrack --><meta http-equiv="content-type" content="text/html;charset=UTF-8" /><!-- /Added by HTTrack -->
<head>
<meta charset="UTF-8" />
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name=viewport content="width=device-width,initial-scale=1">
<title>BukkitCloud | Beta Stage</title>
<link rel="profile" href="http://gmpg.org/xfn/11" />
<link rel="pingback" href="xmlrpc.php" />
<link rel="shortcut icon" type="image/x-icon" href="assets/uploads/2013/12/favico.png">
<link rel='stylesheet' href='http://fonts.googleapis.com/css?family=Open+Sans:400,800,700italic,700,600italic,600,400italic,300italic,300|Source+Sans+Pro:200,300,400|Lato&subset=latin,latin-ext' type='text/css' />
<link rel="alternate" type="application/rss+xml" title="Brigade » Feed" href="feed/index.html" />
<link rel="alternate" type="application/rss+xml" title="Brigade » Comments Feed" href="comments/feed/index.html" />
<link rel='stylesheet' id='rs-settings-css' href='assets/plugins/revslider/rs-plugin/css/settings.css' type='text/css' media='all' />
<link rel='stylesheet' id='rs-captions-css' href='assets/plugins/revslider/rs-plugin/css/captions.css' type='text/css' media='all' />
<link rel='stylesheet' id='default_style-css' href='assets/themes/passage/style.css' type='text/css' media='all' />
<link rel='stylesheet' id='stylesheet-css' href='assets/themes/passage/css/stylesheet.min.css' type='text/css' media='all' />
<!--[if IE 8]>
<link rel='stylesheet' id='ie8-style-css' href='http://brigade3.com/assets/themes/passage/css/ie8.min.css' type='text/css' media='all' />
<![endif]-->
<!--[if IE 9]>
<link rel='stylesheet' id='ie9-style-css' href='http://brigade3.com/assets/themes/passage/css/ie9.min.css' type='text/css' media='all' />
<![endif]-->
<link rel='stylesheet' id='style_dynamic-css' href='assets/themes/passage/css/style_dynamic.css' type='text/css' media='all' />
<link rel='stylesheet' id='responsive-css' href='assets/themes/passage/css/responsive.min.css' type='text/css' media='all' />
<link rel='stylesheet' id='style_dynamic_responsive-css' href='assets/themes/passage/css/style_dynamic_responsive.css' type='text/css' media='all' />
<link rel='stylesheet' id='custom_css-css' href='assets/themes/passage/css/custom_css.css' type='text/css' media='all' />
<script type='text/javascript' src='http://brigade3.com/wp-includes/js/jquery/jquery.js'></script>
<script type='text/javascript' src='http://brigade3.com/wp-includes/js/jquery/jquery-migrate.min.js'></script>
<script type='text/javascript' src='assets/plugins/revslider/rs-plugin/js/jquery.themepunch.revolution.min.js'></script>
<link rel='prev' title='FEATURES' href='features/index.html' />
<link rel='next' title='CONTACT' href='contact/index.html' />
<link rel='canonical' href='index.html' />
<link rel='shortlink' href='index.html' />
<style type="text/css">
.comments-link {
display: none;
}
</style>...
Then, as you see, you search out a possible URL that could be it, so in this case it would be this URL that is link to a JavaScript file.
<script type='text/javascript' src='http://brigade3.com/wp-includes/js/jquery/jquery.js'></script>
<script type='text/javascript' src='http://brigade3.com/wp-includes/js/jquery/jquery-migrate.min.js'></script>
Then just take http://brigade3.com/wp-includes/js/jquery/jquery.js and shorten it down to http://brigade3.com and you found the site URL. I hope this is what you mean!

How to Link the CSS in Eclipse?

I am facing problem while linking the css file in jsp page.
My eclipse folder structure is
--SampleProject
--WebContent
--META-INF
--resource
--css
style.css
--images
(style sheet images are present here)
--js
--WEB-INF
a.jsp
b.jsp
I want to link the css from this path resource/css/style.css in a.jsp page.
I tried all the below combinations. but no use.
<link href="${pageContext.request.contextPath}/css/styles.css" rel="stylesheet" type="text/css" media="screen" />
<link href="../css/styles.css" rel="stylesheet" type="text/css" media="screen" />
<link href="../../css/styles.css" rel="stylesheet" type="text/css" media="screen" />
<link href="WebContent/resource/css/styles.css" rel="stylesheet" type="text/css" media="screen" />
<link href="resource/css/styles.css" rel="stylesheet" type="text/css" media="screen" />
and in style sheet i am linking the images by using
body {
background: #c9ebff url(resource/images/left_panel.jpg) top repeat-x;
}
please help to resolve this issue.
Thanks in advance.
Try to use
body { background: #c9ebff url(../images/left_panel.jpg) top repeat-x; }
or
body { background: url(../images/left_panel.jpg); } // if linking, then add other attributes
When facing these type of issues i.e files not linking .... try to use
FIREBUG for tracing out the browser/linking errors ... FireBug very
useful debugging tool.
Use backslash (\) instead of forward slash in path (/).
Example:
<link href="..\css\styles.css" rel="stylesheet" type="text/css" media="screen" />

Categories