使用Intervention Laravel REST API检索图像

Question

我有一个对象，它有一个属性，用于存储我的laravel项目中驻留在公用文件夹中的图像的路径

if ($request->get('poster_url')) {

        $image = $request->get('poster_url');
        $filename = time() . '.' . explode('/', explode(':', substr($image, 0, strpos($image, ';')))[1])[1];
        Image::make($request->get('poster_url'))->resize(300, 300)->save(public_path('uploads/concert_pictures/') . $filename);
        $concert->poster_url = $filename;
    }

我想知道在对需要包含图像的对象列表发出get请求时应该如何发送回来。下面是我当前查询的片段，它将返回对象。响应是将在我的前端客户端中使用的json响应。

  if (isset($queryParams['search'])) {
        $searchParams = $queryParams['search'];
        $limit = 10;
        $bands = Band::with('genre', 'country')
            ->where('name', 'LIKE', "%{$searchParams}%")
            ->orderBy('created_at', 'desc')
            ->paginate($limit);

    } else {
        $bands = Band::with('genre', 'country')
            ->orderBy('created_at', 'desc')
            ->paginate($limit);
    }

角度模板

<ng-container *ngFor="let band of bands">
                <div class="col-sm-6 margin-bottom-20" (click)="navigateToBand(band.id)">
                    <div class="card-group">
                        <div class="card card-shadow">
                            <img class="card-img-top"
                                 src="{{band.image_url}}"
                                 alt="Card image cap">
                            <div class="card-img-overlay">
                                <h5 class="card-title float-right">{{band.country.name}}</h5>

                                <ng-container *ngFor="let genre of band.genre; let i = index">
                                    <p class="card-text" *ngIf="i<3">{{genre.type}}</p>
                                </ng-container>
                            </div>
                            <div class="card-body">
                                <h5 class="card-title">{{band.name}}<span
                                        class="float-right">{{band.price + 'dkk'}}</span></h5>
                                <p class="card-text">{{band.short_description | slice: 0:80 }} ...</p>
                            </div>
                        </div>
                    </div>
                </div>
            </ng-container>