How to give the right url route to UploadHandler.php of the blueimp jquery file upload on laravel - development

How to give the right url route to UploadHandler.php of the blueimp jquery file upload on laravel

As I want to use the client resize function so I try the https://blueimp.github.io/jQuery-File-Upload/ BASIC PLUS UI Demo

I don’t know how to put the true url route for the file upload folder.
as it always transfer to the web.php route and cannot use the place I made on the public/images folder.
index.blade.php

<form id ="fileupload" action="https://jquery-file-upload.appspot.com/" method="POST" enctype="multipart/form-data">
        <form id ="fileupload" action="https://jquery-file-upload.appspot.com/" method="POST" enctype="multipart/form-data">
        <!-- Redirect browsers with JavaScript disabled to the origin page -->
        <noscript><input type ="hidden" name="redirect" value="https://blueimp.github.io/jQuery-File-Upload/"></noscript>
        <!-- The fileupload-buttonbar contains buttons to add/delete files and start/cancel the upload -->
        <div class="row fileupload-buttonbar">
            <div class="col-lg-7">
                <!-- The fileinput-button span is used to style the file input field as button -->
                <span class="btn btn-success fileinput-button">
                    <i class ="glyphicon glyphicon-plus"></i>
                    <span>Add files...</span>
                    <input type="file" name="files[]" multiple>
                </span>
                <button type="submit" class="btn btn-primary start">
                    <i class="glyphicon glyphicon-upload"></i>
                    <span>Start upload</span>
                </button>
                <button type="reset" class="btn btn-warning cancel">
                    <i class="glyphicon glyphicon-ban-circle"></i>
                    <span>Cancel upload</span>
                </button>
                <button type="button" class="btn btn-danger delete">
                    <i class="glyphicon glyphicon-trash"></i>
                    <span>Delete</span>
                </button>
                <input type="checkbox" class="toggle">
                <!-- The global file processing state -->
                <span class="fileupload-process"></span>
            </div>
            <!-- The global progress state -->
            <div class="col-lg-5 fileupload-progress fade">
                <!-- The global progress bar -->
                <div class="progress progress-striped active" role="progressbar" aria-valuemin="0" aria-valuemax="100">
                    <div class="progress-bar progress-bar-success" style="width:0%;"></div>
                </div>
                <!-- The extended global progress state -->
                <div class="progress-extended">&nbsp;</div>
            </div>
        </div>
        <!-- The table listing the files available for upload/download -->
        <table role="presentation" class="table table-striped"><tbody class="files"></tbody></table>
    </form>

main.js

$(function () {
    'use strict';

    // Initialize the jQuery File Upload widget:
    $('#fileupload').fileupload({
        // Uncomment the following to send cross-domain cookies:
        //xhrFields: {withCredentials: true},
        // url: 'server/php/',
        url: 'uploadprocess',
        dataType: 'json',

web route

Route::post('uploadprocess', 'ComeController@uploadprocess');

I already put the UploadHandeler.php into the app/

Comecontroller

  public function uploadprocess(Request $request)
    {
        error_reporting(E_ALL | E_STRICT);
        $upload_handler = new UploadHandler();
    }

UploadHandeler.php

<?php
    namespace App;
    class UploadHandler
    {

        protected $options;

        // PHP File Upload error message codes:
        // http://php.net/manual/en/features.file-upload.errors.php
        protected $error_messages = array(
            1 => 'The uploaded file exceeds the upload_max_filesize directive in php.ini',
            2 => 'The uploaded file exceeds the MAX_FILE_SIZE directive that was specified in the HTML form',
            3 => 'The uploaded file was only partially uploaded',
            4 => 'No file was uploaded',
            //....
            'abort' => 'File upload aborted',
            'image_resize' => 'Failed to resize image'
        );

        protected $image_objects = array();

        public function __construct($options = null, $initialize = true, $error_messages = null) {
            $this->response = array();
            $this->options = array(
    //---------------------------the question is here-------------
                'script_url' => $this->get_full_url().'/'.$this->basename($this->get_server_var('SCRIPT_NAME')),

                'upload_dir' => dirname($this->get_server_var('SCRIPT_FILENAME')).'/files/',
                'upload_url' => $this->get_full_url().'/files/',
    //--------------------------the  question is here----------

                'input_stream' => 'php://input',

                .......

I has already make a folder on public/images

How can I let the jpg to put on the right folder place

I have try below but the picture is not upload successful.

           'script_url' => $this->get_full_url().'/'.$this->basename($this->get_server_var('SCRIPT_NAME')),

            'upload_dir' => dirname($this->get_server_var('SCRIPT_FILENAME')).'/images/',
            'upload_url' => $this->get_full_url().'/images/',

PS:
it is work good on the preview image but when I press the upload button

if I use the route post method

  Route::post('uploadprocess', 'ComeController@uploadprocess');

I got the error on console when I reload the index.blade.php

   jquery-3.3.1.min.js:2 GET http://localhost:8000/uploadprocess 405 (Method Not Allowed)

if I use the roue get method

Route::post('uploadprocess', 'ComeController@uploadprocess');

it’s no error when I reload the index.blade.php
but when I put the upload button after the preview images showed( the add function is work well)

jquery-3.3.1.min.js:2 POST http://localhost:8000/uploadprocess 419 (unknown status)

How can I put the picture file on the right url route or folder?

from Laravel Questions and Answers https://laravelquestions.com/laravel/how-to-give-the-right-url-route-to-uploadhandler-php-of-the-blueimp-jquery-file-upload-on-laravel/
via Lzo Media