【发布时间】:2019-12-19 13:26:50
【问题描述】:
我正在按照本教程https://appdividend.com/2018/03/23/react-js-laravel-file-upload-tutorial/ 将图像文件路径存储在 MySQL DB 中。
在我的 axios 发布请求中,URL 是一个虚拟的。如何找出我的数据库的 URL 是什么?我似乎在任何地方都找不到它。如果这很重要,我正在使用 MySQL 工作台。
import React, { Component } from 'react';
import axios, { post } from 'axios';
class Wall extends Component {
constructor(props) {
super(props);
this.state = {
image: ''
};
this.onFormSubmit = this.onFormSubmit.bind(this);
this.onChange = this.onChange.bind(this);
this.fileUpload = this.fileUpload.bind(this);
}
onFormSubmit(e) {
e.preventDefault();
this.fileUpload(this.state.image);
}
onChange(e) {
let files = e.target.files || e.dataTransfer.files;
if(!files.length) {
return;
}
this.createImage(files[0]);
}
createImage(file) {
let reader = new FileReader();
reader.onload = (e) => {
this.setState({
image: e.target.result
});
};
reader.readAsDataURL(file);
}
fileUpload(image){
const url = 'http://localhost:8000/api/fileupload';
const formData = {file: this.state.image};
return axios.post(url, formData)
.then(response => console.log(response));
}
render() {
return (
<div>
<h1>File Upload</h1>
<input type="file" />
<button type="submit">Upload</button>
</div>
);
}
}
export default Wall;
这是我的 FileUploadController.php 文件:
<?php
namespace App\Http\Controllers;
use Illuminate\Http\Request;
class FileuploadController extends Controller
{
/**
* Display a listing of the resource.
*
* @return \Illuminate\Http\Response
*/
public function index()
{
//
}
/**
* Show the form for creating a new resource.
*
* @return \Illuminate\Http\Response
*/
public function create()
{
//
}
/**
* Store a newly created resource in storage.
*
* @param \Illuminate\Http\Request $request
* @return \Illuminate\Http\Response
*/
public function store(Request $request)
{
if($request->get('file'))
{
$image = $request->get('file');
$name = time().'.' . explode('/', explode(':', substr($image, 0, strpos($image, ';')))[1])[1];
\Image::make($request->get('file'))->save(public_path('images/').$name);
}
$fileupload = new Fileupload();
$fileupload->filename=$name;
$fileupload->save();
return response()->json('Successfully added');
}
/**
* Display the specified resource.
*
* @param int $id
* @return \Illuminate\Http\Response
*/
public function show($id)
{
//
}
/**
* Show the form for editing the specified resource.
*
* @param int $id
* @return \Illuminate\Http\Response
*/
public function edit($id)
{
//
}
/**
* Update the specified resource in storage.
*
* @param \Illuminate\Http\Request $request
* @param int $id
* @return \Illuminate\Http\Response
*/
public function update(Request $request, $id)
{
//
}
/**
* Remove the specified resource from storage.
*
* @param int $id
* @return \Illuminate\Http\Response
*/
public function destroy($id)
{
//
}
}
【问题讨论】:
-
你需要从你的服务器端代码访问db
-
在您的终端输入
php artisan route:list这样您就可以看到您的应用程序中注册了哪些路由 -
@charlietfl 刚刚发布了我的服务器端代码
标签: javascript php reactjs laravel debugging