まだプログラマーですが何か?

プログラマーネタとアスリートネタ中心。たまに作成したウェブサービス関連の話も http://twitter.com/dotnsf

タグ:iphone

Web アプリでドラッグ&ドロップ(以下 DnD と表記)すること自体はできるようになりました。HTML5 では DnD できる要素が多く定義されていたり、HTML5 以前にも mouseup イベントや mousedown イベントをハンドリングすることで独自に実装することは可能でした。 

ただモバイル Web で、つまりスマホのウェブブラウザから DnD を行うことはまだ困難が伴います。そもそもスマホの小さい画面で DnD を行うことが使いやすいかどうか、という根本的な問題もあると思っていて、それが理由かどうかは定かではありませんが、HTML5 の DnD API の多くはスマホブラウザからは使えないことが多いようです。

そういった事情を理解した上で、それでも現状でどこまでできるだろうか? という観点で実現方法を考えて実装し、公開してみました:
https://dotnsf.github.io/mobile_dnd_sample/


上記 URL にスマホのブラウザでアクセスすると以下のような画面になります。4角の枠内に5枚の付箋が貼られているイメージです:
2019111701


各付箋は指でドラッグして位置を変えることができるようにしています。下図はピンクの「ハロー」と書かれた付箋をドラッグして位置を変更した後の様子です:
2019111702


また各付箋はダブルタップすると編集モードになり、書かれた文字を編集することができるようになります。「ハロー」を編集して「ハロー!」にしてみました:
2019111703


編集モードで「OK」をタップすると編集後の文字列が反映されます:
2019111704


付箋を削除する場合は、一度ダブルタップして編集モードにして、「DELETE」をタップします:
2019111705


確認後に削除されて元の画面に戻ります。「abc」と書かれていた付箋が削除されました:
2019111706


新しい付箋を追加する場合は「NEW」をタップし、編集モードで内容を入力します:
2019111707


そして「OK」をタップすると新しい付箋が追加されます。この付箋も同様にドラッグして位置を変えたり、再度編集して内容を変更することができます:
2019111708



一連の機能紹介は以上です。一応スマホのウェブブラウザでもドラッグ&ドロップによる UI が実現できました。サンプルでは全て JavaScript を使ってフロントエンドだけで実現していますが、データベースとのバックエンド連携を加えることで永続化なども実現できると思っています。

詳しくは後述のソースコードを参照いただきたいのですが、今回のサンプルでは HTML5 Canvas を使って、Canvas 内に付箋に相当するオブジェクトを描画して実現しています。Canvas 内の Touch イベントを監視してドラッグを処理しています。また編集モード画面は Bootstrap のモーダルダイアログを使っています。


ソースコードはこちらです。実態は index.html ファイル1つで、全ての HTML と JavaScript がこの中に含まれています:
https://github.com/dotnsf/mobile_dnd_sample



「iPhone でゲームボーイアドバンスのゲームがプレイできる」というフレコミの GBA4iOS というアプリのバージョン 2.0 がリリースされた、というニュースがありました。

いわゆる「エミュレータ」というやつで、ここでその是非についてコメントするつもりはありません。脱獄した iPhone 向けには以前から提供されていたもので、その意味では特別目新しいニュースでもありません。

が、今回ちょっと気になったのは、「脱獄不要である」という点です。脱獄不要ということは、そのアプリは App Store からダウンロードするということ? アップルがそんなアプリの審査通すの? と。

といった好奇心から、自分でもこのアプリをインストールしてみました。結論としては確かに iPhone にネイティブアプリとしてインストールできているようです。
2014022102


でも導入時に App Store は経由してません
。当たり前だよな、Apple がこんなの許可するわけがない。また(この機種に限ってはw)脱獄もしてません。 アプリ開発者が App Store を経由せずにテストアプリを導入する方法はあるんですが、その場合は電話番号とか iPhone の UDID とかを入力する面倒な手間があります。今回はそういうのも聞かれてないので、ちと違う気がする。 一体どういうこと?? どこからどんな仕組みでこのアプリはインストールされたんだ??


で、他の作業で VPN の設定とかをしていてふと気付いたのが、設定 - 一般 - プロファイル の中に「プロビジョニングプロファイル」として GBA4iOS という、そのまんまの名前のプロファイルが追加されていました。これは??
2014022101


・・・プロビジョニングプロファイルか、ああ、なるほど。分かった気がする。おそらく、以前にちょっと話題になった「iOS デベロッパーエンタープライズプログラムに抜け穴があった」という件に関係してるんだろう。

要は、自社とか特定の企業向けにアプリケーションを提供したい、という企業に対して、Apple はその企業専用のミニ App Store もどきを用意できるようにして、そこから特定ユーザーだけにアプリケーションをインストールさせる、というのが iOS デベロッパーエンタープライズプログラムです(詳しくはこちら)。そこにセキュリティホールというか抜け道があった、というものでした。それを応用(?)して制約なしに誰もがそのミニ App Store もどきを使えるようにしたんだろうな。 
念のため補足すると、このデベロッパーエンタープライズプログラムは契約時に利用条項に同意する必要があり、その中で不特定多数に向けてアプリを提供することは禁止されているので、Apple にすれば「契約違反」ということになるんでしょう。ただその抜け道の存在は想定外だったのだろうな、と。

その後もイタチごっこのような状況が続いていますが、今回の GBA4iOS 2.0 がリリースされた所をみると完全に防ぐのが難しい、ということなのかもしれません。



 

このページのトップヘ