如何在javascript中通过URL方法使用Azure自定义视觉预测API?
How to use Azure custom vision prediction API by URL method in javascript?
<!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
"iterationId": "{string}",
"application": "{string}",
};
$.ajax({
url: "https://southcentralus.api.cognitive.microsoft.com/customvision/v1.0/Prediction/{projectId}/url?" + $.param(params),
beforeSend: function(xhrObj){
// Request headers
xhrObj.setRequestHeader("Content-Type","application/json");
xhrObj.setRequestHeader("Prediction-key","{subscription key}");
},
type: "POST",
// Request body
data: "{body}",
})
.done(function(data) {
alert("success");
})
.fail(function() {
alert("error");
});
});
</script>
</body>
</html>
解决方法之一是您可以尝试使用我的示例代码:
function readImage(element) {
var file = element.files[0];
var reader = new FileReader();
reader.onloadend = function() {
$.ajax({
url: "https://southcentralus.api.cognitive.microsoft.com/customvision/v1.1/Prediction/KEY/image?iterationId=ITERATIONID",
data: reader.result,
processData: false,
contentType: "application/octet-streama",
headers: {
'Prediction-key': 'YOUR-KEY'
},
type: 'POST',
success: function(response) {
var result = response["Predictions"];
alert(result);
},
error: function(error) {
alert('error: ' + error);
}
});
}
reader.readAsArrayBuffer(file);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
<input type="file" onchange="readImage(this)" />
</form>
<!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
"iterationId": "{string}",
"application": "{string}",
};
$.ajax({
url: "https://southcentralus.api.cognitive.microsoft.com/customvision/v1.0/Prediction/{projectId}/url?" + $.param(params),
beforeSend: function(xhrObj){
// Request headers
xhrObj.setRequestHeader("Content-Type","application/json");
xhrObj.setRequestHeader("Prediction-key","{subscription key}");
},
type: "POST",
// Request body
data: "{body}",
})
.done(function(data) {
alert("success");
})
.fail(function() {
alert("error");
});
});
</script>
</body>
</html>
解决方法之一是您可以尝试使用我的示例代码:
function readImage(element) {
var file = element.files[0];
var reader = new FileReader();
reader.onloadend = function() {
$.ajax({
url: "https://southcentralus.api.cognitive.microsoft.com/customvision/v1.1/Prediction/KEY/image?iterationId=ITERATIONID",
data: reader.result,
processData: false,
contentType: "application/octet-streama",
headers: {
'Prediction-key': 'YOUR-KEY'
},
type: 'POST',
success: function(response) {
var result = response["Predictions"];
alert(result);
},
error: function(error) {
alert('error: ' + error);
}
});
}
reader.readAsArrayBuffer(file);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<form>
<input type="file" onchange="readImage(this)" />
</form>