通过react和axios将多个图像上传到laravel存储中时出现500个内部服务器错误

时间:2019-07-26 12:46:42

标签: reactjs laravel axios intervention

每当我尝试将图像存储在laravel中时,我都会收到500个内部服务器错误

这是我的jsx:

<form onSubmit={this.handleSubmit} className={"dashboard-cards-form"} encType={"multipart/form-data"} >
      <div className={"dashboard-cards-title"}>Atvirutės</div>
      <input onChange={this.handleFileChange} type="file" className={"dashboard-cards-input"} name="dashboard-cards-input" id="dashboard-cards-input" multiple={true}/>
      <label className={"dashboard-cards-label"} htmlFor="dashboard-cards-input">Pasirink atvirutes</label>
      <input type={"submit"} value={"Įkelk"} className={"dashboard-cards-submit"}/>
</form>

这是我的handleFileChange:

handleFileChange = (e) =>{
        if (e.target.files) {
            const files = Array.from(e.target.files);

            const promises = files.map(file => {
                return (new Promise((resolve, reject) => {
                    const reader = new FileReader();
                    reader.addEventListener('load', (ev) => {
                        resolve(ev.target.result);
                    });
                    reader.addEventListener('error', reject);
                    reader.readAsDataURL(file);
                }))
            });

            Promise.all(promises).then(images => {
                this.setState({
                    imageArray: images
                })
            }, error => { console.error(error); });
        }
    };

这是我的handleSubmit:

async handleSubmit (e){
        e.preventDefault();
        var self = this;
        var cookie = new Cookie();
        const formData = new FormData();
        this.state.imageArray.forEach((image_file) => {
            formData.append('file[]', image_file);
        });

        axios({
            method: 'post',
            url: '/api/admin/uploadCards',
            data: formData,
            headers: {
                'Authorization' : 'Bearer ' + cookie.get('access_token'),
                "Content-type": "multipart/form-data"
            }
        })
            .then(function (response) {
                console.log(response.data);
                self.setState({
                 imageArray: []
                });
            })
            .catch(error => {
               console.log(error)
            })
    };

这是我的laravel控制器:

public function uploadCards(Request $request) {
        if ($request->get('file')) {
            foreach ($request->get('file') as $file) {
                $name = time() . '.' . explode('/', explode(':', substr($file, 0, strpos($file, ';')))[1])[1];
                Image::make($file)->save(public_path('cards/') . $name);
            }
            return response(['upload' => 'success']);
        }
        return response(['upload' => 'error no files ']);
    }

如果我将Image::make($file)->save(public_path('cards/') . $name);注释掉,我也尝试使用laravel Storage :: put(),但它始终是500错误

我可以获取base64代码,可以获取名称,但是存储已经使我丧命了三天,我浏览了stackoverflow并尝试了所有方法,但是我找不到我所缺少的内容

1 个答案:

答案 0 :(得分:1)

只需回答即可,您就可以结束问题

要做的第一件事:
始终查看日志。

正如您所提到的,它已被记录

  

local.ERROR:无法将图像数据写入路径(C:\ laravel \ sveikinimai2019 \ public \ cards / 1564144716.jpeg){“ userId”:5,“ exception”:“ [object]

所以我们知道问题出在保存图像时。通常,这种消息与权限或目录丢失有关。

因为您想要加入公共/资产/卡片/ ,但提供了公共/资产/卡片/ 通过改变 Image::make($file)->save(public_path('cards/') . $name);Image::make($file)->save(public_path('assets/cards/') . $name);将解决您的问题