The program is throwing this 2 errors:
POST https://vision.googleapis.com/v1/images:annotate?key=APIKEY
EXCEPTION: Response with status: 400 OK for URL:
I did some research regarding this error is that if the enum return is OK for URL means that the URL is OK and return success
source: https://cloud.google.com/vision/docs/reference/rest/v1/Code
Before i add in the crop feature the API can work however it is throwing me the error here. I am not whether if i declare 2 service class inside a provider in app.components.ts is wrong?.The logic of the program is to take a picture of a list and then the program will bring the user to a crop page where user can crop the image and then the program will pass the image back to the camera.ts page where it will pass the image to the method getVision() which will POST the picture to googleAPI and console.log() the text inside the picture. Below are the codes
@Component({
templateUrl: 'app.html',
providers:[CameraService,TestService]
})
export class MyApp {
rootPage = TabsPage;
constructor(platform: Platform) {
platform.ready().then(() => {
StatusBar.styleDefault();
Splashscreen.hide();
});
}
}
testing-service.ts
@Injectable()
export class TestService {
apiKeys = {
cloudVision :'ApiKey',
};
apiUrls = {
cloudVision : 'https://vision.googleapis.com/v1/images:annotate?key=',
};
visionPostObj = {
requests : [
{
image : {
content : ''
},
features: {
type: 'TEXT_DETECTION',
maxResults: 1
}
}
]
};
static get parameters() {
return [[Http]];
}
constructor(private http: Http) {
console.log('Hello CameraService Provider');
}
getVisionLabels( image : string){
let url = this.apiUrls.cloudVision + this.apiKeys.cloudVision;
let post = this.visionPostObj;
post.requests[0].image.content = image;
return this.http.post(url, post).map( (res) => res.json());
}
camera.ts
constructor(public navCtrl: NavController, public navParams: NavParams,public testService: TestService,public cameraService: CameraService,public toastCtrl: ToastController) {
}
addPhoto(){
this.cameraService.getImage(this.width,this.height,this.quality)
.subscribe( (data) => {
this.image = data;
this.getVision(this.image);
//console.log(this.image);
},(error) => {
// Toast errot and return DEFAULT_PHOTO from Constants
this.toast(error);
}
);
}
toast(message: string) {
let toast = this.toastCtrl.create({
message: message,
duration: 2500,
showCloseButton: false
});
toast.present();
}
getVision(image64: string) {
this.testService.getVisionLabels(image64)
.subscribe((sub) => {
this.labels = sub.responses[0].textAnnotations;
this.getText();
});
}
getText() {
this.labels.forEach((label) => {
let translation = {search: label.description, result: ''};
console.log(label.description);
});
}
}
