Base 64 图像到 ocr.space API Ionic 2

Question

我正在尝试将 base 64 Jpeg 发送到 API 以进行 OCR 分析。

保存图片的代码在这里：

takePicture() {
    Camera.getPicture({
        destinationType: Camera.DestinationType.DATA_URL,
        targetWidth: 1000,
        targetHeight: 1000,
        encodingType: Camera.EncodingType.JPEG,
        sourceType: Camera.PictureSourceType.CAMERA,
        allowEdit:true }).then((imageData)=>{
        this.base64Image = "data:image/jpeg;base64," + imageData;
    });
 }

但是我确信这一切都很好，因为复制 base 64 字符串并通过邮递员发送工作正常。

这就是我将字符串发送到 API 的方式。

post(val) {
    let headers = new Headers();
    headers.append('Content-Type', 'application/x-www-form-urlencoded; charset=UTF-8');
    headers.append('apikey', 'APIKEY');

    let data = 'base64Image=' + val;
    console.log(data);
    return this.http.post('http://api.ocr.space/parse/image', data, {headers: headers})
        .map(response => response.json());
}

将 base 64 字符串传递给 val 变量。

给出的错误是："Not a valid base64 image. The accepted base64 image format is 'data:image/;base64,'."

奇怪的是它在 postman 中工作正常....任何人都可以发现我做错了什么吗？

Answer 1

问题在于您如何发送数据。如果您查看 Postman collection 和 API 调用示例，您会看到 base64image 被发送为 form-data。

但是，如this SO answer所述，

When we want to post the value as a FORM post, we need to change the serialization algorithm and post the data with the content-type, "application/x-www-form-urlencoded".

所以这段代码应该可以工作：

var headers = {
  'Content-Type': 'application/x-www-form-urlencoded',
  'apikey': 'helloworld'
};
var data = {
  'base64image': 'data:image/png;base64,iVBORw0KGgoAAAANS...'
}

$http({
    method: 'POST',
    url: 'http://api.ocr.space/parse/image',
    headers: headers,
    data: data,
    transformRequest: function(obj) {
      var str = [];
      for (var p in obj)
        str.push(encodeURIComponent(p) + "=" + encodeURIComponent(obj[p]));
      return str.join("&");
    },
  })

工作演示：http://plnkr.co/edit/aPO4UGng7uaMbIqrzc7J

Base 64 图像到 ocr.space API Ionic 2

Base 64 Image to ocr.space API Ionic 2

ocr

post

angularjs

angular-http

ionic2