Get 2024 Templates Mega Bundle!14 Bootstrap, Vue & React Templates + 3 Vector Sets
Get for 99$

How to create a new Page in Laravel App


Hi,
I am using Metronic 8.1.7 Laravel App. How can I create a new page having a form and uploading file. I create a new entry in menu.php file, crated a blade file. I don't know where I need to define route. It looks we do not need to define it web.php.


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(

Replies (3)


Hi Mamta,

Apologies for the delay in getting back to you. Just to clarify, the menu.php and pages.php config files are used to configure the display of pages and create a list for the side menu.

Regarding your form, in order to process the form and its associated file, you will need to create a route in web.php that handles the form submission and file upload.

Thanks



Thank you Faizal for your response. I am able to create a page and add dropzonejs.
Is there any sample which handle the upload files at server side, means Controller code. I can write the code but I concern for security. Is there any sample code which block dangerous file upload like any PHP file, some peoples can upload php files by changing extension php to jpg or pdf. Is metronic have some sample code for this?

One more thing how can I add csrf-token to dropzone ?



Hi Mamta,

Regarding securely handling file uploads in Laravel, one approach is to use the Laravel built-in Storage facade and the validate() method to validate the uploaded files. Here's a sample code that you can use as a reference:

HTML form:

<form action="{{ route("file.upload") }}" method="POST" enctype="multipart/form-data">
@csrf
<div class="fallback">
<input type="file" name="file" multiple>
</div>
<div class="dz-message" data-dz-message><span>Drop files here or click to upload.</span></div>
</form>


Laravel controller:

use Illuminate\Http\Request;
use Illuminate\Support\Facades\Storage;

class FileController extends Controller
{
public function upload(Request $request)
{
$request->validate([
"file" => "required|mimes:jpeg,jpg,png,pdf|max:2048", // Only allow files up to 2MB
]);

$file = $request->file("file");

// Block uploading of PHP files
if ($file->getClientOriginalExtension() == "php") {
return back()->withErrors(["file" => "Invalid file type."]);
}

// Generate a unique file name and store the file
$fileName = uniqid() . "." . $file->getClientOriginalExtension();
Storage::putFileAs("uploads", $file, $fileName);

// Redirect back with success message
return back()->with("success", "File uploaded successfully.");
}
}


In this example, we first validate that the uploaded file meets our requirements (i.e., it is required, is a file, file's mime type (allowed types: jpeg, jpg, png, pdf), and is no larger than 2MB). Then, we check the file extension and block the uploading of PHP files.

We generate a unique file name using uniqid() and the original file extension and store the file using Laravel's Storage facade.

Finally, we redirect back to the previous page with a success message.

To add the CSRF token to Dropzone, you can use the following code:


// Get the CSRF token from the page
const csrfToken = document.querySelector("meta[name="csrf-token"]").getAttribute("content");

// Initialize Dropzone with the CSRF token in the headers
const myDropzone = new Dropzone("div#myDropzone", {
url: "/upload",
headers: {
"X-CSRF-Token": csrfToken
}
});


This code retrieves the CSRF token from a meta tag in the page and passes it to Dropzone in the headers when initializing it.

Thanks


Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(
Text formatting options
Submit
Here's a how to add some HTML formatting to your comment:
  • <pre></pre> for JS codes block
  • <pre lang="html"></pre> for HTML code block
  • <pre lang="scss"></pre> for SCSS code block
  • <pre lang="php"></pre> for PHP code block
  • <code></code> for single line of code
  • <strong></strong> to make things bold
  • <em></em> to emphasize
  • <ul><li></li></ul>  to make list
  • <ol><li></li></ol>  to make ordered list
  • <h3></h3> to make headings
  • <a></a> for links
  • <img> to paste in an image
  • <blockquote></blockquote> to quote somebody
  • happy  :)
  • shocked  :|
  • sad  :(