https://firestore-eloquent.netlify.app/assets/js/5332cf1d.515b3e3f.js

1"use strict";(self.webpackChunkfirestore_eloquent=self.webpackChunkfirestore_eloquent||[]).push([[4550],{709:(e,n,r)=>{r.r(n),r.d(n,{assets:()=>d,contentTitle:()=>t,default:()=>c,frontMatter:()=>o,metadata:()=>s,toc:()=>a});var l=r(5893),i=r(1151);const o={sidebar_position:5},t="File Uploads",s={id:"guide/file-upload",title:"File Uploads",description:"Overview",source:"@site/versioned_docs/version-2.x/guide/file-upload.mdx",sourceDirName:"guide",slug:"/guide/file-upload",permalink:"/docs/2.x/guide/file-upload",draft:!1,unlisted:!1,editUrl:"https://github.com/FreddyWhest/firestore-eloquent-docs/tree/main/versioned_docs/version-2.x/guide/file-upload.mdx",tags:[],version:"2.x",sidebarPosition:5,frontMatter:{sidebar_position:5},sidebar:"tutorialSidebar",previous:{title:"Middlewares",permalink:"/docs/2.x/guide/middleware"},next:{title:"Query Buider",permalink:"/docs/2.x/guide/query-builder"}},d={},a=[{value:"Overview",id:"overview",level:2},{value:"Methods",id:"methods",level:2},{value:"<code>upload</code>",id:"upload",level:3},{value:"Parameters",id:"parameters",level:4},{value:"Returns",id:"returns",level:4},{value:"Example",id:"example",level:4},{value:"<code>uploadLivewire</code>",id:"uploadlivewire",level:3},{value:"Parameters",id:"parameters-1",level:4},{value:"Returns",id:"returns-1",level:4},{value:"Example",id:"example-1",level:4}];function h(e){const n={admonition:"admonition",code:"code",h1:"h1",h2:"h2",h3:"h3",h4:"h4",li:"li",p:"p",pre:"pre",strong:"strong",ul:"ul",...(0,i.a)(),...e.components};return(0,l.jsxs)(l.Fragment,{children:[(0,l.jsx)(n.h1,{id:"file-uploads",children:"File Uploads"}),"\n",(0,l.jsx)(n.h2,{id:"overview",children:"Overview"}),"\n",(0,l.jsx)(n.p,{children:"The File Upload provides methods to facilitate the uploading of files to Google Cloud Storage and retrieving their associated URLs and metadata."}),"\n",(0,l.jsx)(n.admonition,{title:"IMPORTANT NOTES",type:"info",children:(0,l.jsxs)(n.p,{children:["Ensure that the necessary environment variables ",(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"(GOOGLE_CLOUD_STORAGE_BUCKET and GOOGLE_APPLICATION_CREDENTIALS)"})})," are set before using these methods."]})}),"\n",(0,l.jsx)(n.h2,{id:"methods",children:"Methods"}),"\n",(0,l.jsx)(n.h3,{id:"upload",children:(0,l.jsx)(n.code,{children:"upload"})}),"\n",(0,l.jsx)(n.p,{children:"Uploads a file to Google Cloud Storage."}),"\n",(0,l.jsx)(n.pre,{children:(0,l.jsx)(n.code,{className:"language-php",children:"upload(string $name, $path = 'images')\n"})}),"\n",(0,l.jsx)(n.h4,{id:"parameters",children:"Parameters"}),"\n",(0,l.jsxs)(n.p,{children:["| Name | Type | Description |\r\n| ",(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"$name"})})," | string |  The name of the file input field in the HTTP request. |\r\n| ",(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"$path"})})," (optional) | string | The path where the file should be stored in Google Cloud Storage. The default path is set to 'images'. |"]}),"\n",(0,l.jsx)(n.p,{children:"This method handles the file upload process for Laravel."}),"\n",(0,l.jsx)(n.h4,{id:"returns",children:"Returns"}),"\n",(0,l.jsxs)(n.ul,{children:["\n",(0,l.jsxs)(n.li,{children:["An object containing the following information:","\n",(0,l.jsxs)(n.ul,{children:["\n",(0,l.jsxs)(n.li,{children:[(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"url"})}),": The URL of the uploaded file."]}),"\n",(0,l.jsxs)(n.li,{children:[(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"downloadUrl"})}),": The URL used for downloading the file."]}),"\n",(0,l.jsxs)(n.li,{children:[(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"contentType"})}),": The content type of the file."]}),"\n",(0,l.jsxs)(n.li,{children:[(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"downloadTokens"})}),": Download tokens for secure file access."]}),"\n",(0,l.jsxs)(n.li,{children:[(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"size"})}),": The size of the file."]}),"\n",(0,l.jsxs)(n.li,{children:[(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"updated"})}),": The timestamp when the file was last updated."]}),"\n",(0,l.jsxs)(n.li,{children:[(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"timeCreated"})}),": The timestamp when the file was created."]}),"\n",(0,l.jsxs)(n.li,{children:[(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"bucket"})}),": The name of the Google Cloud Storage bucket."]}),"\n",(0,l.jsxs)(n.li,{children:[(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"etag"})}),": The entity tag (ETag) of the file."]}),"\n",(0,l.jsxs)(n.li,{children:[(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"generation"})}),": The generation of the file."]}),"\n",(0,l.jsxs)(n.li,{children:[(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"nameAndPath"})}),": The name and path of the file."]}),"\n"]}),"\n"]}),"\n"]}),"\n",(0,l.jsx)(n.h4,{id:"example",children:"Example"}),"\n",(0,l.jsx)(n.pre,{children:(0,l.jsx)(n.code,{className:"language-php",children:"\r\n//Controller (FileUploadController.php)\r\nnamespace App\\Http\\Controllers;\r\n\r\nuse Illuminate\\Http\\Request;\r\nuse Roddy\\FirestoreEloquent\\FileUpload\\FirestoreFileUpload;\r\n\r\nclass FileUploadController extends Controller\r\n{\r\n    public function showForm()\r\n    {\r\n        return view('file-upload-form');\r\n    }\r\n\r\n    public function uploadFile(Request $request)\r\n    {\r\n        // Handle file upload using FirestoreFileUpload::upload method\r\n        try {\r\n        // Attempt to upload the file from input field named 'fileInputName' to the 'custom/

1path' in Google Cloud Storage\r\n            $uploadResult = FirestoreFileUpload::upload('fileInput', 'custom/path');\r\n            // ... (other properties)\r\n\r\n            // Redirect back to the form with the upload result\r\n            return redirect()->route('upload.form')->with(['uploadResult' => $uploadResult]);\r\n\r\n        } catch (\\Exception $e) {\r\n            // Handle exceptions, e.g., missing environment variables or invalid file name\r\n            return $e->getMessage();\r\n        }\r\n\r\n    }\r\n}\r\n\r\n// upload.blade.php\r\n// File Upload Form\r\n<form action=\"{{ route('upload.file') }}\" method=\"post\" enctype=\"multipart/form-data\">\r\n    @csrf\r\n    <label for=\"fileInput\">Choose a file:</label>\r\n    <input type=\"file\" name=\"fileInput\" id=\"fileInput\" accept=\"image/*\">\r\n    <button type=\"submit\">Upload File</button>\r\n</form>\r\n\r\n\r\n// preview.blade.php\r\n//Display the uploaded file (if any)\r\n@if(isset($uploadResult))\r\n    <hr>\r\n    <h2>Uploaded File:</h2>\r\n    <img src=\"{{ $uploadResult->url }}\" alt=\"Uploaded File\">\r\n    <p>File Size: {{ $uploadResult->size }} bytes</p>\r\n    <p>File Type: {{ $uploadResult->contentType }}</p>\r\n    //Add more details as needed\r\n@endif\r\n\r\n\r\n//Routes (web.php)\r\nuse App\\Http\\Controllers\\FileUploadController;\r\n\r\nRoute::get('/upload-form', [FileUploadController::class, 'showForm'])->name('upload.form');\r\nRoute::post('/upload-file', [FileUploadController::class, 'uploadFile'])->name('upload.file');\r\n\n"})}),"\n",(0,l.jsx)(n.admonition,{type:"info",children:(0,l.jsx)(n.p,{children:"Exception handling is implemented to provide meaningful error messages in case of issues during the file upload process."})}),"\n",(0,l.jsxs)(n.p,{children:["This example assumes you have a controller method ",(0,l.jsx)(n.strong,{children:"(uploadFile)"})," to handle the file upload logic using the ",(0,l.jsx)(n.strong,{children:"FirestoreFileUpload"})," class. Adjust the routes and controller methods based on your application structure."]}),"\n",(0,l.jsx)(n.h3,{id:"uploadlivewire",children:(0,l.jsx)(n.code,{children:"uploadLivewire"})}),"\n",(0,l.jsxs)(n.p,{children:["This method handles the file upload process for ",(0,l.jsx)(n.strong,{children:"Livewire"}),"."]}),"\n",(0,l.jsx)(n.pre,{children:(0,l.jsx)(n.code,{className:"language-php",children:"uploadLivewire(object $file, $path = 'images')\n"})}),"\n",(0,l.jsx)(n.h4,{id:"parameters-1",children:"Parameters"}),"\n",(0,l.jsxs)(n.p,{children:["| Name | Type | Description |\r\n| ",(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"$file"})})," | object |  The object containing the file input field in the HTTP request. |\r\n| ",(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"$path"})})," (optional) | string | The path where the file should be stored in Google Cloud Storage. The default path is set to 'images'. |"]}),"\n",(0,l.jsx)(n.p,{children:"This method handles the file upload process for Laravel."}),"\n",(0,l.jsx)(n.h4,{id:"returns-1",children:"Returns"}),"\n",(0,l.jsxs)(n.ul,{children:["\n",(0,l.jsxs)(n.li,{children:["An object containing the following information:","\n",(0,l.jsxs)(n.ul,{children:["\n",(0,l.jsxs)(n.li,{children:[(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"url"})}),": The URL of the uploaded file."]}),"\n",(0,l.jsxs)(n.li,{children:[(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"downloadUrl"})}),": The URL used for downloading the file."]}),"\n",(0,l.jsxs)(n.li,{children:[(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"contentType"})}),": The content type of the file."]}),"\n",(0,l.jsxs)(n.li,{children:[(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"downloadTokens"})}),": Download tokens for secure file access."]}),"\n",(0,l.jsxs)(n.li,{children:[(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"size"})}),": The size of the file."]}),"\n",(0,l.jsxs)(n.li,{children:[(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"updated"})}),": The timestamp when the file was last updated."]}),"\n",(0,l.jsxs)(n.li,{children:[(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"timeCreated"})}),": The timestamp when the file was created."]}),"\n",(0,l.jsxs)(n.li,{children:[(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"bucket"})}),": The name of the Google Cloud Storage bucket."]}),"\n",(0,l.jsxs)(n.li,{children:[(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"etag"})}),": The entity tag (ETag) of the file."]}),"\n",(0,l.jsxs)(n.li,{children:[(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"generation"})}),": The generation of the file."]}),"\n",(0,l.jsxs)(n.li,{children:[(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"nameAndPath"})}),": The name and path of the file."]}),"\n"]}),"\n"]}),"\n"]}),"\n",(0,l.jsx)(n.h4,{id:"example-1",children:"Example"}),"\n",(0,l.jsx)(n.pre,{children:(0,l.jsx)(n.code,{className:"language-php",children:"\r\n//Controller (FileUploadController.php)\r\nnamespace App\\Http\\Controllers;\r\n\r\nuse Livewire\\Component;\r\nuse Illuminate\\Http\\Request;\r\nuse Roddy\\FirestoreEloquent\\FileUpload\\FirestoreFileUpload;\r\n\r\nclass FileUpload extends Component\r\n{\r\n    public $photo;\r\n\r\n    public function render()\r\n    {\r\n        return view('file-upload-form');\r\n    }\r\n\r\n    public function uploadFile(Request $request)\r\n    {\r\n        // Handle file upload using FirestoreFileUpload::upload method\r\n        try {\r\n        // Attempt to upload the file from input field named 'fileInputName' to the 'custom/

1path' in Google Cloud Storage\r\n            if($this->photo){\r\n                $uploadResult = FirestoreFileUpload::uploadLivewire($this->photo, 'custom/path');\r\n            }else{\r\n                $uploadResult = null;\r\n            }\r\n            // ... (other properties)\r\n\r\n            // Redirect back to the form with the upload result\r\n            return redirect()->route('upload.form');\r\n\r\n        } catch (\\Exception $e) {\r\n            // Handle exceptions, e.g., missing environment variables or invalid file name\r\n            return $e->getMessage();\r\n        }\r\n\r\n    }\r\n}\r\n\r\n\r\n// upload.blade.php\r\n// File Upload Form\r\n<form wire:submit='uploadFile'>\r\n    <label for=\"fileInput\">Choose a file:</label>\r\n    <input type=\"file\" wire:model.blur='photo' accept=\"image/*\">\r\n    <button type=\"submit\">Upload File</button>\r\n</form>\n"})}),"\n",(0,l.jsxs)(n.p,{children:["This example assumes you have a controller method ",(0,l.jsx)(n.strong,{children:"(uploadFile)"})," to handle the file upload logic using the ",(0,l.jsx)(n.strong,{children:"FirestoreFileUpload"})," class. Adjust the routes and controller methods based on your application structure."]}),"\n",(0,l.jsx)(n.admonition,{title:"IMPORTANT NOTES",type:"info",children:(0,l.jsxs)(n.p,{children:["Ensure that the necessary environment variables ",(0,l.jsx)(n.strong,{children:(0,l.jsx)(n.code,{children:"(GOOGLE_CLOUD_STORAGE_BUCKET and GOOGLE_APPLICATION_CREDENTIALS)"})})," are set before using these methods."]})})]})}function c(e={}){const{wrapper:n}={...(0,i.a)(),...e.components};return n?(0,l.jsx)(n,{...e,children:(0,l.jsx)(h,{...e})}):h(e)}},1151:(e,n,r)=>{r.d(n,{Z:()=>s,a:()=>t});var l=r(7294);const i={},o=l.createContext(i);function t(e){const n=l.useContext(o);return l.useMemo((function(){return"function"==typeof e?e(n):{...n,...e}}),[n,e])}function s(e){let n;return n=e.disableParentContext?"function"==typeof e.components?e.components(i):e.components||i:t(e.components),l.createElement(o.Provider,{value:n},e.children)}}}]);