Azure Face API identify - Bad request 400 - javascript

I am trying below snippet of code for face identify of azure samples with proper Subscription-Key. I get bad request 400 - can any one please help me how to send request body to work for this ajax call.
<!DOCTYPE html>
<html>
<head>
<title>JSSample</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
</head>
<body>
<script type="text/javascript">
$(function() {
var params = {
// Request parameters
};
$.ajax({
url: "https://api.cognitive.azure.cn/face/v1.0/identify?" + $.param(params),
beforeSend: function(xhrObj){
// Request headers
xhrObj.setRequestHeader("Content-Type","application/json");
xhrObj.setRequestHeader("Ocp-Apim-Subscription-Key","MY_ACCESS_KEY");
},
type: "POST",
// Request body
data: "{body}",
})
.done(function(data) {
alert("success");
})
.fail(function() {
alert("error");
});
});
</script>
</body>
</html>

The url seems to be bad here. Two things: 1) You need to append location before api.cognitive.microsoft.com and 2). .cn should be .com. Your url may look like this, depending on your location:
url: "https://westus.api.cognitive.azure.com/face/v1.0/identify?"
More locations and details are here: https://eastasia.dev.cognitive.microsoft.com/docs/services/563879b61984550e40cbbe8d/operations/563879b61984550f30395239

Try
data: JSON.stringify({name: "Test"})

Related

how to print data sent by ajax post method in javascript

I need to post data and display it also. I am using ajax post method. I am able to get the event Id where data is saved, but not able to display the data. I searched a lot and got some answer also. I tried it in my code, but didn't got the result. My code is:
<!DOCTYPE html>
<html>
<head>
<title>POST API</title>
<script type="text/javascript" src="http://ajax.googleapis.com /ajax/libs /jquery/1.2.6/jquery.js"></script>
</head>
<body>
<button id="btn1">Check HTTP POST</button>
<p>Display sample output from POST API:</p>
<p id="one" />wEventId :
<p id="two" />
<script>
$(document).ready(function() {
$("#btn1").click(function() {
$.ajax({
url: 'url',
dataType: 'json',
type: 'POST',
crossDomain: true,
contentType: 'application/json',
data: {},
success: function(data) {
console.log(data);
document.getElementById("two").innerHTML = data.result.wEventId;
},
failure: function(errMsg) {
console.log(errMsg);
}
var myData = data;
myData = new Array;
});
});
});
</script>
</body>
</html>
Anyone please help me how to modify the code to print the data saved. I have not given the url as it is an internal server and supposed not to disclose it. Thanks in advance.
First I need to know, what is the structure of your json data.
Assuming that it is in a format like given below:
{"field_A":"value_a","field_b":"value_b"}
your code where you are trying to print as innerHTML should be like this:
success: function(data)
{
console.log(data);
document.getElementById("two").innerHTML = data.field_A;
},
Try to adjust accordingly.
I am still surprised from where are you getting the result of data.result.wEventId

getJSON in Javascript

