无法在Liferay Portlet JSP页面中包含css和JS文件

Question

我已经下载了一个Jquery Image Slider源代码,想要与我的JSP文件进行整合

这是我的Folder Struture

这是我包括他们的方式

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<link type="text/css" href="/css/jquery.ui.theme.css" rel="stylesheet" />
<link type="text/css" href="/css/jquery.ui.core.css" rel="stylesheet" />
<link type="text/css" href="/css/jquery.ui.slider.css" rel="stylesheet" />
<link rel="stylesheet" href="/css/style.css" type="text/css" media="screen"/>

我在服务器控制台中得到了这个404

20:50:04,625 WARN [404_jsp:109] /css/jquery.ui.theme.css
20:50:04,640 WARN [404_jsp:109] /css/jquery.ui.core.css
20:50:04,640 WARN [404_jsp:109] /css/jquery.ui.slider.css
20:50:04,656 WARN [404_jsp:109] /css/style.css
20:50:04,671 WARN [404_jsp:109] /js/cufon-yui.js
20:50:04,671 WARN [404_jsp:109] /js/GreyscaleBasic.font.js
20:50:04,687 WARN [404_jsp:109] /js/jquery.easing.1.3.js

Answer 1

把链接liferay-portlet.xml放进去,让Liferay加载css和javascript.这是更好的方法(例如,如果用户想要将两个portlet放到一个页面上).

Liferay的-portlet.xml中:

<header-portlet-css>/css/main.css</header-portlet-css>
<footer-portlet-javascript>/js/main.js</footer-portlet-javascript>

而Olaf是对的,你必须将css和js文件夹(以及图像)从文件夹移动WEB-INF到docroot文件夹

Answer 2

几个问题:

• 如果我在你发布的缩略图中看到了这个,你在WEB-INF中有你的css和js文件夹:任何浏览器都不能请求WEB-INF中的任何内容,所以你永远无法得到它.

• 如果你创建docroot/css和docroot/js,你仍然会得到404,因为你找不到/css/style.css上的文件,但是在/your-portlet/css/style.css中 - 这是通用的方式在jsps中解决它

  < link rel="stylesheet" href="<%=request.getContextPath()%>/css/style.css"/>
  

后期编辑:request在portlet的JSP上并不总是有效,因为根据JSP规范它是一个HttpServletRequest.在门户网站中,这通常与您的portlet的当前路径无关.因此,我建议使用Mark的答案而不是我的答案:liferay-portlet.xml包含与当前portlet相关的文件.从Liferay 7.0开始,您可以使用OSGi-Component等效于liferay-portlet.xml.