php（Laravel）和vue3的接口创建及调用

当所有数据都通过一个接口调用时，可能会出现以下缺点：

1. 性能瓶颈：一个接口负责处理所有的数据请求，可能导致性能瓶颈。当数据量大或请求频繁时，接口可能无法快速响应，导致延迟和效率低下。

2. 单点故障：如果这个接口出现故障，所有的数据请求都将受到影响。系统的可用性会降低，并且可能会导致数据丢失或不一致。

3. 扩展性限制：如果所有数据都通过一个接口传输，将来可能会面临扩展性的限制。当数据量和请求量增加时，需要更多的计算资源和带宽来处理这些请求。然而，一个接口可能无法无缝地扩展以满足这些需求。

4. 安全性问题：一个接口承载着所有的数据请求，可能增加安全漏洞的风险。如果接口的安全性被破坏，所有的数据都可能受到威胁。 为了解决这些问题，可以考虑使用分布式系统或微服务架构，将数据分散到不同的接口或服务中。这样可以提高性能、可扩展性和系统的稳定性，并且将安全风险降到最低。

因为之前的需求直接在别的接口调用的，所以需要现在需要新建一个接口：

后台php的Laravel框架：

1.创建路由：

//查看刺绣图层

Route::get('sold_order/embroidery_layer',[SoldOrderController::class, 'embroideryLayer'])->name('sold_order.embroidery_layer')；

2. 创建控制器

 /**

     * 查看刺绣图层

     * @param Request $request

     * @param SoldOrder $sold_order

     * @return JsonResponse

     */

    public function embroideryLayer(SoldOrder $sold_order, Request $request)

    {

        try {

            $cx_layers = SoldOrderCxLayer::query()

                ->where('sold_order_id', $sold_order->id)

                ->get()

                ->toArray();

            $design_production_file_layer_ids = array_column($cx_layers, 'design_production_file_layer_id');

            $design_production_files_layers = DesignProductionFileLayer::query()

                ->whereIn('id', $design_production_file_layer_ids)

                ->withTrashed()

                ->get();

            return success_json_response(compact('design_production_files_layers'));

        } catch (\Throwable $th) {

            $error = $th->getMessage();

            return error_json_response(compact('error'));

        }

    }

}

3.创建模型（如果接口与数据库交互，可以创建一个模型来定义数据表和数据操作）

public function design_production_file_layer() { return $this->belongsTo('App\Models\DesignProductionFileLayer'); }  

----------------------------------------------------后台结束-----------------------------------------------------------------

 后台创建接口遇到的问题：

1.后台路由放置的位置需要token认证，不然进不去。

2. 数据库数据的查询

3.查询数据库数据时碰见软删除了

deleted_at有数据是软删除了的数据

用->withTrashed()查询

4.array_column()函数

$design_production_file_layer_ids = array_column($cx_layers, 'design_production_file_layer_id');

在xc_layer的多维数组里面取出design_production_file_layer_id的字段

这行代码的作用是从一个关联数组 $cx_layers 中提取指定键 'design_production_file_layer_id' 对应的值，并将这些值组成一个新的数组 $design_production_file_layer_ids。换句话说，它从 $cx_layers 数组中获取所有 'design_production_file_layer_id' 的值，并存储在 $design_production_file_layer_ids 数组中。

---

前台的接口调用

1.简单页面

//页面展示

     

       

         

       

       

         

       

       

         

       

     

   

2. 创建路由

传参传了两个参数，之前调数据时url的网址出现  id掉不出来为【object%20Object】这个的情况：

是应为我在后面调用网址的时候没有调用id

let data = await getEmbroideryLayer(row.id)

3.调用接口

调用到的数据

调用到data之后的数据怎么也调不到，后来发现就是名字少了一个s，所以调不到，有一丢丢粗心啦~