Return Laravel 7 中的响应图像

Question

我正在尝试创建一个迷你 random 图像生成器，作为开始我已经尝试过 :

Route::get('/img/UoJb9wl.png','Image@random');

我所做的就是return这个

return '<img src="/assets/fe/img/welcome.jpeg" alt="Smiley face" width="200">';

然后，我在现场测试了：

如果我转到 URL

，我会看到图像已加载

https://www.bunlongheng.com/img/UoJb9wl.png

如果我在 JSFiddle 这样的网站上导入

<img src="https://www.bunlongheng.com/img/UoJb9wl.png">

我看不到。

为什么？

编辑

尝试#2

return env('APP_URL').'/assets/fe/img/welcome.jpeg';

我现在return图片路径

但我的 JSFiddle 仍然没有渲染

<img src="https://www.bunlongheng.com/img/UoJb9wl.png">

Answer 1

这不起作用只是因为 returning 图片源 <img src="/assets/fe/img/welcome.jpeg" alt="Smiley face" width="200"> 在您的 JSFiddle 上不可用，即使它在任何其他网站上也不起作用，因为没有人有此相对路径上的图像 /assets/fe/img/welcome.jpeg。如果你真的想这样做，你必须指定完整的绝对路径。 <img src="https://www.bunlongheng.com/assets/fe/img/welcome.jpeg" alt="Smiley face" width="200">.

所以你的 return 语句可能是。

return '<img src="env('APP_URL')/assets/fe/img/welcome.jpeg" alt="Smiley face" width="200">';

或者任何你认为好的指定绝对路径。

进一步说明

我查看了 JSFiddle 源代码，您在图像 src 标签中使用了这个 link https://www.bunlongheng.com/img/UoJb9wl.png。如果你指定绝对路径，它根本不起作用。

<img src="https://www.bunlongheng.com/img/UoJb9wl.png">

当浏览器尝试填充 src 标签时，它会将请求发送到 https://www.bunlongheng.com/img/UoJb9wl.png，响应代码为 <img src="/assets/fe/img/welcome.jpeg" alt="Smiley face" width="200">，因此浏览器将像这样填充它。

<img src="<img src="/assets/fe/img/welcome.jpeg" alt="Smiley face" width="200">">

所以你必须 return 只有请求中的图像路径，如果你想在图像的 src 中使用这个路由。

return env('APP_URL')."/assets/fe/img/welcome.jpeg"

如果你想让你的 return 语句与图像标签保持一致，那么你不能在图像的 src 中使用该路由。只需在 div 或任何其他 html 标签中使用。

Answer 2

您的路线 /img/UoJb9wl.png 实际上正在返回 /assets/fe/img/welcome.jpeg，这完全符合预期。

您的 img 标签将不起作用，因为您没有请求图片，您正在请求一条路线，其中 returns 另一个带有图片实际位置的 img 标签。

Answer 3

这不起作用，因为您的控制器 returns 不是图像，而是 HTML 代码。

当你在浏览器中使用这个地址时，它会向你的服务器发送请求，服务器响应 HTML 其中包含 <img src="..."/> 和 link 到实际图像，因此浏览器显示它。

当您尝试在 <img src="..."/> 中使用相同的地址时，您的服务器仍然 returns HTML 不是图像的代码，因此显然不会显示。

您始终可以提供图像本身：

function random()
{
  return response()->file(/* path to image file */);
}

您可以检查 Accept header 以确定要响应的内容：

function random(Request $request)
{
  $accept = $request->header('Accept');
  if (strpos($accept, 'text/html') !== false) {
    return response()->html('<img ...');
  } elseif (strpos($accept, 'image/') !== false) {
    return response()->file(...);
  }
  abort(403, 'No content for requested type');
}

Answer 4

您应该使用以下文件响应，因为您的请求正在抛出一串图像路径。

https://www.bunlongheng.com/assets/fe/img/welcome.jpeg

return response()->file($pathToFile);

return response()->file($pathToFile, $headers);

Answer 5

我使用 Postman 检查了你的 URL，尽管它正在输出实际的 URL.

，但不知何故它显示了 404 错误代码

此外，如果您直接使用它，它应该 return 实际 image.You 可以试试这个：

return response()->file('/assets/fe/img/welcome.jpeg');

Return Laravel 7 中的响应图像

Return Response Image in Laravel 7

php

laravel

image

laravel-5

laravel-7

编辑