0

I am using AJAX to call my REST API in Azure which is an ML model deployed. I am getting one input string from a text field and on a button click I have written the following code:

I've tried sending a GET request, post request but not getting the success. `

  $.ajax({
        url: url,
        type: `POST`,
        data: JSON.stringify(InputDataText),
        contentType: `application/json`,
        headers: {
            "Authorization": `Bearer ${apiKey}`,
            "Content-Type": "application/json"
        },
        success: (response) => {
            console.log(response)
        },
       error: function(xhr, error, errorstring){
            console.log(error);
        }, 
        complete: (jqXHR, textStatus) => {
            console.log(`ajax completed: jqXHR: ${JSON.stringify(jqXHR)}, textStatus: ${textStatus}`)

        }
    });

The JSON data I am using: 

 {
        "Inputs": {
            "input1":
                [
                    {
                        'Name': "AR",
                    },
                    {
                        'Name': "SAS is a bitch",
                    }
                ],
        },
        "GlobalParameters": {}
    }

The output I get with this JSON data on POSTMAN: 

{
    "Results": {
        "output1": [
            {
                "Scored Labels": "Aortic Regurgitation"
            },
            {
                "Scored Labels": "Aortic Valve Stenosis"
            }
        ]
    }
}

` I want the success case to run but it always runs the error and complete case. The output is as follows:

ajax completed: jqXHR: 

`
{"readyState":0,"status":0,"statusText":"error"}, textStatus: error

`
ubi butt
  • 1
  • 3
  • Have you tried sending the same request from postman, to see if the result is any different? – nick zoum Jan 25 '19 at 14:31
  • What is the actual output from teh server? – basic Jan 25 '19 at 14:35
  • Please tell in which language did you write backend code and if you are using any other port to run the application other then 80 – mzparacha Jan 25 '19 at 14:36
  • Yeah @nickzoum it's working fine on POSTMAN though, a POST request with JSON body gives me the perfect response. It's only that I need this to run in the browser with my HTML. – ubi butt Jan 25 '19 at 14:41
  • @basic I've pasted the actual output in the question – ubi butt Jan 25 '19 at 14:41
  • @mzparacha It's an ML model at Azure, I have used ML studio to make the model and deployed that as a web server. It is hosted in the cloud and I only have API key and URL to access that. – ubi butt Jan 25 '19 at 14:42
  • what is the value of InputDataText, edit your question to show the actual output from: console.log(InputDataText); – basic Jan 25 '19 at 14:42
  • @basic InputDataText is a text field that I am getting from the html form. I've console.log (InputDataText) and it works fine. Other than that I have also tried giving JSON object to the data that works fine in POSTMAN but shows an error in here. – ubi butt Jan 25 '19 at 14:45
  • Ok that isn't the point, what I am saying is when you actually post InputDataText it could be malformed thus resulting in an invalid response from the server. Also, show what json you are sending with postman. So show us: console.log(JSON.stringify(InputDataText)); and also show us the postman payload. – basic Jan 25 '19 at 14:46
  • Yes @basic is saying right what i assume can you please tell us the complete error what it says – mzparacha Jan 25 '19 at 14:48
  • Okie, I am editing my question with these details – ubi butt Jan 25 '19 at 14:50
  • Try sending your data without stringifying it and let me know if that worked or not for testing purpose assign the whole input data to variable and send it – mzparacha Jan 25 '19 at 15:03
  • @mzparacha I've tried sending without Stirngifying it, but it didn't worked out ! – ubi butt Jan 25 '19 at 15:37
  • `"status":0` usually indicates a network or security error, the Console in the browser's developer tools should have more details. – Quentin Jan 25 '19 at 15:51
  • 10:1 says this is another instance of your regular scheduled [needs a basic introduction to browser security](https://stackoverflow.com/a/35553666/19068) – Quentin Jan 25 '19 at 15:52
  • Access to fetch at 'https://uswestcentral.services.azureml.net/workspaces/ea03da130d5642459697b66617228b02/services/0feeb3aecdf24e5488aca36a6ffec35d/execute?api-version=2.0&format=swagger' from origin 'null' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource. If an opaque response serves your needs, set the request's mode to 'no-cors' to fetch the resource with CORS disabled. – ubi butt Jan 28 '19 at 05:57
  • Someone please this is the detail of the error, can you help ? – ubi butt Jan 28 '19 at 05:58

0 Answers0