I am using the Ionic Native Camera plugin to take a picture and save it in base64.
Then I want to send that image to Amazon s3 to store.
I send a package via POST to my API containing the base64 image, bucketname, keyname, etc.
Before http sends the data to my server I get a warning in my console saying: "WARNING: sanitizing unsafe URL value data:image/jpeg;base64"
I did some research and found that Angular sanitizes urls because they might contain XSS that could be harmful to the recipient.
Since I know my URLs will be clean, I imported DomSanitizer and used "bypassSecurityTrustUrl" on the image before sending.
I am still getting the same error message as before.
Is there anyway to disable this for outbound HTTP posts? I would still like to keep it for incoming data.
Here is image service code...
import { Injectable } from '@angular/core';
import { Http, Response } from '@angular/http';
import { DomSanitizer } from '@angular/platform-browser';
@Injectable()
export class ImageService {
constructor(
private http: Http,
private sanitizer: DomSanitizer
) {}
uploadProfileImage(userInfo, image) {
return new Promise(resolve => {
let pkg = {
image: this.sanitizer.bypassSecurityTrustUrl(image),
name: userInfo.uid,
folder: 'profileImages',
email: userInfo.email
}
console.log('pkg upload profile image', JSON.stringify(pkg));
this.http.post('https://myurl/api/uploadpicture', pkg)
.subscribe( res => console.log('response from upload picture', JSON.stringify(res)));
})
}
}
When I console log 'pkg upload profile image', the image value looks like this
{"image":{"changingThisBreaksApplicationSecurity":"data:image/jpeg;base64,file:///var/mobile/Containers/Data/Application/xxxxxxxxxx/tmp/cdv_photo_007.jpg"},
My response from Amazon S3 is fine, a file is posted in the correct bucket with the correct key name, but the image is corrupted and only ~80 bytes.
I would really appreciate some help, this was working fine on my Ionic 1 app using Angular 1.x.
Thanks