Laravel Websanova/Vue-Auth Login/寄存器返回未定义的URL

Question

因此，我正在学习如何使用Laravel & Vue.js创建单个页面应用程序，我找到了这个教程。我跟踪一切，我没有改变任何东西，但是每当我登录/注册的时候，我都会得到这个未定义的

我已经检查过所有的东西了。

显示http://127.0.0.1:8080/undefined/api/auth/login - https://imgur.com/LfpiMvS的图像

下面是代码：

Auth.js

import bearer from '@websanova/vue-auth/drivers/auth/bearer'
import axios from '@websanova/vue-auth/drivers/http/axios.1.x'
import router from '@websanova/vue-auth/drivers/router/vue-router.2.x'
// Auth base configuration some of this options
// can be override in method calls
const config = {
auth: bearer,
http: axios,
router: router,
tokenDefaultName: 'recipe-lists',
tokenStore: ['localStorage'],
rolesVar: 'role',
registerData: {url: "auth/register", method: 'POST', redirect: '/login'},
loginData: {url: "auth/login", method: 'POST', redirect: '/', fetchUser: true},
logoutData: {url: "auth/logout", method: 'POST', redirect: '/', makeRequest: true},
fetchData: {url: "auth/user", method: 'GET', enabled: true},
refreshData: {url: "auth/refresh", method: 'GET', enabled: true, interval: 30}
}
export default config

api.php

Route::prefix('auth')->group(function () {
Route::post('register', 'Auth\AuthController@register');
Route::post('login', 'Auth\AuthController@login');
Route::get('refresh', 'Auth\AuthController@refresh');
Route::group(['middleware' => 'auth:api'], function(){
Route::get('user', 'Auth\AuthController@user');
Route::post('logout', 'Auth\AuthController@logout');
});
});

login.vue

<script>
export default {
data() {
return {
email: null,
password: null,
has_error: false,
isProcessing: false,
}
},
methods: {
login() {
// Get the redirect object
this.isProcessing = true
var redirect = this.$auth.redirect()
this.$auth.login({
body: {
email: this.email,
password: this.password
},
success: function() {
// Handle Redirection
const redirectTo = redirect ? redirect.from.name : this.$auth.user().role === 2 ? 'admin.dashboard' : 'dashboard'
this.$router.push('/')
},
error: function() {
this.has_error = true
},
rememberMe: true,
fetchUser: true
})
}
}
}
</script>

有人能给我解释一下这里发生了什么吗。

谢谢!

我以为这个网址是http://127.0.0.1:8080/api/auth/login

Answer 1

我在URL中的undefined部件也遇到了类似的问题。

原因是我没有在我的MIX_APP_URL Laravel配置文件中设置.env变量。${process.env.MIX_APP_URL}的工作方式是，Node可以在运行时注入环境变量，在本例中是应用程序url。

我们希望在MIX_APP_URL中使用.env的一个原因是，任何使用您的应用程序的开发人员都可以轻松地设置它，并且只修改MIX_APP_URL变量。

另一个非常重要的原因是，对于本地服务器和生产，URL的会有所不同--在这种情况下，将其更改为静态的解决方案将无法工作，并且很容易在生产环境中出错。

但是要注意的一点是，在运行NPM watch任务时，.env变量的更改不会立即应用，因此watch任务必须重新启动。

Answer 2

原来我的错误来自于我的app.js，代码是：

axios.defaults.baseURL = `${process.env.MIX_APP_URL}/api`

在我把它改成：

axios.defaults.baseURL = `http://127.0.0.1:8000/api`

它起作用了，未知的东西现在消失了。我不知道为什么第一个不起作用，但我。

Reddit用户/u/mrcat323 323帮助我在/r/vuejs中得到了答案。