世界最悪のコードはJavaScriptで書かれたログイン実装コード

バグのないプログラムはありません。
そのような中で、世界最悪のプログラミングコードは何でしょうか?
非常に興味深い問題です。今回は、これまで世の中で実装されてきたコードの中で、史上最悪の実装とはなにか?というテーマでお送りしたいと思います。

Nullの存在を考え直す

一つ目の史上最悪の実装に、Nullの存在があります。/dev/nullは、「何もない」に吸い込まれていくものです。/dev/nullは、もはや当たり前過ぎて、最悪の実装だといわれても、ピンとこないかもしれません。

この/dev/null。その後にNull Pointer Exceptionやnilへと継承され、数多くのプログラミング言語で機能が実装されました。つまり、結果として重大なバグを引き起こしているのです。

計算機学者のトニー・ホーアさんが、Nullを1965年に初めて開発・実装したのですが、彼は後にこれを「My billion-dollar mistake(私の大きなミス)」と表現しています。

NullはOSにすら実装されていますから、開発の現場では当然ながら受け入れられているものです。しかし、初心者プログラマの頃、Null Pointer Exceptionにつまずいた方もいらっしゃるのではないでしょうか。ポインタが初期化されておらず、メモリが使えないことを意味します。これは、Javaで特にひっかかりがちな点で、Javaはメモリ管理をJVMが行っているため、メモリがどうなっているかはみえません。そして、ポインタの概念もみえなくなっています。しかし、Nullの例外は存在します。

初心者の頃はこれが理解できない、もしくは、初心者に指導する上で、結局はJVMの動きやメモリ管理を説明しなければならないので、大きな工数がかかってしまいます。

しかしNullがよくない!といわれても、もう歴史は巻き戻りませんから、私たちはNullと付き合っていくしかないのです。

史上最悪のログイン実装コード

二つ目の史上最悪の実装としては、JavaScriptでのこのログイン処理が挙げられるのではないでしょうか。redditに投稿されたスレッドによると、イントラネットで驚愕のコードが実装されたようです。なんと、クライアントサイドで動くJavaScriptにおいて、1500人分のパスワードをデータベースサーバから引っ張ってきて、入力されたパスワードとひとつひとつ、つきあわせて、ユーザーネームとパスワードが一致しているか確認しているというものです。

ただし、これはイントラネット上のものなので、世間に広く公開されているコードではありません。それにしても、あまりにおかしい点がありすぎるので、発見したNZ在住のプログラマがツイッターに投稿し、インターネットユーザーを震撼させたものです。

このコードはなんと、クライアントサイドでSQL文を作ることができてしまうのです。なぜなら、JavaScript内で「SELECT * FROM users」とやっているからです。つまり、個人情報を全部取得してきているということです。任意のSQL文をクライアントから送ることができれば、もうデータベースは操作し放題になってしまいます。

おかしいのはそれだけではありません。Redditの掲示板には「I like the “true” === “true” part(trueをtrueと比較しているところが好きだね)」「something about if (“true” === “true”) speaks to me on a spiritual level(true と true の比較は、魂のレベルで語りかけてくるね)」など、皮肉が並びます。もはや、どこから指摘してよいかわからないレベルの最悪コードですが、とにかくみなさん、この「if (“true” === “true”)」の比較がお気に入りのようです。

しかも、興味深いことに「==(等価演算子)」ではなく「===(厳密等価演算子)」で比較しているところが、このコードの謎を深めています。

また、JavaScriptだけでなく、===でパスワードを比較しているということは、そもそもデータベース上でパスワードを暗号化せずに、平文でパスワードを保存していることとなり、設計そのものが、かなり雑に作られていることとなります。

ログイン実装は、クライアントサイドでは行わない

JavaScriptは、ユーザが入力したデータを成形してサーバサイドに送ったり、ブラウザをきれいに整えてユーザビリティを高めたり、そうしたクライアントサイドの動きを処理するものです。

よって、データの照合や、ましてやパスワードを全件取得してクライアントサイドで一件ずつ比較、などといった実装は行いません。また、パスワードを平文で送るというのは、重大な問題です。パスワードは、暗号化しなければなりません。そしてサーバに送って、サーバサイドでログイン処理を行います。そうしないと、cookieをもたせてログイン情報を処理することができなくなってしまいます。

