Laravel使用授权的移动的和浏览器的REST API源代码

14ifxucb 于 2023-03-09 发布在其他

关注(0)|答案(1)|浏览(131)

我有一个rest API，根据用户是否被授权，发布不同的产品/api/products，这个api是针对一个移动的应用的，我通过一个带有Sanctum的承载令牌来进行授权，处理任何用户的请求，根据有没有令牌来显示商品。
我的API定制中间件

public function handle(Request $request, Closure $next): Response
    {
        if ( $request->bearerToken() && Auth::guard('sanctum')->user() )
            Auth::setUser( Auth::guard('sanctum')->user() );

        return $next($request);
    }

接下来，它不仅需要API，而且需要一个将使用这个api的网站，这是一个移动的应用程序。决定使用通常的php方法使用vue组件。它的Breeze & Blade与Fortify和Vue。据我所知，如果用户通过网站授权，授权的cookie会来到他身边，他们必须应用于 AJAX 请求。
我的axios请求从vue组件发送到/api/products。如果用户通过网站获得授权，则应用并发送cookie

const instance = axios.create({
    timeout: 2000,
   
    //My cookie included
    withCredentials: true,

    headers: {
      'Access-Control-Allow-Origin': '*',
      'Content-Type': 'application/json',
      'Access-Control-Allow-Credentials' : true
       },

    //With token works. Middleware understands that the user is authorized
    //headers: {'Authorization': 'Bearer '+'1|XedL48l1TU5KomRxix6xFrsm0v7jw5eTbHzfpoGC'}
  });

  instance
      .post("/api/products",
          {
            data: example_data,

          }, )
      .then(response => {
        console.log(response.data)
      });

问题是中间件不理解axios请求附带的cookie。中间件不能通过请求附带的cookie判断我是否被授权。它只理解报头中的令牌，它使用令牌工作。文档说Sanctum中间件理解请求附带的cookie。但我不使用中间件，是否可以实现它，这样授权用户的cookie就可以被我的定制中间件理解，而不仅仅是令牌？

laravel

来源：https://stackoverflow.com/questions/75632784/laravel-using-rest-api-source-for-both-mobile-and-browser-with-authorization

1条答案

按热度按时间

cwtwac6a1#

我是回答你第一个问题的人。
当从已经通过会话进行身份验证的前端发出请求时，您不需要传递类似的内容。
您所需要做的就是确保使用resources/js/bootstrap.js下的凭证设置axios

import axios from 'axios'
window.axios = axios

window.axios.defaults.withCredentials = true
window.axios.defaults.headers.common['X-Requested-With'] = 'XMLHttpRequest'

然后，您可以简单地从vue模板调用端点，中间件将能够识别是否经过身份验证的请求

<script setup>
import { onMounted } from 'vue'

async function getProducts() {
    try {
        const { data } = await axios.get(`/api/products`)
        console.log( data )
    } catch (error) {
        console.log( error.response.message ?? error.message )
    }
}

onMounted( () => {
    getProducts()
})

</script>

附带说明一下，如果通过API令牌进行身份验证，请确保在头请求中传递Accept: application/json

- 编辑**

您的app/Http/Kernel.php应该在$middlewareGroups中包含以下行

protected $middlewareGroups = [
    'web' => [
        .
        .
        .
    ],

    'api' => [
        \Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
        'throttle:api',
        \Illuminate\Routing\Middleware\SubstituteBindings::class,
    ],
];

赞(0）回复(0）举报 2023-03-09

我来回答

Laravel使用授权的移动的和浏览器的REST API源代码

1条答案

相关问题

热门标签

最新问答