MixJuice 向けコンテンツの作成と公開


HTML などを公開できる Web サーバに MixJuice で参照・ダウンロードできるようコンテンツを公開する手順です。

 

単にプログラムを公開する目的であれば、Kidspod; で容易にアップロード・公開が可能です。

公開用にサーバを用意する必要もありません。

 

MixJuiceでKidspod;と通信しよう! | Kidspod;

 

IchigonQuest は MicJack を用いる事で Kidspod; のアップロード・ダウンロードに対応しています。

 

MixJuice/MicJack


MixJuice コンテンツ公開サーバ

汎用的な Web サーバを用います。HTML・画像 などをファイル単位で公開できるサーバであればどの環境でも構いません。

Web サイトをブラウザやアプリから生成・編集できる Google サイト・Jimdo・wix・Webnode などは

特定のテキスト(HTML)のみを出力できないため、適していません。

無料レンタルサーバの場合、広告を付加する場合があり、
MixJuice ではこれが多くのタグ出力になり、まともに使えない状態となる事があります。

 

アドレスが手入力になるため、できるだけアドレスが短くわかりやすくなる環境が理想的です。

これには独自ドメインが効果的ですが、ドメイン費用を別途要する問題があります。

 

現在サーバは常時 SSL の対応が行われています。今後を考えると常時 SSL 対応済みのサーバがおすすめです。
世界規模で提供され、利用者もいるサーバは、ほぼ常時 SSL 対応を終えていますが、

一般的なレンタルサーバでは無料提供での常時 SSL 対応が遅れている状況です。

公開アドレスは完全に https://~ となる場合、MixJuice では GETS・POSTS での参照になりますが、

MixJuice 1.2.2 または MicJack に更新しないと参照できない場合があります。

 

MixJuice 1.2.1 以前で参照できないのを確認できているサーバは次のとおりです。

MixJuice を最新版へ更新するか、MicJack に更新する事で参照できます。(2018年11月現在)

サーバ・サービス名 割当 URL(+独自ドメイン) 補足
Firebase Hosting ~.firebaseapp.com Google App Engine(~.appspot.com)は正常に参照可
GitHub Pages ~.github.io Force SSL を無効にできる場合は無効にして参照可
Microsoft Azure App Service ~.azurewebsites.net Azure Blog ストレージ(~.web.core.windows.net)は下記参照
Netlify ~.netlify.com  
ZEIT Now ~.now.sh  

 

サーバの対応状況により変化するため、他のサーバも後に参照できなくなる恐れがあります。

(Netlify は 2018 年春頃 MixJuice 1.2.1 でも GETS・POSTS で正常に参照できていました)

 

MixJuice 1.2.2 および MicJack でも参照できない・表示がおかしくなるのを確認できているサーバは次のとおりです。

現在のところ、これらのサーバで MixJuice コンテンツを公開しないで下さい。(2018年11月現在)

サーバ・サービス名 割当 URL(+独自ドメイン) 補足
DriveHQ FirstCloudIT ~.firstcloudit.com  
Microsoft Azure Blob ストレージ ~.web.core.windows.net Azure App Service(~.azurewebsites.net)は上記参照

 

また、html・txt 等のテキストファイルによる拡張子で gzip 圧縮を行うために、MixJuice では文字化けする場合があります。

次のサーバで自動的に gzip 圧縮を適用する事が確認できています。

回避策として拡張子を付けないファイル名にしてバイナリーファイル扱いにする事で gzip 圧縮を回避できます。

 

パソコン等の Web ブラウザでは正常でも MixJuice で文字化けする場合もありますので、
コンテンツ構築前に MixJuice で正常に表示されるかテストする事をおすすめします。

 

運営者が SSL(GETS・POSTS)対応済みで無料で使用できるサーバを中心に
(一部課金クラウドサービスの無料枠で使用しています)

MixJuice 参照テストを行えるプログラムを公開しています。

 

MixJuice SSL テスト(MixJuice+BASIC)| Kidspod;


GET・GETS コマンドと URL

http:// を外した URL が GET コマンドで含めます。
? 以降のパラメータもそのまま含める事が可能です。ただし文字コードに注意を要します。

  • http://fu-sen.github.io/mj/program/index.html
    → ?"MJ GET fu-sen.github.io/mj/program/index.html (IchigoJam BASIC)
    → echo MJ GET fu-sen.github.io/mj/program/index.html> uart;cat uart  (IchigoLatte)

