【问题标题】:Laravel display image from path which is in databaseLaravel 从数据库中的路径显示图像
【发布时间】:2017-06-08 09:07:30
【问题描述】:

所以使用是上传一个徽标,它的路径存储在这样的数据库中:

C:\xampp\htdocs\laravel\public\logo\1496912432.jpg

我正在显示这样的图像:

<img class="images" id="image" src="{{$business->image}}" />

但是我得到了这个错误:

Not allowed to load local resource: file:///C:/xampp/htdocs/laravel/public/logo/1496912432.jpg

如何解决这个问题?

//编辑

控制器:

public function image(Request $request) {
    if($request->hasFile('img'))
    {
        $image = Input::file('img');
        $filename = time() . '.' . $image->getClientOriginalExtension();
        $path = public_path('logo/' . $filename);
        Image::make($image->getRealPath())->fit(303, 200)->save($path);
        $file = $request->file('img');
        $session = session()->get('key');
        $update_image = Business::find($session);
        $update_image->image = $path;
        $update_image->save();
        return ['url' => url('logo/' . $filename)];
    }

【问题讨论】:

  • 我猜 "logo\1496912432.jpg" 足以存储在数据库中,然后你可以像 hafiz 所说的那样使用资产(你的路径)。存储完整路径可能会在不同的环境中破坏代码。

标签: laravel laravel-5 laravel-5.4


【解决方案1】:

使用 Laravel file() 存储文件 https://laravel.com/docs/5.4/requests#files

将 $path 存储到您的数据库中

$path = $request->photo->store('logo');

$request-&gt;photo 取决于您的输入文件属性名称。在您的情况下,它应该是$request-&gt;img

上面的代码将创建一个文件夹(如果不存在),即“logo”,并以随机字符串文件名存储到该文件夹​​。

同时检查您的配置文件,位于/config/filesystem.php。默认设置为公开

使用asset函数获取公用文件夹的完整路径

<img class="images" id="image" src="{{ asset($business->image }}" />

【讨论】:

  • 看看我的控制器,我该如何修改它以使用您建议的方式?
  • @Przemek 如果您的输入文件名为“img”,请将其更改为$request-&gt;img-&gt;store('logo')。配置文件位于config/filesystem.php。默认为“public”,因此它将存储并创建“logo”文件夹
【解决方案2】:

你可以通过两种方式来做

最好的方法是在保存图片时更新 url 路径将 url 路径保存到 db

$path = $request->photo->store('logo'); // in 5.4

如果你不能改变数据库 url,你可以做一些这样的修改

$file = explode('/public/', $business->image);
echo asset($file[1]);

【讨论】:

    【解决方案3】:

    您希望将所有文件存储在 Web 根目录中。由于跨域安全性,您无法从 http 协议访问 file:// domain/protocol。通过使用 Laravel 存储和检索,它将来自同一主机。

    【讨论】:

    • 不可能。我可以从网站的其他地方回显商店中的图像。只是这个实例的不同之处在于使用了 vuejs。
    猜你喜欢
    • 2015-02-12
    • 1970-01-01
    • 2018-11-08
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2020-06-06
    • 2018-10-27
    • 2018-05-09
    相关资源
    最近更新 更多