今回のコードは、史上最悪のコードで、cookieに渡しているように見えて、cookieという構造体にyesを入れているだけという恐ろしいコードでもあります。ハッキングできる・できないという問題の前に、イントラネットですから、組織内でコードが書かれたこととなります。こうしたJavaScriptコードを平気で実装してしまうということは、教育体制に問題があったのかもしれません。

きれいなコードを書くにはどうしたら?

史上最悪のコード。自信があるプログラマなら、「I like this code」と笑っていれば済む問題です。しかし、フリーランスエンジニアのうち、駆け出しの人にとっては他人事ではないのではないでしょうか。

では、コードを美しく、高い品質を保って書くにはどうしたらよいのでしょうか。一つの方法はやはり、良質のコーディング例をたくさん知ることです。

そのためには、とにかくいろいろな人のコードをみて、特に上級者のコードから学ぶことが重要です。インターネット上のコードは、良くも悪くも品質がバラバラなので、本で学ぶことがおすすめです。

ついつい、Google検索して、てっとりばやいコードをコピーしてしまいがちです。しかし、インターネット上のコードではなく、本にしましょう。検索がしたいのであれば、Kindle本で買って、自分で別途、どのKindleにどのテーマが書かれているかインデックス表を実装すると、書庫の整理になります。

JavaScriptでは最高のコードも書ける

そんなJavaScriptですが、最悪のコードが実装できると同時に、素晴らしいコードを書いて、ユーザの利便性を大きく高めることもできます。それが、Ajaxで、Ajaxはブラウザの操作をよりパワフルにできます。

Ajaxは、非同期通信となります。そもそも、ブラウザの処理は、ページの情報をhttpリクエストにしてサーバに通信し、httpレスポンスが戻ってくるまで、ブラウザ上は白くなってしまいます。ブラウザと同期しているため、画面の処理が止まってしまうのです。

しかし非同期通信は、ブラウザの動き、つまりユーザの操作とリクエストが同期していませんので、一部だけのデータを切り取って送信し、ブラウザをユーザが動かしている最中に、ブラウザ上でデータ通信が行われるということです。

Ajaxは取り立てて新しい機能というわけではなく、2005年頃、登場した技術です。いちはやく導入したのがGoogleで、Google Mapが、ポインティングデバイスで触れるだけで動くのは、このAjaxを使って実装しているからです。

Google Mapは、もう日常生活に取り込まれていることだろうと思います。あのなめらかな操作感覚が、Ajaxによって実装できるようになったのです。

JavaScript、無限の可能性

JavaScriptは、登場時こそブラウザを操作する単純かつシンプルなプログラムでした。しかし、サービスの発展にしたがって、さまざまなクライアントサービスだけでなく、サーバサイドプログラムも実装できるようになってきたのです。

たとえば、Cordovaを使って、ハイブリッドアプリを開発することもできますし、React Nativeを使用して、よりネイティブレベルに近い、スピード感あふれるモバイルアプリを実装することもできます。

JavaScriptは、10年ほど前までは、単にブラウザ上でユーザアクションに反応するだけの言語と考えられていましたが、サーバサイドを記述できるようになり、また同時にネイティブアプリも書けて、さらにはブラウザの非同期通信までできるようになったのです。

JavaScriptを書いて暮らしたいと思ったら?

JavaScriptは、そのファンも多いプログラミング言語です。なぜなら、インタプリタ型で早く、さらに(とりあえずは)停止せずに実行するので、書きやすいといった特徴があります。

ただし、当然かと思われるかもしれませんが、JavaScriptだけ書けても、サイトもウェブサービスも完成しません。データベースも必要ですし、Webサーバ、そしてクライアントサイドにはHTMLとCSSやXMLが必要です。

JavaScriptだけ書いて暮らすというのは極めて困難になりますが、それでも、JavaScriptが好きなのであれば、クライアントサイドのエンジニア、つまりフロントエンドエンジニアとして生活していく方法はたくさんあります。

スキルを積めばフリーランスのJavaScriptエンジニアになることも、不可能ではありません。フロントエンドの仕事は、サーバサイドのバックエンドエンジニアに比べて、クラウドなどの流れに翻弄されない分、ながく仕事があると考えられます。

実際、この20年でサーバサイドは大きく代わりましたが、フロントサイドはJavaScript、HTML、CSSと、まったく変化してないのです。もちろん細かいバージョンアップはありますが、今後も大きな変化はないものと考えられます。

ぜひ、JavaScriptで仕事してみてください。

おすすめ案件

フリーランスエンジニアの案件をお探しします!
上記案件のほか、非公開の案件も多数あります