mBaaSにMonacaアプリから画像をアップロードしたい

Question

現在MonacaとmBaaS（ニフティ モバイルバックエンド）を使ってアプリ開発を行っております。

iPhone端末内に保存したJPEGデータがあり、そのURL（file:///〜〜〜/test.jpg）を使ってmBaaSへ画像アップロードをしたいと思い、公式ドキュメントを頼りに以下のようにコードを書きましたが、アップロードエラーになってしまいます。

端末内の画像URLから直接アップロードするにはどのようにしたら良いでしょうか？
よろしくお願いいたします。

    var ncmb = new NCMB("XXXXXX", "XXXXX"); // 正しいキーを入力済みです

    var onFormSend = function(){
      var fileName = 'test.jpg'; // ファイル名を指定
      var fileData = 'file:///~~/test.jpg'; // 端末内の画像ファイルへのURL
      
      alert(fileData);
      ncmb.File.upload(fileName, fileData)
        .then(function(res){
          // アップロード後処理
          alert('アップロードできました');
        })
        .catch(function(err){
          // エラー処理
          alert('アップロード失敗');
        });
    }

    onFormSend(); // アップロード実行

Answer 1

こちらのサイトのコードを参考にしまして、以下のコードを書いてみたところアップロードができるようになりました(この書き方が正解なのかは分かりません)。

これよりももっとシンプルに書くやり方があるのかも？しれませんのと、下記で「バイトデータ」とあるのはバイナリデータのこと？なのかもよく分かりませんので、知識おありの方いらっしゃいましたら教えて頂きましたら幸いです。

  var ncmb = new NCMB("XXXXXX", "XXXXX"); // 正しいキーを入力済みです

  // FileReaderで画像ファイルからBlobを取得、そのBlobをFileReader(ファイルオブジェクト)で読み込む  

  var onFormSend = function(){

    var file = 'file:///〜〜/test.jpg';

    // サーバー上の画像ファイルから、Ajaxを利用してバイトデータを取得する…ここではサーバーではなくローカルにあるファイルを指定
    var xhr = new XMLHttpRequest();
        xhr.open('GET', file, true);
        xhr.responseType = 'arraybuffer';
        xhr.onload = function(e) {

          // 画像ファイルのバイトデータを取得する
          var arrayBuffer = this.response;

          // バイトデータとコンテンツタイプからBlobを生成する
          var blob = new Blob([arrayBuffer]); // オリジナル：var blob = new Blob([arrayBuffer], {type: "image/png"});

          // FileReaderでBlobを読み取る
          var reader = new FileReader();
              reader.readAsDataURL(blob);

              // Blob読込後のイベント
              reader.onload = function(evt) {

                // アップロード処理
                var fileName = 'test.jpg'; // ここでファイル名を指定
                var fileData = blob;

                ncmb.File.upload(fileName, fileData)
                  .then(function(res){
                    // アップロード後処理
                    alert('アップロードできました');
                  })
                  .catch(function(err){
                    // エラー処理
                    alert('アップロード失敗');
                  });
              }
        };

        xhr.send();

  }

  onFormSend(); // アップロード実行