もし SSL を含めた URL https:// の場合は代わりに GETS コマンドにして下さい。

  • fu-sen.github,io/mj/program/index.html
    → ?"MJ GETS fu-sen.github.io/mj/program/index.html (IchigoJam BASIC)
    → echo MJ GETS fu-sen.github.io/mj/program/index.html> uart;cat uart (IchigoLatte)

パラメータが多い場合、IchigoJam からデータを送出する前提の場合は POST・POSTS を用いる事になります。

現在のところ、Kidspod; のプログラム投稿で POST が使われています。


コンテンツの内容

サンプル MixJuice コンテンツソースを GitHub で公開しました。
GitHub Pages が有効のため、MixJuice で参照しながらソースと照らし合わせて参照してみて下さい。

 

fu-sen/mj | GitHub - MixJuice コンテンツ サンプル

 

IchigoJam BASIC と IchigoLatte で考慮すべき内容が異なります。

 

IchigoJam BASIC

記載内容がそのまま IchigoJam で受け取られます。これはシリアルで受信している状態に同等です。

  • 行番号がなければダイレクトモードでの動作になります。CLS・NEW などを実行できます。
  • 行番号があれば、それはプログラムの入力になります。そのままプログラムを転送できます。
  • 単に文字列を表示させたい場合は行頭に ' を付けて下さい。IchigoJam BASIC ではコメント文の扱いとなり、これを無視します。

IchigoJam のカナはシフト JIS(Shift_JIS)の半角カナに共通します。

そのため文字コード Shift_JIS で制作するとカナを使用できます。

 

IchigoJam BASIC 1.1 以降では CLS・LOCALE・SCROLL で特定のコントロールコードをシリアルに送出します。

MixJuice は通常これらを無視しますが、
例えば CLS 直後の PRINT"MJ〜 は CLS のコントロールコードによってコマンドを処理しない場合があります。

PRINT で改行させて CLS のコントロールコードを飛ばすか、UART コマンドを用いて送出しないように設定して下さい。

 

IchigoLatte

echo MJ GET(S) アドレス>uart;cat uart >. でファイル内容は丸ごとエディタへ入ります。

プログラムとして実行されるべきでない内容は行頭を // にしてコメント化して下さい。

 

IchigoLatte の改行コードは LF です。CR+LF でも実行はできますが、CR コードは ■ で表示されます。

終了時に Ctrl+D(16進数コード 04)を入れるとコマンドを終了させ、lash へ戻す事ができます。

 

IchigoLatte の ひらがな はシフト JIS(Shift_JIS)の半角カナに共通します。

そのため文字コード Shift_JIS で制作すると ひらがな を使用できます。

ただし Ichigolatte では かな の手入力が容易ではない事にご注意下さい。

 

ファイルの作成・編集

MixJuice コンテンツ向けのファイル製作におすすめの方法は
IJUtilities を用いて製作・編集する方法です。

IchigoJam BASIC 各バージョンと IchigoLatte のフォントに対応し、

直接編集ができ、実際の表示と同じ表示で編集ができます。

更に固有のキャラクターコードも簡単に入力できます。

 

IJUtilities

 

通常のテキストエディタを用いる場合、

#20~#7F は通常の ASCII コードに共通します。

(最新 OS では #5C は半角 \ で、UTF-8 に共通しています。
 Shift_JIS は半角 ¥ です)

また IchigoJam BASIC のカタカナ、IchigoLatte のひらがなは

Shift_JIS の半角カナに共通しています。

#00~#1F の一部はコントロールコードとして使われ、

そうでない場合も IchigoJam BASIC 1.1 以前・1.2 以降で

表示が異なるため、使用をおすすめしません。

 

特定のキャラクターコードをすでに含めたファイルを編集する場合、

通常のテキストエディタでは

キャラクターコードを変換させてしまう場合があります。

IJUtilities からファイルを開いて編集するか、

バイナリーエディタを用いて編集をして下さい。

 

テキストアートをしたい場合、次のツールを用いて制作し、
IJUtilities で出力内容を出しながら IchigoJam BASIC で実行させて一度ファイル保存し、
ファイルを開き直して行頭 ' の追加・行末空白の削除などを微調整する方法もあります。

