0

It's possible to store images in the filesystem just using jquery/ajax? and if is not possible how can I do it using python I found a lot of examples with php but I can do it just with JQuery or JQuery/Python?

This is my scrip with JQuery:

$(document).ready(function () {
        if (window.File && window.FileReader && window.FormData) {
            var $inputField = $('#file');

            $inputField.on('change', function (e) {
                var file = e.target.files[0];

                if (file) {
                    if (/^image\//i.test(file.type)) {
                        readFile(file);
                    } else {
                        alert('Not a valid image!');
                    }
                }
            });
        } else {
            alert("File upload is not supported!");
        }
        function readFile(file) {
            var reader = new FileReader();

            reader.onloadend = function () {
                processFile(reader.result, file.type);
            }

            reader.onerror = function () {
                alert('There was an error reading the file!');
            }

            reader.readAsDataURL(file);
        }
        function processFile(dataURL, fileType) {
            var maxWidth = 800;
            var maxHeight = 800;

            var image = new Image();
            image.src = dataURL;

            image.onload = function () {
                var width = image.width;
                var height = image.height;
                var shouldResize = (width > maxWidth) || (height > maxHeight);

                if (!shouldResize) {
                    sendFile(dataURL);
                    return;
                }

                var newWidth;
                var newHeight;

                if (width > height) {
                    newHeight = height * (maxWidth / width);
                    newWidth = maxWidth;
                } else {
                    newWidth = width * (maxHeight / height);
                    newHeight = maxHeight;
                }

                var canvas = document.createElement('canvas');

                canvas.width = newWidth;
                canvas.height = newHeight;

                var context = canvas.getContext('2d');

                context.drawImage(this, 0, 0, newWidth, newHeight);

                dataURL = canvas.toDataURL(fileType);

                sendFile(dataURL);
            };

            image.onerror = function () {
                alert('There was an error processing your file!');
            };
        }
        function sendFile(fileData) {
            var formData = new FormData();

            formData.append('imageData', fileData);

            $.ajax({
                type: 'POST',
                url: 'here/some/filesystem/dir',
                data: formData,
                contentType: false,
                processData: false,
                success: function (data) {
                    if (data.success) {
                        alert('Your file was successfully uploaded!');
                    } else {
                        alert('There was an error uploading your file!');
                    }
                },
                error: function (data) {
                    alert('There was an error uploading your file!');
                }
            });
            }
    });

Using just JQuery gives me this error:

Failed to load file:///here/some/filesystem/dir: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.

So I use IIS web server but gives me this error:

403 (FORBIDDEN)

Even when I give all the permissions to the IIS user

If is only possible using a backend lenguaje Can someone direct to me to some tutorial or where I can learn this, use Python as the php way, something like:

$.ajax({
    type: 'POST',
    url: 'upload.php',
//BUT USING PYTHON
$.ajax({
    type: 'POST',
    url: 'upload.py',

Thank you in advance any question about this please ask me.

M. Gar
  • 889
  • 4
  • 16
  • 33
  • yes, that's what I try to do – M. Gar Nov 21 '18 at 18:19
  • Hi @peeebeee I think this question is not duplicate because the post you say do not use only `jquery` they use scripts in `php` and I found a lot like that but I need just `jquery` or `jquery` with `python` scripts not `php` – M. Gar Nov 21 '18 at 23:54
  • Try this then (Google has many examples) https://stackoverflow.com/questions/12166158/upload-a-file-with-python – peeebeee Nov 22 '18 at 16:27

0 Answers0