404 Not Found JS and CSS

Question

I have a portlet deployed on my Liferay/Tomcat server. The portlet.xml is calling the init param "/index.html". This file renders fine on my portal.

I have /css and /js folders on the same level as my index.html, under the /docroot.

I link them like this:

<script type="text/javascript" src="js/somejs.js"></script> 
<link rel="stylesheet" type="text/css" href="css/mystyles.css">

The file structure:

 /docroot/
        /css/
        /js/
        index.html

However, I'm getting these 404's

"NetworkError: 404 Not Found - http://localhost:8080/web/guest/js/somejs.js"
"NetworkError: 404 Not Found - http://localhost:8080/web/guest/css/mystyles.css"

My folders won't get recognized unless I type this explicitly link my portlet like this:

<script type="text/javascript" src="MyPortlet/js/somejs.js"></script>

This is undesirable, as the name of the portlet may change in the future and I'll have to rename all <script>'s and <link> references.

Any ideas fix this issue? Does I need a global context path?

Answer 1

Solution1 (quick fix) : Add below code in your JSP

<script src="<%=renderRequest.getContextPath()%>/js/somejs.js"></script> 
<link   href="<%=request.getContextPath()%>/css/mystyles.css" rel="stylesheet"/>

Solution 2 (Liferay recommended) : add below code in liferay-portlet.xml and let Liferay load the css & js files.

<header-portlet-css>/css/mystyles.css</header-portlet-css>
<footer-portlet-javascript>/js/somejs.js</footer-portlet-javascript> 

But i would suggest keep your all js and css file into theme and access from there