IchigoJam用画像コンバータを使用する場合、

IchigoJam BASIC 向けでは通常一番左に ' を入れる必要があるため、1 文字分空けておく必要があります。

また 1 行毎に改行するのがおすすめです。そのためには右にも 1 文字必要です。

従って左右 1 文字分(2 ピクセル)を空けた横幅 30 文字(60 ピクセル)で作成するのが理想です。


ファイル名とアドレス

Content-Type は無視されます。そのため、拡張子を .txt にしておく必要はありません。

例えばアドレスを省略する目的で index.html を用いる事も可能です。

index.html などでアドレスを省略する場合、コマンド送出するアドレスは / で終わらせて下さい。

/ を省略するとエラーになります。 (下のとおり、この場合 Web サーバは redirect 処理を発生させます)

ただし MicJack は / を省略しても参照可能です。

  • ?"MJ GETS 15jam.netlify.com/index.html
    → ?"MJ GETS 15jam.netlify.com/ → 参照可能
    → ?"MJ GETS 15jam.netlify.com → MixJuice はエラー・MicJack は参照可能

プログラムからアドレスを渡す

プログラムから特定のアドレスで転送させたい場合、

IchigoJam BASIC では PRINT で GET または GETS コマンドを送り、直後に END とします。

 

1000 ?"MJ GET (アドレス)":END

 

この GET・GETS コマンドを MixJuice は認識します。


動的コンテンツ生成

PHP・Perl・Ruby・Python などの動的コンテンツも使用できます。出力がテキストになっていれば良いです。

必ず Content-Type を出力させる必要がある場合は Content-Type: text/plain にすると良いでしょう。

 

サーバから特定の値を IchigoJam へ渡す

特定の数値を複数個渡す場合、サーバは数値を改行区切りにして出力すると、
IchigoJam BASIC のプログラムはその行数の INPUT を実行する事によって変数・配列に入れる事ができます。

 

日時を出力するサーバ側の PHP datetime.php

左の datetime.php を実行した出力結果例

2016

5

29

13

24

各行末尾には改行コードが含まれます


MixJuice 経由で得る IchigoJam BASIC プログラム

左のプログラムを MixJuice+IchigoJam で実行した例

※ PHP の date("i") は 0 を含めた 2 桁にしますが、

  IchigoJam はこの場合でも正常に処理します。


古籏一浩さんが MixJuice 向けの日時データをサーバ公開しています。

このサーバを用いる事で IchigoJam BASIC プログラムのみで同等の動作を実現可能です。

 

IchigoJam + MixJuice用 日付&時間データ | IchigoJamを楽しもう

 

文字列を取得したい場合は LOCATE で位置決めしておく事で VPEEK・SCR や 1.2 より対応している文字列コマンドで取得できます。

 

プログラムをサーバへ送る

次のコマンドで現在存在しているプログラムをサーバへ送る事ができます。
サーバは動的に処理する必要があります。

 

?"MJ POSTS START サーバ.name/実行プログラム.ext":LIST:?"MJ POSTS END (IchigoJam BASIC)

?"MJ POSTS START 15_jam.com/upload.php":LIST:?"MJ POSTS END (例-実在しません)

 

echo MJ POSTS START サーバ.name/実行プログラム.ext> uart:cat . > uart:echo MJ POSTS END> uart (IchigoLatte)

echo MJ POSTS START 15_jam.com/upload.php> uart:cat . > uart:echo MJ POSTS END> uart (例-実在しません)
サーバからレスポンスが得られる場合は ;cat uart を末尾に加えて下さい。

 

POST メソッドで送られますが、パラメータは付いていません。
そのためサーバ側のプログラムでは標準入力(stdin)で渡したデータ全体を取り込む必要があります。

例えば PHP の場合は $_POST ・ $_REQUEST を用いるのではなく、php://input で取り出します。

 

PHP のサンプルプログラム - IchigoJam BASIC 向け。IchigoLatte では一部修正が必要です。


Not Found の処理

Not Found(http ステータス 404)で特定のファイルを表示できるようにできる場合、

通常は HTML を出力するため、余計なタグが表示されてしまうため、
Not Found 向けのコンテンツ表示も生成しておく事をおすすめします。