I am new to html and javascript.As far as i know the following code should give an alert when i press "Get JSON Data" button.But the page is not giving me any response.Any help is greatly appreciated.
<html>
<head>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
$(document).ready(function(){
$("button").click(function(){
$.getJSON("http://127.0.0.1:5000/2", function(result){
if (result.length == 0){
alert("nothing") ;
}
if (result.length){
alert("success") ;
}
// $("div").append(myObject);
});
});
});
</script>
</head>
<body>
<button>Get JSON data</button>
<div></div>
</body>
</html>
I suspected that should be the Cross-domain issue. That is why I asked for the console log. you have couple of choices:
config the cross-domain headers from your servlet/backend response.
(ex: if you're using a Servlet:)
response.setHeader('Access-Control-Allow-Origin','*');
use jsonp call back
$.getJSON("http://example.com/something.json?callback=?", function(result){
//response data are now in the result variable
alert(result);
});
The "?" on the end of the URL tells jQuery that it is a JSONP
request instead of JSON. jQuery registers and calls the callback
function automatically.
use $.ajax with CORS enabled or with jsonp
ex:
$.ajax({
url: surl,
data: {
id: id // data to be sent to server
},
dataType: "jsonp",
jsonp: "callback",
jsonpCallback: "jsonpcallback"
});
// Named callback function from the ajax call when event fired.
function jsonpcallback(rtndata) {
// Get the id from the returned JSON string and use it to reference the target jQuery object.
var myid = "#" + rtndata.id;
$(myid).feedback(rtndata.message, {
duration: 4000,
above: true
});
}
or else, download and configure "CORS.jar" in your server side which will allow the cross-domain requests.
HOW ?
Hope you can get some idea. follow which suits for you ..
Replace the JSON call with
$.getJSON("http://127.0.0.1:5000/2", function(result){
if (result.length == 0){
alert("nothing") ;
}
if (result.length){
alert("success") ;
}
// $("div").append(myObject);
}).fail(function( jqxhr, textStatus, error ) {
var err = textStatus + ", " + error;
console.log( "Request Failed: " + err )
});
That way you can see what goes wrong. The javascript looks OK, I suspect it's a server issue.
You could also try getting back JSON from some random source, like http://1882.no/API/business/get/results.php?q=skole&page=0

Want to fetch the RSS feed and render on the html using jquery

I am trying to render this url http://online.wsj.com/xml/rss/3_7085.xml to fetch all the xml information using jquery but i came across something on jsonp thats giving me a callback ,how do i handle that callback to render each node in the html.
I tried the below code:
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>RSS Feed testing</title>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.11.2/jquery.min.js"></script>
<script>
var result;
function jsonparser1() {
$.ajax({
type: "GET",
url: "http://online.wsj.com/xml/rss/3_7085.xml",
dataType: "jsonp",
success: function (result) {
$("div").html(result);
},
});
}
$(document).ready(function(e) {
jsonparser1();
});
</script>
</script>
</head>
<body>
<div></div>
</body>
</html>
I googled, about jsonp ,its quite confusing to me.
Rss feed in xml format. Use datatype = json.
function jsonparser1() {
$.ajax({
type: "GET",
url: "http://online.wsj.com/xml/rss/3_7085.xml",
dataType: "xml",
success: function (result) {
$("div").html(result);
},
});
}
This is not doable directly. You need to use a service like Superfeedr's Feed API or Google's.
These services will serve your the content of the feed in JSON using JSONP so that you can easily integrate any feed into any page.

I have to get data from the following url which contains the data in json format

http://te.chni.ca/twitter.api/tweet.php
I tried all tutorials but unable to get the data from that please help me
try to get atleast one attribute so i can try the remaining ones
<!DOCTYPE html>
<html>
<head>
<title>Twitter</title>
</head>
<body>
<button id="initquery">Search</button>
<script src="http://code.jquery.com/jquery.js"></script>
<script>
$(function(){
$('#initquery').click(function(){
$.getJSON('http://te.chni.ca/twitter.api/tweet.php',function(data){
var item=[];
$.each(data,function(key,val){
items.push('<li id="'+key+'">'+val+'</li>');
});
$('<ul/>',{
'class':'interests-list',
html:items.join('')
}).appendTo('body');
});
});
});
</script>
</body>
</html>
You need to be using jsonp. Do you see the parenthesis around the response from that API? That is tell-tale sign that this is intended to be jsonp.
You should use ajax() method for this:
$ajax(
url: 'http://te.chni.ca/twitter.api/tweet.php',
dataType: 'jsonp',
success: function(data) {
// your success function
}
);

Request Web Service to get JSON

I need to hit web service URL which is giving me JSON object and use basic authentication. How can I perform the the same in JavaScript. I am using the code below, but nothing happens on browser.
<html>
<head>
<title>Hello World</title>
<script>
function send_with_ajax()
var httpRequest = new XMLHttpRequest();
httpRequest.open("GET", 'url of service', true);
httpRequest.setRequestHeader("Content-type", "application/x-www-form-urlencoded");
httpRequest.setRequestHeader("X-Requested-With", "XMLHttpRequest");
httpRequest.send();
httpRequest.onload= function() {
if (httpRequest.readyState == 4)
{
var _tempRecommendations = httpRequest.responseXML;
window.alert(httpRequest.response);
window.alert(httpRequest.responseText);
window.alert(_tempRecommendations);
}
};
};
</script>
</head>
<body onload="send_with_ajax()"></body>
</html>
check jQuery out for this action. It would result in something like
$.get("http://yourRestprovider.com/yourResource",function(data){
//handle your data
},"json");
please specify what you mean with basic authentication since I see no approach of authenticating against the server in your code snippet!
(You don't need JQuery for this.)
First make sure the inner function is running at all, so try setting the function to onreadystatechange instead of onload.
As for authentication: If your domain (the thing that replaces 'url of service') has the same origin as the page the script is in, and you're already doing some sort of authentication which stores a login session cookie, you don't need to do anything else.
Hi i am using below code : after that it just shows loading on browser.
<html><head>
<title>Hello World</title>
<script src="http://code.jquery.com/jquery-1.4.3.min.js"></script>
<script src="http://code.jquery.com/mobile/1.0a1/jquery.mobile-1.0a1.min.js">
</script>
<script type="text/javascript">
function send_with_ajax()
{
$.ajax
({
type: "GET",
url: "https://url with params",
dataType: 'json',
async: false,
username: 'abc',
password: 'def',
data: '{ "comment" }',
success: function (){
alert('Success!');
}
});
}
</script>
</head>
<body onload="send_with_ajax()"></body>
</html>

Categories