Pass parameters in body to post in AJAX - javascript

I am facing issue posting values as parameters with jQuery post method with the script as per below:
<script type="text/javascript">
$(function() {
var params = {
// Request parameters
};
$.ajax({
url: "https://someurl.com/bravsoap.asmx?op=ptr" + $.param(params),
beforeSend: function(xhrObj){
// Request headers
xhrObj.setRequestHeader("Content-Type","text/xml");
},
type: "POST",
// Request body
data: "{body}",
})
.done(function(data) {
alert("success");
})
.fail(function() {
alert("error");
});
});
</script>
This is sample from API vendor:
<ptr_PostToRoom xmlns="http://someurl.com">
<SessionID>9283-243342-422323423-2343e</SessionID>
<PostingM>PostingMethod_RoomID</PostingM>
<PostingP>002</PostingP>
<Header>
<Code>FOOD</Code>
<Description>Crystal Room – Beverage – Order No. 12345</Description>
<Quantity>1</Quantity>
</Header>
<Transactions>
<Code>FOOD</Code>
<Description>Dinner</Description>
<Quantity>1</Quantity>
<GrossTotal>35.50</GrossTotal>
<Code>BARDRINK</Code>
<Description>Bar Drinks</Description>
<Quantity>1</Quantity>
<GrossTotal>12.75</GrossTotal>
</ptr_PostToRoom>
Sorry for the bad explanation in first place.

Related

Laravel 8 and ajax

