8wDlpd.png
8wDFp9.png
8wDEOx.png
8wDMfH.png
8wDKte.png

Laravel Sanctum 用于不同域上的 API 身份验证

Arian Segui Garcia 2月前

126 0

我正在 Laravel 中验证 API 请求,它在本地运行良好,但是当我同时部署两者(Firebase 上的 React,不同域上的 Laravel)时,API 身份验证停止工作。这...

我正在 Laravel 中验证 API 请求,并且它在本地运行良好,但是当我同时部署两者(Firebase 上的 React,不同域上的 Laravel)时,API 身份验证停止工作。

这是 app/Http/Kernel.php

protected $middlewareGroups = [
    'api' => [
        \Fruitcake\Cors\HandleCors::class,
        // \Laravel\Sanctum\Http\Middleware\EnsureFrontendRequestsAreStateful::class,
        'throttle:api',
        \Illuminate\Routing\Middleware\SubstituteBindings::class,
    ],
];

这是 config/cors.php

    'paths' => ['api/*', 'sanctum/csrf-cookie'],

    'allowed_methods' => ['*'],

    'allowed_origins' => ['http://localhost:3000', 'https://example.web.app'],

    'allowed_origins_patterns' => [],

    'allowed_headers' => ['*'],

    'exposed_headers' => [],

    'max_age' => 0,

    'supports_credentials' => true,

当我使用 axios 从 React 发出请求时出现 401 错误。

我向 ChatGPT 询问并搜索了很多,但没有用。

我想要向 Laravel 发出请求并使用不同域的 sanctum 对其进行身份验证。

///////////////// 更新 ///////////////////

我切换到 JWT 身份验证,因为 @jurandou 提到它 laravel/sanctum 不支持来自不同域的 API 授权。

帖子版权声明 1、本帖标题:Laravel Sanctum 用于不同域上的 API 身份验证
    本站网址:http://xjnalaquan.com/
