Laravel 为 Nuxt JS 前端生成签名路由答案

【问题标题】：Laravel generate signed route for Nuxt JS front-endLaravel 为 Nuxt JS 前端生成签名路由
【发布时间】：2023-02-17 00:13:30
【问题描述】：

我将 Laravel 用作我的 Nuxt JS 前端项目的 API。我的前端有这样的 URL 结构：

http://localhost:3000/onboarding/
http://localhost:3000/onboarding/{signature}/company/
http://localhost:3000/

当用户登陆我的索引入职页面时，他们单击一个按钮，然后我向我的 Laravel 函数发出发布请求以生成签名路由。然后我需要将用户重定向到公司页面，并检查签名哈希是否有效，如果有效，则允许用户继续，最终他们也会出现在用户页面上。

问题是我的函数完全基于我的后端 API 而不是我的前端路由生成签名，我该如何解决这个问题或者只是提取签名部分并验证它？

/**
 * Store a newly created resource in storage.
 */
public function store(Request $request)
{
    $signature = URL::signedRoute('onboarding.show', ['is_new_journey' => true]);

    return new ApiSuccessResponse($signature, [
        'message' => 'Onboarding process started.'
    ], 201);
}

【问题讨论】：

标签： php laravel nuxt.js

【解决方案1】：

由于签名是根据 Laravel API 的路由生成的，您可以在前端使用 window.location.href 属性从 URL 中获取签名，然后将其作为参数传递到 API 请求中以验证签名后端。

在您的 Nuxt JS 前端中，您可以通过使用正则表达式从 URL 中提取签名来检索签名。这是一个例子：

// Get the current URL
const currentUrl = window.location.href;

// Extract the signature from the URL using regex
const signatureMatch = currentUrl.match(//onboarding/(.+)/company/);
const signature = signatureMatch ? signatureMatch[1] : null;

// Make an API request to validate the signature on the backend

【讨论】：