java - 为什么 Wicket 不呈现此 Logo ？

Question

我有一个 BasePage.java(还有一个 BasePage.html)。我的基本页面基本上是 mycssmenu.com 制作的 CSS 菜单(我不擅长 CSS)。我想将我大学的 Logo 添加到基页:

        <ul>
            <li><a href="MainPage.html"wicket:id="home">Home</a></li>
            <li><a href="LecturerPage.html"wicket:id="lect">Lecturer Page</a></li>
            <li><a href="StudentPage.html"wicket:id="stud">Student Page</a></li>
        </ul>
    </li>
    <li><span class="qmdivider qmdividery" ></span></li>
    <li><a class="qmparent" href="javascript:void(0)">About</a>
        <ul>
            <li><a href="About.html"wicket:id="about">About</a></li>
        </ul>
    </li>
    <li class="qmclear">&nbsp;</li>
</ul>
<script type="text/javascript">qm_create(0,false,0,500,false,false,false,false,false</script>
</div>
<div id= "body">
    <img src="C:\Users\Eliezer Shindler\Desktop\cityunilogo.jpg"alt="City Logo"/>
    <wicket:child />

简而言之，当我在网络浏览器中打开页面时，会显示城市 Logo ，但在运行 Wicket 时不会显示。为什么，我怎样才能让它与 Wicket 一起工作？我对 Wicket 很陌生。

Answer 1

您引用的是本地驱动器路径 (C:\...)，它:a) 在您的机器之外无法工作； b) 即使有效，由于安全限制，浏览器也不会显示它(如果原始页面也从磁盘加载，则只会打开本地文件)。

永远不要在网络应用程序中使用本地机器路径。千万不要，它是邪恶的，你的后代会被诅咒7代。

如果您希望在 Web 应用程序中显示图像，请将其移动到应用程序上下文或类路径中的文件夹中，并使您的页面指向那里。

假设你的元素布局是这样的:

myapp/
    src/
        myapp/
            MyApplication.java
            MyPage.java
            MyPage.html
    web/
        WEB-INF/
            web.xml

您可以创建一个 myapp/web/images 文件夹，然后将您的图像(例如，logo.png)复制到其中:

myapp/
    src/
        myapp/
            MyApplication.java
            MyPage.java
            MyPage.html
    web/
        images/
            logo.png
        WEB-INF/
            web.xml

在 MyPage.html 中，标记应该是这样的:

<img src="images/logo.png">

另一种方法是从 Java 代码添加图像，使图像/资源与 .java 文件并排放置:

myapp/
    src/
        myapp/
            images/
                logo.png
            MyApplication.java
            MyPage.java
            MyPage.html
    web/
        WEB-INF/
            web.xml

然后，MyPage.html 中的声明将是

<img wicket:id="logo">

MyPage.java 将包含

add(new Image("logo", new PackageResourceReference(HomePage.class, "images/logo.png")));

意味着 logo.png 文件位于“images”文件夹中，相对于 HomePage 类的包。

CSS 和 javascript 文件可以使用类似的方法(使用 header 贡献而不是 Image)。

这要冗长得多，但可能非常有用，特别是如果您将可重用组件模块化到一个库中，因为您可以将所有资源(图像、css 和 javascript 文件等)捆绑到一个 jar 中。