2、本网站的资源部分来源于网络,如有侵权,请联系站长进行删除处理。
3、会员发帖仅代表会员个人观点,并不代表本站赞同其观点和对其真实性负责。
4、本站一律禁止以任何方式发布或转载任何违法的相关信息,访客发现请向站长举报
5、站长邮箱:yeweds@126.com 除非注明,本帖由Arian Segui Garcia在本站《api》版块原创发布, 转载请注明出处!
最新回复 (0)
  • @jurandou 不同的域名。例如:react 的 foo.web.app 和 Laravel 的 bar.com

  • 由于 Web API web.config 文件,我的网站 html 文件无法打开。我正尝试在 Plesk 上托管我的网站。我将前端 (HTML CSS JS) 文件放在 httpdocs 文件夹中,没有问题

    由于 Web API web.config 文件,我的网站 html 文件无法打开。

    我正在尝试在 Plesk 上托管我的网站。我将前端(HTML CSS JS)文件放在 httpdocs 文件夹中,打开它们没有任何问题(我可以使用 URL 打开它们:) fadaeitrading.com/Home.html 。但是后来我在 Visual Studio 中发布了我的 Web API,并将其放在同一个 httpdocs 文件夹中。现在我可以使用 URL 示例访问 Web API: fadaeitrading.com/api/Product/GetProducts (Product 是控制器名称, GetProducts 是端点)但我无法访问我获得的 html 文件 ERROR 404 。我几乎可以肯定这是因为 Web API 的 web.config 文件,但我不知道如何修复它(也许有人可以做到,当 URL 有 Web API 时, api/ Web API 可以工作)。我将在此处提供 web.config 文件的内容。

    <?xml version="1.0" encoding="utf-8"?>
    <configuration>
      <location path="." inheritInChildApplications="false">
        <system.webServer>
          <handlers>
            <add name="aspNetCore" path="*" verb="*" modules="AspNetCoreModuleV2" resourceType="Unspecified" />
          </handlers>
          <aspNetCore processPath="dotnet" arguments=".\LAV.dll" stdoutLogEnabled="false" stdoutLogFile=".\logs\stdout" hostingModel="inprocess" />
        </system.webServer>
      </location>
    </configuration>
    <!--ProjectGuid: 4447276A-7814-4EFD-B2D8-457F7A8B94B4-->
    
    
  • 据我所知,Sanctum 不允许您发出跨域请求。只能从同一域的子域发出。您必须使用另一个包(如 Passport)来实现这一点。或者使用令牌来验证您的第三方应用

  • 我找到了解决方案。我只需要更改:

    <add name="aspNetCore" path="*" verb="*" modules="AspNetCoreModuleV2" resourceType="Unspecified" />
    

    <add name="aspNetCore" path="api/*" verb="*" modules="AspNetCoreModuleV2" resourceType="Unspecified" />
    
  • 你为什么认为这是 cros 问题?据我所知,如果 laravel 不允许 cros 请求,就不会出现 http 代码 401。

  • 在具有 API 路由的域上,您必须:

    迁移,确保有 personal_access_tokens 和 users 表

    创建一个用户,使其能够创建代币

    编辑 config/cors.php :

    'paths' => [
        'api/*', 
        'sanctum/csrf-cookie',
        'http://www.domain-to-accept-requests/*',
    ],
    
    'supports_credentials' => true
    

    在 routes/api.php 中创建这些路由:( 为了举例说明)

    Route::get('tokens/create', [ApiController::class, 'createTokens'])->name('tokens.create');
    
    Route::middleware('auth:sanctum')->get('/users/{user}', function (Request $request) {
        $user = User::find($request->user);
        return response($user);
    });
    

    使用 createTokens 方法创建 ApiController

    public function createTokens()
        {
            $user = User::find(1);
            
            $token_name = 'get_api_infos_token';
    
            $user->tokens()->where('name', $token_name)->delete();
    
            $token = $user->createToken($token_name, ['infos:get']);
     
            return ['token' => $token->plainTextToken];
        }
    

    如果您想检查能力,createToken 方法的第二个参数很有用,如果感兴趣,可以 参考 sanctum doc

    在另一个域名 http://www.domain-to-accept-requests/ ,这里有一个示例 axios js

    const testApi = async () => {
            try {
                const responseToken = await axios.get('http://www.api-domain.test/api/tokens/create')
                const headers = { 'Authorization': 'Bearer ' + responseToken.data.token }
                
                const response = await axios.get('http://www.api-domain.test/api/users/1', {headers})
                console.log(response.data)
            } catch (error) {}
        }
    

    希望能帮助到你 ?

  • TL;DR我的突变定义中的一个特定参数现在配置为 String, required: true,这使其成为非空的强制字符串参数。正在将其更改为 String, required: :nullable

    TL;DR 我的突变定义中的一个特定参数现在配置为 String, required: true 使其成为非空的强制字符串参数。将其更改为被 String, required: :nullable 视为重大更改,并且可能会破坏 API 的客户端?


    我有一个使用 graphql 的 Ruby on rails 后端。这是定义的突变之一(仅仅是一个例子):

    class Mutations::UpdatePerson < Mutations::BaseMutation
      argument :id, Integer, "The person's unique identifier.", required: true
      argument :name, String, "The new name of the person.", required: true
    
      type Types::PersonType
    end
    

    此 API 的客户端可能对此变异有一个调用定义,如下所示:

    mutation change_someone($new_name: String!){
      update_person(id:118607869, name: $new_name) {
        id
        name
      }
    }
    

    我想使该 name 参数非强制性。我仍然希望突变调用要求通过其名称 ( name ) 指定变量,但也希望明确接受空值。因此允许这样做: update_person(id:118607869, name: null) ,但不允许这样做: update_person(id:118607869) .

    阅读完此处的 文档 ,我通过如下方式更改突变定义设法实现了此行为:

    class Mutations::UpdatePerson < Mutations::BaseMutation
      argument :id, Integer, "The person's unique identifier.", required: true
      argument :name, String, "The new name of the person.", required: :nullable
    
      type Types::PersonType
    end
    

    这是按预期工作的,但我的问题是 - 对于已经定义了具有参数和签名的请求的 API 使用者(如上所述),这是否有可能实际上破坏客户端代码?


    根据 graphql 规范:

    随着 GraphQL 类型系统架构不断演变,添加新类型和新字段,之前有效的请求可能会在之后变得无效。任何可能导致之前有效的请求变得无效的更改都被视为重大更改。

    我尝试使用 graphql API 游乐场进行各种声明变体,但无法使其中断(即因 \'编译\' 错误而变为红色)。在我看来,扩大可能的输入值列表不应被视为重大更改,但我只是想 100% 确定。(将满足于 99.999%)

  • 不应该。由于您所有现有的客户端都提供了非空值, name 这意味着没有客户端会 name 完全省略该变量。

    另一方面,如果你将可空参数设为不可空,那么这几乎肯定会是一个重大改变。

  • 你好,我正在尝试从 React 中现有数组创建一个新数组,但我需要减少数组中的信息。目前原始 json 数据如下所示:[{\'id\':\'1&q...

    你好,我正在尝试从 React 中现有数组创建一个新数组,但我需要减少数组中的信息。

    目前原始 json 数据如下所示:

    [{"id":"1",
    "first":"'Norm'",
    "last":"'Macdonald'",
    "student_id":"78",
    "email":"[email protected]",
    "phone":"3603603600",
    "address":"782 st",
    "postbaccalaureate":"No",
    "withdrawing":"No",
    "veterans_benefits":"No",
    "active":"Yes",
    "non_stem_majors":"None"}
    

    我使用 Axios 在 React 中创建一个数组。然后我需要创建另一个数组,如下所示:

    [
    {
    label: first + last + student_id, 
    value: id
    }
    ]
    

    对于上述数组中的每个元素。我目前正在使用 map,但它不起作用。这是我目前不起作用的想法:

    useEffect(() => {
        const temp = students.map((student) => {
          {label: student.first + ", " + student.last + " " + student.student_id, value: student.id}
        })
    

    任何帮助,将不胜感激。

返回
作者最近主题: