I'm not sure why I'm getting null
in return when trying to test if my endpoint works.
The table name's correct but for some reason, it isn't recognizing my file. My table as has more than one column despite my code and was created with php artisan
. (I'm just trying to populate filePath
column, I'll work on others later). Below's an image for reference
If I get rid of the dd($filePath);
which's in my controller - the Postman errors returns:
Integrity constraint violation: 1048 Column 'file_path' cannot be null (SQL: insert into
photos (
file_path) values (?))
Note: My Laravel code base and React.js code base are completely separated. Anyone have an idea as to why this is happening?
Here's my frontend code:
fileSelectedHandler = event => {
this.setState({
selectedFile: event.target.files[0]
})
}
fileUploadHandler = () => {
const fd = new FormData();
fd.append('image', this.state.selectedFile, this.state.selectedFile.name);
axios.post('http://myendpoint/api/auth/wall-of-fame', fd)
.then(res => {
console.log(res);
})
}
<form action="http://myendpoint/api/auth/wall-of-fame" encType='multipart/form-data' id="login-form" className="form">
<input type="file" name="file" onChange={this.fileSelectedHandler}/>
<button onClick={this.fileUploadHandler}>Upload</button>
</form>
Here's my php controller:
public function store(Request $request){
$filePath = $request->input('file')->getClientOriginalName();
$data=array('file_path'=>$filePath);
// dd($filePath);
DB::table('photos')->insert($data);
echo "Record inserted successfully.<br/>";
echo '<a href = "/insert">Click Here</a> to go back.';
}