我正在尝试通过护照使用下一个身份验证前端和laravel后端API来制作Web应用程序。注册功能和验证工作正常，但是每次出现错误400时登录功能都会返回，错误的请求和验证也无法正常工作。
我正在使用最新的laravel，并且在每个项目的本地创建的宅基上设置了下一个版本和服务器。我也不知道这有帮助，但是如果是的话，我的操作系统是mac os x。
下面我显示了
中的一些代码-Nuxt（nuxt.config.js，login.vue，register.vue） -Laravel（AuthController.php，api.php，services.php，.env）
如果有人也可以帮助使登录功能正常工作和验证，或者需要更多信息，请写信。
提前谢谢！
nuxt.config.js
import pkg from './package'
export default {
mode: 'universal',
/*
** Headers of the page
*/
head: {
title: pkg.name,
meta: [
{ charset: 'utf-8' },
{ name: 'viewport', content: 'width=device-width, initial-scale=1' },
{ hid: 'description', name: 'description', content: pkg.description }
],
link: [
{ rel: 'icon', type: 'image/x-icon', href: '/favicon.ico' }
]
},
/*
** Customize the progress-bar color
*/
loading: { color: '#fff' },
router: {
middleware: [
'clearValidationErrors'
]
},
/*
** Global CSS
*/
css: [
],
/*
** Plugins to load before mounting the App
*/
plugins: [
'@/plugins/mixins/validation',
'@/plugins/axios',
],
auth: {
strategies: {
local: {
endpoints: {
login: {
url: 'login',
method: 'post'
propertyName: 'token'
},
user: {
url: 'user',
method: 'get',
propertyName: 'data'
},
logout: {
url: 'logout',
method: 'post'
}
}
}
},
redirect: {
login: 'login',
home: '/'
}
},
/*
** Nuxt.js modules
*/
modules: [
// Doc: https://bootstrap-vue.js.org/docs/
'bootstrap-vue/nuxt',
'@nuxtjs/axios',
'@nuxtjs/auth'
],
axios: {
baseURL: 'http://homestead.test/api'
},
/*
** Build configuration
*/
build: {
/*
** You can extend webpack config here
*/
extractCSS: true,
extend(config, ctx) {
}
}
}
login.vue
<template lang="html">
<div class="container">
<div class="col-md-6 offset-md-3">
<div class="card mt-4">
<div class="card-header">
<h1>Login</h1>
</div>
<div class="card-body">
<form @submit.prevent="login">
<div class="form-group">
<label>Email</label>
<input v-model="form.email" type="email" class="form-control" :class="{'is-invalid' : errors.email}" placeholder="email">
<div class="invalid-feedback" v-if="errors.email">{{ errors.email[0] }}</div>
</div>
<div class="form-group">
<label>password</label>
<input v-model="form.password" type="password" class="form-control" :class="{'is-invalid' : errors.password}" placeholder="password">
<div class="invalid-feedback" v-if="errors.password">{{ errors.password[0] }}</div>
</div>
<div class="form-group">
<input type="submit" class="btn btn-outline-primary form-control mt-4" value="Login">
</div>
</form>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
form: {
email: '',
password: ''
}
}
},
methods: {
async login() {
try {
await this.$auth.login({ data: this.form});
this.$router.push({ name: 'index' });
} catch(e) {
return;
}
}
}
}
</script>
<style lang="css" scoped>
</style>
register.vue
<template lang="html">
<div class="container">
<div class="col-md-6 offset-md-3">
<div class="card mt-4">
<div class="card-header">
<h1>Register</h1>
</div>
<div class="card-body">
<form @submit.prevent="register">
<div class="form-group">
<label>name</label>
<input v-model="form.name" type="text" class="form-control" :class="{'is-invalid' : errors.name}" placeholder="name">
<div class="invalid-feedback" v-if="errors.name">{{ errors.name[0] }}</div>
</div>
<div class="form-group">
<label>Email</label>
<input v-model="form.email" type="email" class="form-control" :class="{'is-invalid' : errors.email}" placeholder="email">
<div class="invalid-feedback" v-if="errors.email">{{ errors.email[0] }}</div>
</div>
<div class="form-group">
<label>password</label>
<input v-model="form.password" type="password" class="form-control" :class="{'is-invalid' : errors.password}" placeholder="password">
<div class="invalid-feedback" v-if="errors.password">{{ errors.password[0] }}</div>
</div>
<div class="form-group">
<input type="submit" class="btn btn-outline-primary form-control mt-4" value="Register">
</div>
</form>
</div>
</div>
</div>
</div>
</template>
<script>
export default {
data() {
return {
form: {
name: '',
email: '',
password: ''
}
}
},
methods: {
async register() {
try {
await this.$axios.post('/register', this.form);
this.$auth.login({data: this.form});
this.$router.push({name: 'index'})
} catch(e) {
return;
}
}
}
}
</script>
<style lang="css" scoped>
</style>
AuthController
<?php
namespace App\Http\Controllers;
use App\User;
use Illuminate\Http\Request;
use Illuminate\Support\Facades\Hash;
class AuthController extends Controller
{
public function login(Request $request)
{
$http = new \GuzzleHttp\Client;
try {
$response = $http->post(config('services.passport.login_endpoint'), [
'form_params' => [
'grant_type' => 'password',
'client_id' => config('services.passport.client_id'),
'client_secret' => config('services.passport.client_secret'),
'username' => $request->username,
'password' => $request->password,
]
]);
return $response->getBody();
} catch (\GuzzleHttp\Exception\BadResponseException $e) {
if ($e->getCode() === 400) {
return response()->json('Invalid Request. Please enter a username or a password.', $e->getCode());
} else if ($e->getCode() === 401) {
return response()->json('Your credentials are incorrect. Please try again', $e->getCode());
}
return response()->json('Something went wrong on the server.', $e->getCode());
}
}
public function register(Request $request)
{
$request->validate([
'name' => 'required|string|max:255',
'email' => 'required|string|email|max:255|unique:users',
'password' => 'required|string|min:6',
]);
return User::create([
'name' => $request->name,
'email' => $request->email,
'password' => Hash::make($request->password),
]);
}
public function logout()
{
auth()->user()->tokens->each(function ($token, $key) {
$token->delete();
});
return response()->json('Logged out successfully', 200);
}
}
api.php
<?php
use Illuminate\Http\Request;
/*
|--------------------------------------------------------------------------
| API Routes
|--------------------------------------------------------------------------
|
| Here is where you can register API routes for your application. These
| routes are loaded by the RouteServiceProvider within a group which
| is assigned the "api" middleware group. Enjoy building your API!
|
*/
Route::middleware('auth:api')->get('/user', function (Request $request) {
return $request->user();
});
Route::post('/login', 'AuthController@login');
Route::post('/register', 'AuthController@register');
Route::middleware('auth:api')->post('/logout', 'AuthController@logout');
services.php
'stripe' => [
'model' => App\User::class,
'key' => env('STRIPE_KEY'),
'secret' => env('STRIPE_SECRET'),
'webhook' => [
'secret' => env('STRIPE_WEBHOOK_SECRET'),
'tolerance' => env('STRIPE_WEBHOOK_TOLERANCE', 300),
],
],
'passport' => [
'login_endpoint' => env('PASSPORT_LOGIN_ENDPOINT'),
'client_id' => env('PASSPORT_CLIENT_ID'),
'client_secret' => env('PASSPORT_CLIENT_SECRET'),
],
.env
PASSPORT_LOGIN_ENDPOINT="http://homestead.test/oauth/token"
PASSPORT_CLIENT_ID=2
PASSPORT_CLIENT_SECRET=BBKmmsWAlv3qhm2Hk7d0RFOJTn4Bv2inX0gWe3cV