概要

obnizでArducam Miniを使った遠隔監視カメラを作ろうとしたが，Arducam Miniのバージョンの違いで，そのままでは動かなかった．
カメラモジュールの基板下部にMini-2MP-Plus等と書かれているものはArduCAM-Mini-2MP-Plusという新しいバージョンであり，obnizのcam.takeWait()で取得した画像データの配列の最初に0xFFを追加する必要がある．

index.js

  const data = await cam.takeWait('1024x768');
  data.unshift(255); //配列の最初に0xFFを追加する
  console.log("image size = " + data.length + " bytes");
  const base64 = cam.arrayToBase64(data);
  document.getElementById("image").src = "data:image/jpeg;base64, " + base64;

これは，オリジナルのArduCAM-Mini-2MPでは先頭1バイトは無効なデータのため読み飛ばす必要があったが，2MP-Plusでは先頭から有効なデータが出力されるという変更があり，obniz パーツライブラリはオリジナル版に基いて作成されているためだと思われる．

ArducamをAmazonで注文したらPlus版が届いた

外部から家の様子を遠隔監視しつつ，室内のスイッチを遠隔操作できるものを簡単に作りたいと思い，obniz公式にパーツライブラリが用意されている，Arducam MiniをAmazonで購入したのですが，そのままobnizのサンプルを動かしても画像が表示されなかったので，解決までの道のりを記しておきます．

obniz公式パーツライブラリのArduCAMMiniのページではスイッチサイエンスでのArducam Miniモジュール（2メガピクセル）商品ページへのリンクが貼られていますが，私はAmazonでも同様の商品を見つけ，そちらで購入しました．

Arducam Arduino UNO Mega2560ボード用OV2640 2メガピクセルレンズ付きミニモジュールカメラシールド

早速obnizに繋いで動作確認をしようとしたものの，obniz公式パーツライブラリのArduCAMMiniのページのサンプルを動かしても，データは送られてきてはいるものの，画像が正しく表示されません．

Arducam公式サイト等で調べてみると，AmazonやArducam公式サイトにある写真の通り，どうやら手に入れたものは新しいバージョンのArduCAM-Mini-2MP-Plusのようでした．

Arducamオリジナル版とPlus版の違い

オリジナル版とPlus版の違いは，以下のサイトに記載されていました．
http://indoor.lolipop.jp/IndoorCorgiElec/ESP-SensorCam.php

(2) ArduCAM-Mini-2MPにおいてSPIで画像を読み出す際に、先頭1バイトは無効なデータのため読み飛ばす必要がありました。 2MP-Plusでは先頭から有効なデータが出力されるため、読み飛ばす必要はありません。

Arducam公式のソフトウェアアプリケーションノートでは，5.5節 "Burst Read Operation" に，この違いについて詳しく説明されています．
obniz公式ライブラリのソースを参照すると，確かにこのモードが使用されていました．

#JPEGのヘッダー
obnizパーツライブラリではオリジナル版に適応して作られているようで，先頭1バイトを読み飛ばす処理が含まれているようです．

では逆に失われた先頭１バイトを配列の最初に追加すればよいのですが，JPEGファイルのヘッダーはFFD8とのことなので，最初の１バイトに0xFFを追加すればよいことが分かります．

Arducam Mini 2MP camera module is obsolete the official demo seem not work with the new Arducam Mini 2MP Plus camera

解決策

cam.takeWait()したデータにunshift(255)すれば良いだけでした．

index.html

<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script src="https://obniz.io/js/jquery-3.2.1.min.js"></script>
<script src="https://unpkg.com/obniz@latest/obniz.js"></script>
</head>
<body>

<div id="obniz-debug"></div>
<img id="image">

<script>
var obniz = new Obniz("OBNIZ_ID_HERE");
obniz.onconnect = async function () {
  obniz.io11.output(true);
  var cam = obniz.wired("ArduCAMMini", { cs:0, mosi:1, miso:2, sclk:3, gnd:4, vcc:5, sda:6, scl:7 });
  await cam.startupWait();
  const data = await cam.takeWait('1024x768');
  data.unshift(255); //配列の最初に0xFFを追加する
  console.log("image size = " + data.length + " bytes");

  const base64 = cam.arrayToBase64(data);
  document.getElementById("image").src = "data:image/jpeg;base64, " + base64;
}
</script>
</body>
</html>