404.html が多いです。最低限次の 1 行だけを入れたファイルで構いません。

 

'Not Found

 

末尾に改行を入れて下さい。

 

頭に ' があるのは、IchigoJam BASIC の考慮ですが、IchigoLatte で出力しても問題はありません。 


転送(IchigoJam BASIC)

MixJuice は Location・redirect(http ステータス 301・302)を処理できません。

エラーコードを返すか、転送を促す HTML が表示されます。

このため、Web サイト向けの短縮 URL(bit.ly など)は使用できません。

 

http ステータス 301・302 で特定のファイルを表示できる場合、

引っ越しした際のトップページ(通常 index.html)で転送処理したい場合は

単に GET または GETS コマンドを出力します。
通常は IchigoJam BASIC 向けに PRINT または ? を含めます。

 

?"MJ GET (転送先アドレス)

 

または

 

?"MJ GETS (転送先アドレス)

 

この 1 行を入れておくだけです。改行を出力する事でコマンドは自動実行されます。


User Agent

MixJuice は User Agent(HTTP_USER_AGENT)の値を次の内容にします。

 

MixJuice-バージョン

MixJuice-1.2.2

 

これは MixJuice 以外の環境から実行するのを防止し、MixJuice 専用に処理するために有効です。

特にネットからサーバ処理するプログラムの場合、他の環境から意図しない実行を受けてプログラムを悪用されないよう

セキュリティ対策として User Agent による MixJuice の判別は行って下さい。

 

MicJack はバージョンによって異なります。

MicJack 1.0.0b5 までは対応している MixJuice バージョンで返します。MicJack のバージョンは含めません。

 

MixJuice-互換元バージョン

MixJuice-1.2.2

 

MicJack 1.0.1b1 より MicJack バージョンも含めるようになりました。

 

MixJuice-互換元バージョン MicJack-バージョン

MixJuice-1.2.2 MicJack-1.0.1b1

 

この仕様により、MicJack 文字列の有無で MicJack の使用を判別できるようになりました。


その他ヒント

IchigoJam 向けのコンテンツで最後の行をコマンドにする場合、改行の有無で動作が変わってきます。

  • 改行あり = そのコマンドが自動的に実行されます。
  • 改行なし = 末尾でカーソルが停止します。コマンドの末尾に追記して入力させたり、Enter(return) 待ちが可能です。

無料ホームページスペースなどでは拡張子が制限されています。その場合は末尾の入力を INPUT で受け付けします。
.html や .txt の拡張子であれば多くのホームページスペースは問題なく使用できるでしょう。

 

INPUT N:?"MJ GETS web_site.com/";N;".html

 

IchigoJam BASIC では、上の場合、例えば 1 を入力すれば、1.html を参照できます。
N*100 として 100.html を読み込む、という処理も可能です。

INPUT は数字なので、未入力は 0 が返ります。 

 

無料ホームページスペースの一部は広告を含めますが、
HTML タグの存在しない MixJuice では広告タグが入らない場合があります。

(例えば <body> や </body> を確認し、その前後に広告タグを加えるように処理しています)

 

MixJuice は Content-Type を無視して表示します。
拡張子 .txt にする必要はなく、.html などでも構いませんし、拡張子をなくせはアドレスが短くなります。

 

MixJuice で IchigoJam BASIC へ転送する場合、必ずしもプログラムにする必要がありません。

ダイレクトモードでコマンドを実行可能です。

これによって IchigoJam BASIC のプログラム容量に制限されず処理を行えます。

 

簡単な処理を行えるコマンド・プログラムは Kidspod; で公開するのも手です。 

代わりに Pastebin も使用できますが、

Pastebin.com は末尾の改行をカットするため、最後のコマンド・行が入らない問題が発生します。

また GitHub Gist なども含めて、ランダムな文字列を含む URL になるため、手入力が難しくなります。

 

多くのサーバは UNIX 系で運用されています。これらの OS はファイル名の大文字・小文字を区別します。

一方 Windows・macOS は大文字・小文字の区別がありません。
(macOS はファイルシステム hfs+ によって区別するようにも可能です)

ローカルサーバによる動作確認を行った際など、ファイル名による動作の違いにご注意下さい。