当前位置: 首页 > 知识库问答 >
问题:

Laravel 5.6:通过AJAX将图像存储到公共文件夹

巢海
2023-03-14

我正在为一个个人项目制作一个管理面板,作为学习laravel框架的一种手段,到目前为止我很喜欢它!

我遇到了一个问题,我不知道如何将上传的图像存储到我的应用程序中(尽管不太安全,但我想使用公用文件夹而不是其他存储),我的文件夹名为uploads inside public。

这是我的AJAX POST调用:

$('.form_store_button').click(function(){
		
		var linked_entry = $(this).attr("data-link");
		var form = $(this).closest('form');
		
		
		
		
		$.ajaxSetup({
            headers: { 'X-CSRF-Token' : $('meta[name=csrf-token]').attr('content') }
        });
		

		switch(linked_entry) {
            
			case "sliders":
			
			    console.log('new slider button clicked');
				
				var formData = new FormData();
                formData.append('title', form.closest($("input[name='title']").val()));
                formData.append('body', form.closest($("textarea[name='body']").val()));
                formData.append('image', form.closest($("input[name='image']").prop('files')[0]));
				formData.append('isVisible', form.closest($("input[name='isVisible']").is(':checked') ? 1 : 0));

				
                $.ajax({

                async: true,
                url: '/sliders',
                type: 'POST',
                data: formData,
                dataType: 'JSON',
			    processData: false,
			    contentType: false,
            
                success: function (data) { 
			        $('.form_valid_container').html('<span class="form_valid_text">✓ '+ data.success +'</span>');
				    form.trigger("reset");
			        console.log(data.success, data.errors);
                },
			
			    error: function (data){
                    var errors = data.responseJSON;
                    console.log(errors);
				
				    $.each(errors , function(){
                        $('.form_error_container').html('<span class="form_error_text">✘ '+ errors.message +'</span>')
                    }); 
                }
				
				
				});

		    break;
					
					

            default:
                        
        }
				
	});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

这是我的控制器,我尝试在其中存储图像(但最终失败)。

public function store(StoreSlider $request)
    {
		
		
        $slider = new Slider();
        $slider->title = $request->title;
        $slider->body = $request->body;
		$slider->image = $request->file('image');
		$slider->isVisible = $request->isVisible;
        $slider->save();
		
        return response()->json($slider);
    }

共有1个答案

胡天佑
2023-03-14

后续步骤,

  1. 您必须将图像存储在公共目录中
  2. 将公共路径存储在数据库中

要存储图像,您需要具有以下数据:,

  1. 上传图像的文件名和扩展名
public function store(StoreSlider $request)
    {
        $uploadFile = $request->file('image');

        //generate random filename and append original extension (eg: asddasada.jpg, asddasada.png)
        $filename = str_random(6).'.'.$uploadFile->extension();

        // storing path (Change it to your desired path in public folder)
        $path = 'img/uploads';

        // Move file to public filder
        $uploadFile->storeAs('../../public/'.$path, $filename);

        $slider = new Slider();
        $slider->title = $request->title;
        $slider->body = $request->body;
        $slider->image = $path.'/'.$filename; // So that you can access image by url($slider->image);
        $slider->isVisible = $request->isVisible;
        $slider->save();

        return response()->json($slider);
    }
 类似资料:
  • 在我的主机上,我有,而不是“public”目录名。我将public path绑定到索引中的文件 现在,public_path()帮助程序返回带有public_html的路径(正确) 而且,我的磁盘在文件 对我来说一切都很好,但当我上传一些文件时,拉威尔把它们放在

  • 我希望能够从开发和生产的前端直接将图像上传到ReactJS公共文件夹。对于生产,我使用带有nodejs后端的heroku应用程序。 从我在网上找到的所有使用ReactJS上传图像的教程中,他们都使用服务器端将图像上传到云,但我想知道是否有可能像Lavarel那样将图像上传到公共文件夹,这样做是否有任何缺点?

  • 问题内容: 我正在尝试通过Django Shell保存图像文件。 我的是: 一切都可以用admin和form进行,但是我想使用shell保存图像: 就像是 问题答案: 您最终将图像复制到中指定的目录中。 在这种情况下,该方法还将保存实例。可以在以下位置找到用于保存的文档:https://docs.djangoproject.com/en/dev/ref/files/file/

  • 我正在使用Dropzone.js将文件上传到Azure云存储桶中。 这些文件正在上传到bucket,但当我下载它们时,它们已经损坏了。 我到处都找过了。我没有上传在块,一切似乎都在那里,但无论什么类型的文件我上传,它是破坏与我重新下载它。

  • 由于我正在上传一个图像,我希望这是“图像/JPEG”或“图像/PNG”。有办法改变元数据吗? 更新:我之所以这么问,是因为如果一个人创建了一个应用程序,就像Instagram一样,提供了数千张图片。为每个正在获取的图像请求下载链接是不必要的,因为问题中的图像应该已经在默认情况下对公众开放。Firebase文件上传防止了这种情况,因此每个用户必须对每个图像提出一个请求(每次应用程序启动时可能会有成吨

  • 问题内容: 在我的代码中,我设法用CoreData保存了textLabel,但似乎无法正确保存图像。我已经阅读了一些教程,并且知道必须将其转换为NSData。但是我该怎么做呢? 提前致谢! 问题答案: 核心数据并不是要保存图像等大的二进制文件。而是在文件系统中使用文档目录。 这是实现此目的的示例代码。 建议将零件以及与该图像关联的其他元数据保存到核心数据中,并在每次需要时从文件系统中检索。 编辑: