如何在 nativescript-vue 中正确设置对 Microsoft 自定义视觉 API 的 http 调用主体？

Question

我正在为学校项目创建一个微型应用程序。我正在使用本机脚本游乐场，这使得调试有点困难。我只是想拍一张照片，然后将其发送到自定义视觉 API 以预测图像是什么。我不确定如何正确设置带有图像的主体。

takePicture() {
    camera
        .takePicture({
            width: 120,
            height: 180,
            keepAspectRatio: true
        })
        .then(imageAsset => {
            this.pictureFromCamera = imageAsset;
            http.request({
                url: "https://southcentralus.api.cognitive.microsoft.com/customvision/v2.0/Prediction/key/image",
                method: "POST",
                headers: {
                    "Content-Type": "application/octet-stream",
                    "Prediction-Key": "key"
                },
                content: JSON.stringify({
                    Body: imageAsset
                })
            }).then(
                response => {
                    this.response = response.content.toJSON();
                    console.log("RESPONSE", this.response);
                },
                error => {
                    console.error("ERRRORR", error);
                }
            );
        })
        .catch(err => {
            console.log("Error -> " + err.message);
        });
    }
}

这是记录的响应：

[Galaxy S8+]: 'RESPONSE' { code: [Getter/Setter],
[Galaxy S8+]: message: [Getter/Setter],
[Galaxy S8+]: { value: [Circular],
[Galaxy S8+]: [__ob__]:
[Galaxy S8+]: dep: { id: 39, subs: [Object] },
[Galaxy S8+]: vmCount: 0 } }

Answer 1

您不能将图像资源字符串化。发送多部分数据的唯一方法是使用 nativescript-background-http 插件，默认的 http 模块不支持。

Answer 2

这就是我最后做的事情

takePicture() {
  camera
      .takePicture({
          width: 120,
          height: 180,
          keepAspectRatio: true
      })
      .then(picture => {
          this.pictureFromCamera = picture;
          const source = new imageSourceModule.ImageSource();
          source.fromAsset(picture).then(imageSource => {
              const folder = fileSystemModule.knownFolders
                  .documents()
                  .path;
              const fileName = "test.png";
              const path = fileSystemModule.path.join(
                  folder,
                  fileName
              );
              const picsaved = imageSource.saveToFile(
                  path, "png");
              if (picsaved) {
                  console.log("Saving");
                  var session = bghttp.session(
                      "image-upload");
                  var request = {
                      url: "https://southcentralus.api.cognitive.microsoft.com/customvision/v2.0/Prediction/key/image",
                      method: "POST",
                      headers: {
                          "Content-Type": "application/octet-stream",
                          "Prediction-Key": "key"
                      }
                  };
                  try {
                      var task = session.uploadFile(
                          path, request);
                  } catch (err) {
                      console.log(err);
                  }
                  task.on("responded", data => {
                      console.log("RESPONDED", data.data);
                  });
              } else {
                  console.log("Failed");
              }
          });
      })
      .catch(err => {
          console.log("Errorr -> " + err.message);
      });
}

如何在 nativescript-vue 中正确设置对 Microsoft 自定义视觉 API 的 http 调用主体？

How do I correctly set the body of an http call to the Microsoft custom vision API in nativescript-vue?

android

vue.js

nativescript

azure-cognitive-services