Sending image file to REST api using Ajax

Question

I'm trying to work on Microsoft's Custom Vision API however they only have documentation for Python, Java, and .NET. Based on their API instructions I have to include Precition-Key and Content-Type as part of the headers and "Set Body to : ". I'm using cordova to take the picture and once a photo is taken, it gives me a FILE_URI back.I've tried everything including using a Node server to do the request for me and while it works, it makes things slower so I wanted to do it through javascript only however I'm kind of stuck as of the moment.

        function takePhoto(){
            alert("WEW")
            let opts = {
                quality:80,
                destinationType: Camera.DestinationType.FILE_URI,
                sourceType:Camera.PictureSourceType.CAMERA,
                mediaType:Camera.MediaType.PICTURE,
                encodingType:Camera.EncodingType.JPEG,
                cameraDirection:Camera.Direction.BACK
            }
            navigator.camera.getPicture(pictureSuccess, pictureFailed, opts);
        }
        function pictureSuccess(imageUrl){
            alert(data);
              $.ajax({
                    type:"POST",
                    data: imageUrl,      
                    headers: {
                     "Prediction-Key":"5d953acd19264d489ac0c15d590dd505",
                    "Content-Type":"application/octet-stream"
                    },               
                    url : 'https://southcentralus.api.cognitive.microsoft.com/customvision/v2.0/Prediction/447f3fe7-05cd-46e3-9c8d-6460e3a3311c/image',                       
                    success: function(data){
                     alert(data)
                    },
                    error:function(e){
                        alert("Error"); 
                    }
                });



        }