Node.js
We're using axios to perform the POST request in this example so first run npm install axios to install the dependency.
Inferring on a Local Image
const axios = require("axios");
const fs = require("fs");
const image = fs.readFileSync("YOUR_IMAGE.jpg", {
encoding: "base64"
});
axios({
method: "POST",
url: "https://detect.roboflow.com/indian-traffic-signboards/1",
params: {
api_key: "API_KEY"
},
data: image,
headers: {
"Content-Type": "application/x-www-form-urlencoded"
}
})
.then(function(response) {
console.log(response.data);
})
.catch(function(error) {
console.log(error.message);
});
Inferring on an Image Hosted Elsewhere via URL
const axios = require("axios");
axios({
method: "POST",
url: "https://detect.roboflow.com/indian-traffic-signboards/1",
params: {
api_key: "API_KEY",
image: "IMAGE_URL"
}
})
.then(function(response) {
console.log(response.data);
})
.catch(function(error) {
console.log(error.message);
});
Front-End Web
Inferring on a Local Image in Browser
We have realtime on-device inference available via inferencejs; see the documentation here..
This will load your model to run realtime inference directly in your users' web-browser using WebGL instead of passing images to the server-side.
Inferring on a Local Image via API
Note: you shouldn't expose your Roboflow API key in the front-end to users outside of your organization.
This snippet should either use your users' API key (for example, if you're building model assisted labeling into your own labeling tool) or be put behind authentication so it's only usable by users who already have access to your Roboflow workspace.
import axios from 'axios';
const loadImageBase64 = (file) => {
return new Promise((resolve, reject) => {
const reader = new FileReader();
reader.readAsDataURL(file);
reader.onload = () => resolve(reader.result);
reader.onerror = (error) => reject(error);
});
}
const image = await loadImageBase64(fileData);
axios({
method: "POST",
url: "https://detect.roboflow.com/indian-traffic-signboards/1",
params: {
api_key: "API_KEY"
},
data: image,
headers: {
"Content-Type": "application/x-www-form-urlencoded"
}
})
.then(function(response) {
console.log(response.data);
})
.catch(function(error) {
console.log(error.message);
});