Laravel React MySQL 路由问题
Laravel React MySQL Routing Issue
我正在努力做到这一点,以便我可以注册一个用户,但我收到了 404 错误,假设这意味着反应无法找到由 api.php 文件建立的路由,有没有什么否则我失踪了?我已经在代理设置为 "localhost:8000" 的 package.json 文件中进行了设置(我选择用于 laravel 后端内容的端口)。我很困惑为什么它在提交时没有达到这条路线。我觉得我很接近,但我是使用 php 作为后端的新手,所以任何见解都会有所帮助。
我也在创建一些用户可以在应用程序上播放音乐的东西,所以有一条标记为 "shop" 的路线,但由于我没有设置的唯一原因,它不起作用那条路线向上(也给出了 404 错误)。
下面是我的 api 路线,我试图让它们做出反应以检测
<?php
Route::post('register','UserController@register');
Route::post('login','UserController@login');
Route::post('profile','UserController@getAuthenticatedUser');
Route::middleware('auth:api')->get('/user', function(Request $request){
return $request->user();
});
?>
这是我注册文件的 React 部分。
import React, { Component } from 'react';
import { register } from './UserFunctions';
class Register extends Component {
constructor() {
super()
this.state = {
first_name: '',
last_name: '',
email: '',
password: '',
errors: {},
}
this.onChange = this.onChange.bind(this)
this.onSubmit = this.onSubmit.bind(this)
}
onChange(e) {
this.setState({ [e.target.name]: e.target.value })
}
onSubmit(e) {
e.preventDefault()
const newUser = {
name: this.state.first_name + ' ' + this.state.last_name,
email: this.state.email,
password: this.state.password
}
register(newUser).then(res => {
if (res) {
this.props.history.push('/login')
}
})
}
render() {
return (
<div className="container">
<div className="row">
<div className="col-md-6 mt-5 mx auto">
<form noValidate onSubmit={this.onSubmit}>
<h1 className="h3 mb-3 font-wieght-normal">
Register
</h1>
<div className="form-group">
<label htmlFor="first_name">First Name</label>
<input type="text" className="form-control" name="first_name" placeholder="Enter First Name" value={this.state.first_name} onChange={this.onChange} />
<label htmlFor="last_name">Last Name</label>
<input type="text" className="form-control" name="last_name" placeholder="Enter Last Name" value={this.state.last_name} onChange={this.onChange} />
<label htmlFor="email">Email Address</label><br />
<input type="email" className="form-control" name="email" placeholder="Enter Email" value={this.state.email} onChange={this.onChange} />
<br />
<label htmlFor="password">Desired Password</label><br />
<input type="password" className="form-control" name="password" placeholder="Enter Password" value={this.state.password} onChange={this.onChange} />
</div>
<button type="submit" className="btn btn-lg btn-primary btn-block">Register</button>
</form>
</div>
</div>
</div>
)
}
}
export default Register
我定义了那些 post 路线,但是当我在我的注册表单中按提交时,我收到 404 错误,说它找不到这条路线。
你能给我看看你的
import { register } from './UserFunctions';
文件,以便我可以看到定义的 url 路径。
假设这条路线在您的 routes/api 内。php
Route::group(['middleware' => 'api', 'prefix' => 'v1'], function(){
Route::post('register', 'RegisterController@index');
});
在 JS 文件中
import axios from 'axios'
export const register = newUser => {
return axios
.post('api/v1/register', newUser,
{
headers: { 'Content-Type': 'application/json' }
})
.then(res => {
console.log(res)
})
.catch(err => {
console.log(err)
})
}
我正在努力做到这一点,以便我可以注册一个用户,但我收到了 404 错误,假设这意味着反应无法找到由 api.php 文件建立的路由,有没有什么否则我失踪了?我已经在代理设置为 "localhost:8000" 的 package.json 文件中进行了设置(我选择用于 laravel 后端内容的端口)。我很困惑为什么它在提交时没有达到这条路线。我觉得我很接近,但我是使用 php 作为后端的新手,所以任何见解都会有所帮助。
我也在创建一些用户可以在应用程序上播放音乐的东西,所以有一条标记为 "shop" 的路线,但由于我没有设置的唯一原因,它不起作用那条路线向上(也给出了 404 错误)。
下面是我的 api 路线,我试图让它们做出反应以检测
<?php
Route::post('register','UserController@register');
Route::post('login','UserController@login');
Route::post('profile','UserController@getAuthenticatedUser');
Route::middleware('auth:api')->get('/user', function(Request $request){
return $request->user();
});
?>
这是我注册文件的 React 部分。
import React, { Component } from 'react';
import { register } from './UserFunctions';
class Register extends Component {
constructor() {
super()
this.state = {
first_name: '',
last_name: '',
email: '',
password: '',
errors: {},
}
this.onChange = this.onChange.bind(this)
this.onSubmit = this.onSubmit.bind(this)
}
onChange(e) {
this.setState({ [e.target.name]: e.target.value })
}
onSubmit(e) {
e.preventDefault()
const newUser = {
name: this.state.first_name + ' ' + this.state.last_name,
email: this.state.email,
password: this.state.password
}
register(newUser).then(res => {
if (res) {
this.props.history.push('/login')
}
})
}
render() {
return (
<div className="container">
<div className="row">
<div className="col-md-6 mt-5 mx auto">
<form noValidate onSubmit={this.onSubmit}>
<h1 className="h3 mb-3 font-wieght-normal">
Register
</h1>
<div className="form-group">
<label htmlFor="first_name">First Name</label>
<input type="text" className="form-control" name="first_name" placeholder="Enter First Name" value={this.state.first_name} onChange={this.onChange} />
<label htmlFor="last_name">Last Name</label>
<input type="text" className="form-control" name="last_name" placeholder="Enter Last Name" value={this.state.last_name} onChange={this.onChange} />
<label htmlFor="email">Email Address</label><br />
<input type="email" className="form-control" name="email" placeholder="Enter Email" value={this.state.email} onChange={this.onChange} />
<br />
<label htmlFor="password">Desired Password</label><br />
<input type="password" className="form-control" name="password" placeholder="Enter Password" value={this.state.password} onChange={this.onChange} />
</div>
<button type="submit" className="btn btn-lg btn-primary btn-block">Register</button>
</form>
</div>
</div>
</div>
)
}
}
export default Register
我定义了那些 post 路线,但是当我在我的注册表单中按提交时,我收到 404 错误,说它找不到这条路线。
你能给我看看你的
import { register } from './UserFunctions';
文件,以便我可以看到定义的 url 路径。
假设这条路线在您的 routes/api 内。php
Route::group(['middleware' => 'api', 'prefix' => 'v1'], function(){
Route::post('register', 'RegisterController@index');
});
在 JS 文件中
import axios from 'axios'
export const register = newUser => {
return axios
.post('api/v1/register', newUser,
{
headers: { 'Content-Type': 'application/json' }
})
.then(res => {
console.log(res)
})
.catch(err => {
console.log(err)
})
}