NuxtServerError with Laravel.passport callback #505

pcasaspere · 2019-12-21T18:31:20Z

Version

v4.8.4

Reproduction link

https://codepen.io/pcasaspere/pen/mdymJxW

Steps to reproduce

Version

4.8.4

Steps to reproduce

Config nuxt.config:

auth: {
  // localStorage: false,
  redirect: {
    login: '/login',
    logout: '/login',
    home: '/',
  },
  strategies: {
    'laravel.passport': {
      url: process.env.API_BASE_URL,
      client_id: process.env.API_OAUTH_CLIENT_ID,
      client_secret: process.env.API_OAUTH_CLIENT_SECRET,
    },
  }
},

In view /login.vue add method login and call in mounted:

  methods: {
    login(){
      this.$auth.loginWith('laravel.passport');
   }

this.$auth.loginWith('laravel.passport'); redirect to my Laravel Login form.
Laravel authorize my user, and redirect to Nuxt callback route with correct code in url's query.

Nuxt call to internal http://127.0.0.1:3000/_auth/oauth/laravel.passport/authorize
Nuxt response with error 500 with this data:

{
  "error": {
    "message": "Request failed with status code 401",
    "name": "NuxtServerError",
    "frames": [
      {
        "file": "node_modules/axios/lib/core/createError.js",
        "method": "createError",
        "line": 16,
        "column": 15,
        "context": {
          "start": 11,
          "pre": " * @param {Object} [request] The request.\n * @param {Object} [response] The response.\n * @returns {Error} The created error.\n */\nmodule.exports = function createError(message, config, code, request, response) {",
          "line": "  var error = new Error(message);",
          "post": "  return enhanceError(error, config, code, request, response);\n};\n"
        },
        "lang": "js",
        "open": "/__open-in-editor?file=/home/casas/dev/fitvium-app/app/node_modules/axios/lib/core/createError.js:16:15"
      },
      {
        "file": "node_modules/axios/lib/core/settle.js",
        "method": "settle",
        "line": 17,
        "column": 12,
        "context": {
          "start": 12,
          "pre": "module.exports = function settle(resolve, reject, response) {\n  var validateStatus = response.config.validateStatus;\n  if (!validateStatus || validateStatus(response.status)) {\n    resolve(response);\n  } else {",
          "line": "    reject(createError(",
          "post": "      'Request failed with status code ' + response.status,\n      response.config,\n      null,\n      response.request,\n      response"
        },
        "lang": "js",
        "open": "/__open-in-editor?file=/home/casas/dev/fitvium-app/app/node_modules/axios/lib/core/settle.js:17:12"
      },
      {
        "file": "node_modules/axios/lib/adapters/http.js",
        "method": "IncomingMessage.handleStreamEnd",
        "line": 237,
        "column": 11,
        "context": {
          "start": 232,
          "pre": "          if (config.responseType !== 'arraybuffer') {\n            responseData = responseData.toString(config.responseEncoding);\n          }\n\n          response.data = responseData;",
          "line": "          settle(resolve, reject, response);",
          "post": "        });\n      }\n    });\n\n    // Handle errors"
        },
        "lang": "js",
        "open": "/__open-in-editor?file=/home/casas/dev/fitvium-app/app/node_modules/axios/lib/adapters/http.js:237:11"
      },
      {
        "file": "events.js",
        "method": "IncomingMessage.emit",
        "line": 203,
        "column": 15,
        "context": {},
        "lang": "js"
      },
      {
        "file": "domain.js",
        "method": "IncomingMessage.EventEmitter.emit",
        "line": 448,
        "column": 20,
        "context": {},
        "lang": "js"
      },
      {
        "file": "_stream_readable.js",
        "method": "endReadableNT",
        "line": 1143,
        "column": 12,
        "context": {},
        "lang": "js"
      },
      {
        "file": "internal/process/next_tick.js",
        "method": "process._tickCallback",
        "line": 63,
        "column": 19,
        "context": {},
        "lang": "js"
      }
    ]
  },
  "hasInternal": true
}

_{This bug report is available on Nuxt community (#c462)}

The text was updated successfully, but these errors were encountered:

MilesWuCode · 2020-03-05T06:36:24Z

Me too!!
why post to :
http://localhost:3000/_auth/oauth/laravel.passport/authorize

{
  "error": {
    "message": "unable to verify the first certificate",
    "name": "NuxtServerError",
    "frames": [
      {
        "file": "_tls_wrap.js",
        "method": "TLSSocket.onConnectSecure",
        "line": 1475,
        "column": 34,
        "context": {},
        "lang": "js"
      },
      {
        "file": "events.js",
        "method": "TLSSocket.emit",
        "line": 321,
        "column": 20,
        "context": {},
        "lang": "js"
      },
      {
        "file": "domain.js",
        "method": "TLSSocket.EventEmitter.emit",
        "line": 485,
        "column": 12,
        "context": {},
        "lang": "js"
      },
      {
        "file": "_tls_wrap.js",
        "method": "TLSSocket._finishInit",
        "line": 918,
        "column": 8,
        "context": {},
        "lang": "js"
      },
      {
        "file": "_tls_wrap.js",
        "method": "TLSWrap.ssl.onhandshakedone",
        "line": 688,
        "column": 12,
        "context": {},
        "lang": "js"
      }
    ]
  },
  "hasInternal": false
}

gilles6 · 2020-04-07T18:32:17Z

I have the same problem, anyone has a solution to fix it ?

I'm using Laravel 7.3 with Passport and Nuxt in SPA mode.

{
  "error": {
    "message": "Request failed with status code 401",
    "name": "NuxtServerError",
    "frames": [
      {
        "file": "node_modules/axios/lib/core/createError.js",
        "method": "createError",
        "line": 16,
        "column": 15,
        "context": {
          "start": 11,
          "pre": " * @param {Object} [request] The request.\n * @param {Object} [response] The response.\n * @returns {Error} The created error.\n */\nmodule.exports = function createError(message, config, code, request, response) {",
          "line": "  var error = new Error(message);",
          "post": "  return enhanceError(error, config, code, request, response);\n};\n"
        },
        "lang": "js",
        "open": "/__open-in-editor?file=/Users/me/code/nuxt-spa/node_modules/axios/lib/core/createError.js:16:15"
      },
      {
        "file": "node_modules/axios/lib/core/settle.js",
        "method": "settle",
        "line": 17,
        "column": 12,
        "context": {
          "start": 12,
          "pre": "module.exports = function settle(resolve, reject, response) {\n  var validateStatus = response.config.validateStatus;\n  if (!validateStatus || validateStatus(response.status)) {\n    resolve(response);\n  } else {",
          "line": "    reject(createError(",
          "post": "      'Request failed with status code ' + response.status,\n      response.config,\n      null,\n      response.request,\n      response"
        },
        "lang": "js",
        "open": "/__open-in-editor?file=/Users/me/code/nuxt-spa/node_modules/axios/lib/core/settle.js:17:12"
      },
      {
        "file": "node_modules/axios/lib/adapters/http.js",
        "method": "IncomingMessage.handleStreamEnd",
        "line": 236,
        "column": 11,
        "context": {
          "start": 231,
          "pre": "          if (config.responseType !== 'arraybuffer') {\n            responseData = responseData.toString(config.responseEncoding);\n          }\n\n          response.data = responseData;",
          "line": "          settle(resolve, reject, response);",
          "post": "        });\n      }\n    });\n\n    // Handle errors"
        },
        "lang": "js",
        "open": "/__open-in-editor?file=/Users/me/code/nuxt-spa/node_modules/axios/lib/adapters/http.js:236:11"
      },
      {
        "file": "events.js",
        "method": "IncomingMessage.emit",
        "line": 215,
        "column": 7,
        "context": {},
        "lang": "js"
      },
      {
        "file": "domain.js",
        "method": "IncomingMessage.EventEmitter.emit",
        "line": 476,
        "column": 20,
        "context": {},
        "lang": "js"
      },
      {
        "file": "_stream_readable.js",
        "method": "endReadableNT",
        "line": 1183,
        "column": 12,
        "context": {},
        "lang": "js"
      },
      {
        "file": "internal/process/task_queues.js",
        "method": "processTicksAndRejections",
        "line": 80,
        "column": 21,
        "context": {},
        "lang": "js"
      }
    ]
  },
  "hasInternal": true
}

JoaoPedroAS51 · 2020-04-13T19:25:43Z

Hi @devondahon! I made some tests using Laravel Passport and this error means that Laravel couldn't issue the token. The error message is invalid_credentials.

Are you using the client generated by passport:install? Because it generates a Personal Access Client and a Password Grant Client, and both are not correct for this flow.

You should run passport:client instead, to generate a normal client. You can check the client in your database and make sure that both values (Personal and Password) are disabled :)

gilles6 · 2020-04-16T20:18:45Z

If I do that, I get the following error in Laravel right after logging in:

{
  "error":"invalid_client",
  "error_description":"Client authentication failed",
  "message":"Client authentication failed"
}

➜  backend $ php artisan passport:client

 Which user ID should the client be assigned to?:
 > my-client-id

 What should we name the client?:
 > my-client-name

 Where should we redirect the request after authorization? [http://localhost/auth/callback]:
 > http://localhost:3000/auth/callback                                       

New client created successfully.
Client ID: 8
Client secret: H0SOYOKN9IrRs786hk4xS6p6tYOjUJZTFsOzc4GZ
➜  backend $

nuxt.config.js:

auth: {
  // redirect: {
  //   login: '/login',
  //   logout: '/login',
  //   home: '/'
  // },
  strategies: {
    'laravel.passport': {
      url: 'http://backend.test',
      client_id: 8,
      client_secret: 'H0SOYOKN9IrRs786hk4xS6p6tYOjUJZTFsOzc4GZ',
      userinfo_endpoint: 'http://backend.test/api/user'
    }
  }
}

JoaoPedroAS51 · 2020-04-16T20:29:44Z

Hi @devondahon! If I'm not wrong, this error is because your callback route is not matching. I see that you set callback to http://localhost:3000/auth/callback. Then add:

auth: {
  redirect: {
    callback: '/auth/callback'
  }
}

gilles6 · 2020-04-16T20:33:28Z

Thanks a lot ! It works :D

JoaoPedroAS51 · 2020-04-16T20:35:07Z

I'm so happy to know it worked!! 😃

gilles6 · 2020-04-16T20:37:41Z

If I want to make any other request to this backend, I just need to send the token in the Bearer or is there a safer way to make a request ?

Also, is it using CORS ? Should I pass CORS stuffs in the request as well ?

JoaoPedroAS51 · 2020-04-16T22:24:06Z

The access token is automatically added to your $axios instance after a successful login. So any request made using $axios will have the authorization header.

And yes, it is using CORS. But you just need to configure cors.php config in your Laravel application. Allow your origin, methods and paths...

JoaoPedroAS51 · 2020-04-16T22:28:06Z

Note: Refresh tokens aren't supported yet. We are working on this feature in dev branch. So if you need to refresh tokens, then add "@nuxtjs/auth": "nuxt-community/auth-module#dev" to your package.json.

You can see the new docs at https://dev.auth.nuxtjs.org/

gilles6 · 2020-04-17T09:06:01Z

Great! Thank you very much!!

gilles6 · 2020-05-25T20:31:27Z

@JoaoPedroAS51
I have multiple Nuxt websites like foo.com and bar.com, they all have their own database with users table in a Laravel backend.
My guards and providers are configured as below in Laravel config/auth.php:

    'guards' => [
        'web' => [
            'driver' => 'session',
            'provider' => 'users',
        ],
        'api' => [
            'driver' => 'passport',
            'provider' => 'users'
        ],
        'foo' => [
            'driver' => 'passport',
            'provider' => 'foo_users'
        ],
        'bar' => [
            'driver' => 'passport',
            'provider' => 'bar_users'
        ],
    ],
    'providers' => [
        'users' => [
            'driver' => 'eloquent',
            'model' => App\Models\Backend\User::class,
        ],
        'foo_users' => [
            'driver' => 'eloquent',
            'model' => App\Models\Foo\User::class,
        ],
        'bar_users' => [
            'driver' => 'eloquent',
            'model' => App\Models\Bar\User::class,
        ]
    ],

How to set Nuxt authentication and Laravel settings to use foo guard with foo.com and bar guard with bar.com ?

gilles6 · 2020-05-27T09:04:55Z

Actually, what I would need is to use a password grant token, but I've read on stackoverflow that it's insecure.

There's use case on dev.to but the author doesn't use Nuxt Auth module because he think it's not flexible enough.

@JoaoPedroAS51
Is it possible to use Nuxt Auth with Laravel Passport Password Grant Tokens in a secure way ? And if yes, how should I configure nuxt.config.js ?

mviljoen · 2020-07-23T11:11:00Z

My problem is that I get a 404 with http://127.0.0.1:3000/_auth/oauth/laravel.passport/authorize.

This only happens after deploying with npm run build. It works perfectly with npm run dev.

Any help would be appreciated.

gilles6 · 2020-07-24T07:49:12Z

@JoaoPedroAS51
I finally found my answer here. I need to wait for Laravel Passport to get some new feature.

JoaoPedroAS51 · 2020-12-18T05:18:58Z

Closing here, as this is an old issue and has already been answered.

tiggidoo · 2021-02-24T19:08:54Z

the problem still there ,"Method Illuminate\Auth\RequestGuard::attempt does not exist. if use session the api token does not work

truesteps · 2022-10-05T08:37:29Z

My problem is that I get a 404 with http://127.0.0.1:3000/_auth/oauth/laravel.passport/authorize.

This only happens after deploying with npm run build. It works perfectly with npm run dev.

Any help would be appreciated.

did you find any solution to this issue? @mviljoen

ghost added the cmty:bug-report label Dec 21, 2019

gilles6 mentioned this issue Apr 28, 2020

unsupported_grant_type with laravel.passport strategy #590

Closed

JoaoPedroAS51 closed this as completed Dec 18, 2020

bmulholland added bug and removed cmty:bug-report labels Jan 17, 2021

Provide feedback

Saved searches

Use saved searches to filter your results more quickly

NuxtServerError with Laravel.passport callback #505

NuxtServerError with Laravel.passport callback #505

pcasaspere commented Dec 21, 2019

MilesWuCode commented Mar 5, 2020 •

edited

Loading

gilles6 commented Apr 7, 2020

JoaoPedroAS51 commented Apr 13, 2020

gilles6 commented Apr 16, 2020 •

edited

Loading

JoaoPedroAS51 commented Apr 16, 2020

gilles6 commented Apr 16, 2020

JoaoPedroAS51 commented Apr 16, 2020

gilles6 commented Apr 16, 2020

JoaoPedroAS51 commented Apr 16, 2020

JoaoPedroAS51 commented Apr 16, 2020

gilles6 commented Apr 17, 2020

gilles6 commented May 25, 2020

gilles6 commented May 27, 2020 •

edited

Loading

mviljoen commented Jul 23, 2020

gilles6 commented Jul 24, 2020

JoaoPedroAS51 commented Dec 18, 2020

tiggidoo commented Feb 24, 2021

truesteps commented Oct 5, 2022

NuxtServerError with Laravel.passport callback #505

NuxtServerError with Laravel.passport callback #505

Comments

pcasaspere commented Dec 21, 2019

Version

Reproduction link

Steps to reproduce

Version

Steps to reproduce

MilesWuCode commented Mar 5, 2020 • edited Loading

gilles6 commented Apr 7, 2020

JoaoPedroAS51 commented Apr 13, 2020

gilles6 commented Apr 16, 2020 • edited Loading

JoaoPedroAS51 commented Apr 16, 2020

gilles6 commented Apr 16, 2020

JoaoPedroAS51 commented Apr 16, 2020

gilles6 commented Apr 16, 2020

JoaoPedroAS51 commented Apr 16, 2020

JoaoPedroAS51 commented Apr 16, 2020

gilles6 commented Apr 17, 2020

gilles6 commented May 25, 2020

gilles6 commented May 27, 2020 • edited Loading

mviljoen commented Jul 23, 2020

gilles6 commented Jul 24, 2020

JoaoPedroAS51 commented Dec 18, 2020

tiggidoo commented Feb 24, 2021

truesteps commented Oct 5, 2022

MilesWuCode commented Mar 5, 2020 •

edited

Loading

gilles6 commented Apr 16, 2020 •

edited

Loading

gilles6 commented May 27, 2020 •

edited

Loading