Never used ajax before and I'm quite new to Laravel as well.
I'm running a function where it gets the information from the form and i have no idea how to do the request with the information that I need.
function myFunction() {
var x = document.getElementById("frm1");
//console.log(x.elements.personSearch.value);
var details = x.elements.personSearch.value;
document.getElementById("personValidation").innerHTML = "";
if (
!details.match(
/\b[a-zA-Z ]*\\[a-zA-Z ]*\\[0-3][0-9][0-1][0-9][0-9]{4}\b/g
)
) {
document.getElementById("personValidation").innerHTML =
"Your search does not match the required format";
return;
}
$.ajax({
url: "/api/pnc/person",
type: "POST",
dataType: "json",
success:function(amount) {
console.log(amount);
}
});
``` Javascript
public function person(Request $request)
{
$request->validate([
'search' => 'required'
]);
return "test";
}
You need to Follow 3 steps for Ajax Request-
1. Setup Ajax Header bottom of your code. I mean before </html> add below code.
<script>
$.ajaxSetup({
headers: {'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
});
</script>
2. If you don't use Header Then you can use.
<script>
$(document).ready(function () {
$("#your_form_id").submit(function(e) {
var details = $('#details_input_id').val();
if(your_condition){
$.ajax({
url: "api/url",
type: "post",
data: {"_token": "{{csrf_token()}}", 'details':details},
success:function(data){
//Your response
if(data){
consol.log("Print what you want to print");
}
}
});
}else{
alert("Your search does not match the required format")
}
});
});
</script>
3. Your Route will be like ajax url
Route::post('api/url', [YourController::class, 'functionName'])->name('functionName');

Consuming api using Javascript

I have been struggling to render a data object returned by an API request on an HTML page, however it keeps displaying the string object on the HTML page. Another problem is that I am not able to make use of the data object returned by the API request outside of the API function in Javascript. See the code below:
The API request, the console.log(data) outside the API function does not work
var params = {
// Request parameters
};
$.ajax({
url:
"https://failteireland.azure-api.net/opendata-api/v1/attractions?" +
$.param(params),
beforeSend: function (xhrObj) {
// Request headers
xhrObj.setRequestHeader(
"Ocp-Apim-Subscription-Key",
"ef4ed92186214c868a59d97c3b353661"
);
},
type: "GET",
// Request body
data: "{body}",
})
.done(function (data) {
console.log(data);
document.getElementById("data").innerHTML = data.results;
})
.fail(function () {
alert("error");
});
});
console.log(data);
The HTML Page
<html>
<head>
<title>JSSample</title>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.0/jquery.min.js"></script>
<script src="main.js"></script>
</head>
<body>
<div id="data"></div>
</body>
</html>
You need to pass in a callback function to handle the returned data.
function do_request(cb, cb_fail) {
var params = {};
$.ajax({
url:
"https://failteireland.azure-api.net/opendata-api/v1/attractions?" +
$.param(params),
beforeSend: function (xhrObj) {
// Request headers
xhrObj.setRequestHeader(
"Ocp-Apim-Subscription-Key",
"ef4ed92186214c868a59d97c3b353661"
);
},
type: "GET",
// Request body
data: "{body}",
})
.done(cb)
.fail(cb_fail);
}
function cb(data) {
// you now have access to the data here
document.getElementById("data").innerHTML = JSON.stringify(data.results)
}
function cb_fail(error) {
console.log(error)
}
do_request(cb, cb_fail)

How to receive judgement result from model of Custom Vision with JavaScript

I want to receive judgement result from model of Azure Custom Vision by using JavaScript.
I changed JavaScript code that this site has.
https://southcentralus.dev.cognitive.microsoft.com/docs/services/eb68250e4e954d9bae0c2650db79c653/operations/58acd3c1ef062f0344a42814
But I can't.
What is wrong with my code?
I changed IterationId, application, url, content-Type, Prediction-key, and data.
These part are enclosed with {} in the code below.
<!DOCTYPE html>
<html>
<head>
<title>Human</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
"iterationId": "{Iteration id that showed in Performance Page}",
"application": "{My Project name of Custom Vision}",
};
$.ajax({
url: "{url that showed in "How to use the Prediction API"}" + $.param(params),
beforeSend: function(xhrObj){
// Request headers
xhrObj.setRequestHeader("Content-Type","application/octet-stream");
xhrObj.setRequestHeader("Prediction-key","{my prediction key that showed in "How to use the Prediction API"}");
},
type: "POST",
// Request body
data: "D:\some name\some name\image.jpg",
})
.done(function(data) {
alert("success");
})
.fail(function() {
alert("error");
});
});
</script>
</body>
</html>
Of course, I expected showing "success".
But, the actual output is "error"......
When I changed URL that this site has(https://southcentralus.dev.cognitive.microsoft.com/docs/services/eb68250e4e954d9bae0c2650db79c653/operations/58acd3c1ef062f0344a42814) in my code, I can get Success message.
And, I also write
processData: false,
contentType: false,
in ajax in my code
Change your code to see what is the error that you get back:
(Note the new "error" parameter to the request)
$.ajax({
url: "{url that showed in "How to use the Prediction API"}" + $.param(params),
beforeSend: function(xhrObj){
// Request headers
xhrObj.setRequestHeader("Content-Type","application/octet-stream");
xhrObj.setRequestHeader("Prediction-key","{my prediction key that showed in "How to use the Prediction API"}");
},
type: "POST",
// Request body
data: "D:\some name\some name\image.jpg",
error: function(xhr,status,error) {
// >>>>>>>>>>>> CHECK HERE THE ERROR <<<<<<<<<<<<
}
})
.done(function(data) {
alert("success");
})
.fail(function() {
alert("error");
});
Once you have the error, it would be easier to help you.

I didn't get required input and output on Azure Cognitive services

Code
<!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://westus.api.cognitive.microsoft.com/linguistics/v1.0/analyzers?" + $.param(params),
beforeSend: function(xhrObj){
// Request headers
xhrObj.setRequestHeader("Ocp-Apim-Subscription-Key","fa5a4445a080414d95610f74fa3e5626");
},
type: "GET",
// Request body
data: "{body}",
})
.done(function(data) {
alert("success");
})
.fail(function() {
alert("error");
});
});
</script>
</body>
</html>
Documentation Help
https://westus.dev.cognitive.microsoft.com/docs/services/56ea598f778daf01942505ff/operations/56ea59bfca73071fd4b102ba
input json is below
{ "language" : "en", "analyzerIds" : ["4fa79af1-f22c-408d-98bb-b7d7aeef7f04", "22a6b758-420f-4745-8a3c-46835a67c0d2"], "text" : "Hi, Tom! How are you today?" }
required output is below json
[
{
"analyzerId" : "4fa79af1-f22c-408d-98bb-b7d7aeef7f04",
"result" : ["NNP",",","NNP","VBP","PRP","NN","."]
},
{
"analyzerId" : "22a6b758-420f-4745-8a3c-46835a67c0d2",
"result" : ["(TOP (S (NNP Hi) (, ,) (NNP Tom) (. !)))","(TOP (SBARQ (WHADVP (WRB How)) (SQ (VP (VBP are)) (NP (PRP you)) (NN today) (. ?))))"]
}
]
Looks like you're mixing up the 'List Analyzers' and 'Analyze Text' calls. Your input/output combination suggests you want the latter. If so, the code should be roughly as follows:
var request = {
"language": "en",
"analyzerIds": [
"4fa79af1-f22c-408d-98bb-b7d7aeef7f04",
"22a6b758-420f-4745-8a3c-46835a67c0d2"
],
"text": "Hi, Tom! How are you today?"
}
$.ajax({
url: "https://westus.api.cognitive.microsoft.com/linguistics/v1.0/analyze?" + $.param(params),
beforeSend: function(xhrObj){
// Request headers
xhrObj.setRequestHeader("Content-Type","application/json");
xhrObj.setRequestHeader("Ocp-Apim-Subscription-Key","fa5a4445a080414d95610f74fa3e5626");
},
type: "POST",
// Request body
data: JSON.stringify(request),
})
.done(function(data) {
alert("success");
})
.fail(function() {
alert("error");
});
The four differences are:
The URL is /analyze, not /analyzers
The type is POST, not GET
The Content-Type needs to be specified
The data object needs to contain the request JSON.

Project Oxford - HTTP 404 when calling Computer Vision API through Javascript

I am trying to get JSON data from Microoft Project Oxford through a API call. I followed the API reference but when I make a call I get a 404 error.
<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
"visualFeatures": "All",
};
$.ajax({
url: "https://api.projectoxford.ai/vision/v1/analyses&" + $.param(params),
beforeSend: function(xhrObj){
// Request headers
xhrObj.setRequestHeader("Content-Type","application/json");
xhrObj.setRequestHeader("Ocp-Apim-Subscription-Key","0000000000000000");
},
type: "POST",
// Request body
data: '{ "Url": "http://www.sweetheartmotors.ca/sites/default/files/audi_PNG1736.png" }',
})
.done(function(data) {
alert("success");
//display data
console(data);
})
.fail(function() {
alert("error");
});
});
</script>
What is stopping me from making the call?
You need to change the URL to end in a question mark, rather than an ampersand: https://api.projectoxford.ai/vision/v1/analyses?
Unfortunately most of the samples on the projectoxford.ai site contain this error.

Categories

Resources