使用公共文件夹中的图像

I'm trying to set as background an image located at /public/images/my-image.jpg

我试图设置一个位于/public/images/my-image.jpg的图像作为背景

I've tried

我试过了

<body background="public/images/my-image.jpg">

and

和

<body background="images/my-image.jpg">

and

和

<body background="my-image.jpg">

But I always get 404 (Not Found) on the Chrome console. Any idea why?

但我总是在Chrome控制台上得到404(未找到)。知道为什么吗?

I also tried adding this:

我也试着加上这个:

<style>
    body {
        background-image: url("/public/images/my-image.jpg");
    }
</style>

But nothing appears in the background of the page.

但是页面的背景没有显示任何内容。

3 个解决方案

#1

As I understand it, you've got a problems obtaining assets in playframework. Follow the documentation for play framework for assets.

据我所知，您在playframework中获取资产有问题。按照文件为资产运行框架。

To obtain assets from public directory (if you haven't change the default routes or assets controller), you need to use path with assets/ instead of public/. Or more preferable using reverse router. In play 2.5x in your case it would be:

要从公共目录获取资产(如果您没有更改默认路由或资产控制器)，您需要使用资产/而不是public/的路径。或者使用反向路由器更好。在游戏2.5x中，你的情况是:

<body background="@routes.Assets.versioned("images/my-image.jpg")">

<身体背景= " @routes.assets.versioned(“图像 my-image.jpg”)">

using reverse routing or

使用反向路由或

<body background="assets/images/my-image.jpg">

<身体背景= "资产图片 my-image.jpg”>

with hard coded path.

用硬编码的路径。

#2

I think it is not supported anymore in HTML5, try to use css like body { background-image: url("gradient_bg.png"); }

我认为HTML5不再支持它了，尝试使用body {background-image: url(“gradient_bg.png”)这样的css;}

font: https://www.w3schools.com/tags/att_body_background.asp

字体:https://www.w3schools.com/tags/att_body_background.asp

#3

You need to have a record in the routes file

您需要在路由文件中有一个记录

GET     /assets/*file               controllers.Assets.versioned(path="/public", file: Asset)

Then you can access the files in the public folder with the twirl helper:

然后您可以使用twirl助手访问公共文件夹中的文件:

<body background="@routes.Assets.versioned("images/my-image.jpg")">

It would be compiled to

它将被编译成

<body background="/assets/images/my-image.jpg")">

You can put it as static text as well.

你也可以把它作为静态文本。

If you want to change "assets" to "public" or whatever, just change it in the routes file:

如果您想将“资产”更改为“公共”或其他，请在route文件中更改:

GET     /public/*file               controllers.Assets.versioned(path="/public", file: Asset)

Then your assets would be accessible by the public path, like:

那么您的资产可以通过公共路径访问，比如:

<body background="/public/images/my-image.jpg")">

Still, the @routes.Assets.versioned would be the same:

不过,@routes.Assets。版本化是一样的:

<body background="@routes.Assets.versioned("images/my-image.jpg")">

This is the reason why @routes.Assets.versioned is preferable way.

这就是为什么@routes.Assets。版本是更可取的方式。

#1