why is this POST request no AJAX request?

[bernhard]

hi devs,

i have an uikit drag&drop upload on my project and it's working fine. i have this request in my dev-tools:

it sends a POST with the image data and returns a smaller version of the image (GET)

in my php-code i handle it like this (some lines collapsed):

can someone explain what exactly counts as $config->ajax request and what does not? thank you!

[Craig]

From wire/core/ProcessWire.php:

$config->ajax = (isset($_SERVER['HTTP_X_REQUESTED_WITH']) && $_SERVER['HTTP_X_REQUESTED_WITH'] == 'XMLHttpRequest');

[Pierre-Luc]

According to his screenshot both requests are XHR (XMLHttpRequest), so it should be seeing them as such.

I assume you're doing your call with jQuery? Do you have any proxy between the browser and the server like CloudFlare that might interfere with it?

[bernhard]

thank you pierre-luc. yes that's why i thought it should be an $config->ajax request...

this is the code for the upload via uikit:

/**
 *
 * stickerframeupload
 *
 */
var progressbar = $("#stickerframeprogressbar"),
    bar         = progressbar.find('.uk-progress-bar'),
    settings    = {
        action: config.pageUrl + 'setstickerframe/', // upload url
        single: false, // make one request per file = true/false
        filelimit: 1,
        params: {width: $('#stickerframemodal .rahmen').width()},
        //allow : '*.(png)', // allow only PNG images
        loadstart: function() {
            bar.css("width", "0%").text("0%");
            progressbar.removeClass("uk-hidden");
        },
        progress: function(percent) {
            percent = Math.ceil(percent);
            bar.css("width", percent+"%").text(percent+"%");
        },
        allcomplete: function(response) {
            bar.css("width", "100%").text("100%");
            setTimeout(function(){
                progressbar.addClass("uk-hidden");
            }, 250);

            var res = JSON.parse(response);
            config.stickerframetmp = res.stickerframe;
            config.stickerframepreviewtmp = res.stickerframepreview;
            $('#stickerframemodal .rahmen').attr('src',res.stickerframepreview);
        }
    };
var select = UIkit.uploadSelect($("#stickerframeinput"), settings),
    drop   = UIkit.uploadDrop($("#stickerframedrop"), settings);

here is the info about uikit drag&drop upload: http://getuikit.com/docs/upload.html

yes, jquery; no proxy...

[LostKobrakai]

Check the xhr requests if the needed header is really present. If not it won't be recognized by processwire. Being a xhr request alone is not detectable for the webserver.

[bernhard]

thank you.

seems that the headers are not set... should that be done by the uikit script? is this an issue i should report to them?

[LostKobrakai]

Afaik the header is just a convention. The usage of it in libraries might vary.

[bernhard]

ok thank you for all the explanations