カテゴリー: テクノロジー

ちょっとしたときのSQLite

今年こそは絶対焼かない!
毎年そう意気込んでみるものの今年も見事に市民プール焼けしているマエダです。
 
全然最新技術調査でもないのですがSQLiteってちょっとしたときに便利だなと思いますのでご紹介です。
 
「SQLite」で検索すると白地に英語テキストとロゴ画像が無造作に羅列されたロックでクールなサイトが確認できます。
https://www.sqlite.org/

 
Ubuntuでの簡単な使い方。
 
sudo apt-get install sqlite3 libsqlite3-dev
sqlite3 testdb.sqlite3
 
以上。
 
 
 
え!?簡単すぎてイミフですって!?
 
 
 
ではここからはRDBMSに慣れ親しんだ方にはおなじみのSQLの実行例。
 
まずDBに接続。(DB作るときと同じコマンドです。)
sqlite3 testdb.sqlite3
 
1) テーブル作成
create table users (id, name);
※ データ型を指定することは必須ではありません・・・
 
2) データ保存
insert into users values(1, ‘maeda’);
 
3) データ参照
select * from users where id = 1;
 
特別なことは全然なくて、ほんとにちょっとしたときにサクッと利用できちゃいます。
 
どうやって接続終了したらいいの?はいつも使ったことないエディタ使ったりするときに思うやつなのでご紹介。
.quit
 
以上。
 
 
 
毎日数値をエクセルなどにデータ転記するようなルーチンをSQLiteを活用して自動化してみてください♪
シェルでのクエリ実行は以下のような感じです。
sqlite3 testdb.sqlite3 ”${sql}”
 
もちろん各種プログラミング言語もだいたいライブラリあるようなので大丈夫です!(無責任)
 
 
SQLといえば全然話変わりますが、弊社の英語表記を考えたときにSploutSQLを見つけたのを思い出しました😇
http://sploutsql.com/
 
 
 
 
 
※ 本文とアイキャッチイメージは特に関連性はありません。


3Dの自動地形生成をやってみました!

こんにちは。開発担当のマットです。

以前の記事で地形生成アルゴリズムを紹介しましたが、3Dの世界が自動的に生成するプログラムを作ってみたいと思いUnityという3Dゲームエンジンで作ってみました!

自動地形生成とは?

自動地形生成(Automatic Terrain Generation)とは、世界を作ってくれるプログラムです。「手続き型の生成」(Procedural Generation)の一種です。
簡単に説明すると、コンピュータの乱数生成の特徴を活用して世界を作り出します。

乱数生成と「シード」

コンピュータというものは、とても予想しやすいものです。決まっているルールに従って、予期不可能なことを一切やりません。コンピュータのファンクション(処理手順)に同じ値を入力すると、毎回出力される結果は必ず同じです。

しかし、時々、コンピューターに乱数を決めてもらいたい場合があります。
例えば、サイコロのプログラムを作ろうと思えば、毎回同じ結果だと困りますよね。

そのため、乱数を生成するファンクションを呼び出す度に、入力値を変更しなければなりません。
多くの乱数ファンクションはコンピューターの機内時計を入力値として使います。時計を使うと、ファンクションの呼び出し時間によって、返ってくる結果が異なりますので、サイコロのプログラム等に乱数を生成することができます。

この乱数ファンクションの「入力値」を「シード」(Seed[種])といいます。

パーリン・ノイズ

パーリン・ノイズとはゲーム業界でよく活用されている「ノイズ生成アルゴリズム」です。「ノイズ」とは「雑音」ですが、パーリン・ノイズは「波」のような2D雑音マップを生成してくれます。

パーリン・ノイズ・マップ

Ken Perlin氏というコンピュータ科学教授が1983年に開発し、それから、多くのプログラムに使われているノイズ生成機能です。

いくつかの引数(ファンクションの設定値)を設定することができ、変更することによって、波の形が変わります。
例えば、ものすごい雑なノイズを作ることもできますし、なめらかな波のようなノイズも作ることができます。

引数を変更すると、波の特徴が変わります。

なお、パーリン・ノイズのファンクションに与えるシードを変更することによって、「同様ながら違う」結果が返って来ます。

シードを変更すると、波の位置が変わります。

パーリン・ノイズを活用して、白いエリアを「高い高度」と解釈し、黒いエリアを「低い高度」と解釈すると、3Dマップを作ることができます。

なお、複数のノイズを重ねる事によって、より面白いものを作る事ができます。

世界づくり(デザイン)

まずは、どのような世界をつくりたいかを決める必要があります。
個人的な好みで中心が山となっている島を作ろうと思いましたが、それをどうやって作るかを決めなければなりませんでした。

要素

まずは、全体的にちょっとなめらかな地形がほしかったので、「Base」という優しいノイズを入れました。
次に中心となる山の形となる「Mountain」のノイズも必要だったので、それもデザインに入れて、最後に海岸の形を決める「Edge」も入れることにしました。

島づくりに使う3つのノイズマップ

しかし、この3つのノイズ要素を単純に足すだけだと島にはなりませんので、最終的の地形計算を行うとき、ちょっと特別な処理を行わなければなりません。

Baseノイズをマップ全体に適応して、地形をなめらかな形にしてくれます。

Mountainに関しては、以下のルールを加えました。
「マップの中心に近いほど、マップに影響を及ぼす。」
つまり、マップの中心にMountainノイズが地形の高度に影響を及ぼしますので、島の真ん中に山が生成されますが、中心から離れているところでは高い山が生成されません。

Edgeに関しては、以下のルールを加えました。
「マップの限界に近い程、逆影響を及ぼす。限界に近くない場合、影響を及ぼさない。」
「逆効果」とは「高度を下げる」とのことなので、マップの限界近くのエリアの高度が低くなります。

海を適切な高度に設置すると、島の形になります!

世界づくり(実装)

最近個人的にUnityでプログラミングをやっていますが、Unityは3Dゲームエンジンでとても使いやすいと思います。

今回は地形を作りたいので、Unityでゲームシーンを作って、Terrain(地形)とWater(水)オブジェクトを入れて、Waterの高度を10メートルに設定しました。そうすると、Terrainの高度が10mを超えていない箇所が海に浸かります。

上記で考えた3つのパーリン・ノイズを実装して、地形の高度に設定すると島が出来上がりました!

「12345」のシードで作り上げた島

上記の画像を見るとわかるかと思いますが、右側の設定画面でSeed(シード)を「12345」と設定しています。
そのシードでマップを生成すると、パーリン・ノイズの乱数生成に使われますので、毎回必ず同じ形の島が生成されます。

しかしシードを少しでも変更すると、全く違う島が出来上がります。

シードを少しでも変更すると、全く違う島が生成されます。

世界づくり(森も入れましょう!)

島づくりはなんとなくできましたが、ちょっと寂しいので森も生成しようと思いました。

地形と同じ原理で、パーリン・ノイズで木が生える場所を決めるのがいいです。
パーリン・ノイズ・マップを使って、ある閾値より白いところに木を生やす、という仕様を決めました。
単独に立つといい樹種は、ザラザラな雑音系のノイズ・マップを生成し、森のように、「群れる」木がいい場合は、なめらかな波を作るようノイズの引数を設定します。

Unityはデフォルトで、3種類の木を用意してくれるので、それぞれの樹種にノイズ・マップを用意する必要があります。

なお、それぞれの樹種に生える箇所の条件も加えてみました。

ヤシの木:高度が低い(海に近い)ところのみ。
松の木:高度が高くて、傾斜がきついところのみ。
楠の木:中間の高度なところのみ。

これらのルールで島を生成すると、より良い島が出来上がりました。

森も生成した「12346」の島。

折角ので、探検しましょう〜

Unityで簡単にファースト・パーソン・キャラクターを導入できますので、作り上げた島にキャラクターを入れて、島を走り回って楽しむことができました!

寂しくなくなった世界

まとめ

「手続き型の生成」はとても有力なツールだと思います。
ゲームやシミュレーションに使うことができ、無限コンテンツを生成することができるので、オープン・ワールド系のプログラムに向いていると思います。

今回は地形の高度と樹木の配置に使いましたが、それ以外の使い道もたくさんありますので、今後色んなことに使ってみたいと思います。


Webスクレイピングをはじめてみました(1)

 

こんにちは、長年Webデザインに携わってきましたがプログラミングがなかなか覚えられないLQヒロシです。

今回は一念発起して、流行りのPythonWebスクレイピングをしながらプログラミングを勉強していこうという試みです。

なぜWebスクレイピングなのか?

 

PHPのちょっとした修正や、jQueryを使ったクリックやリサイズの簡単なイベントぐらいはできるけど、そこから先になかなか進めない・・。デザイナーなんだしJavaScriptUI周りのエフェクトとかを実装できるようになりたいと思ってはいるのですが、UI周りってイベント同士が絡んだりすると途端に難しくなってなかなか続かないのが目下の課題だったりします。

簡単なアウトプットを段階的にこなしていって、ファンクションのまとめ方だったり、データのやり取りなどプログラミングの勘所を掴んでいけるのが理想的ですよね。

Webスクレイピングであれば、WebサービスのAPI活用・クローリングでのデータの収集、データベースへの保存や取り出し、データの加工の作成という一連の流れが小規模なカタチで勉強できるので、体系的にポイントを抑えた勉強ができそうです。データを加工するのに正規表現も使うことになりそうだし。

 

プログラミング言語はpythonを使用し、ツイッターと連携して画像を収集しギャラリーサイト作成を最終的な目標としたいと思います。

 

第一回目は、スクレイピングとPythonについてご紹介できればと思います。

そもそもWebスクレイピングとは?

 

厳密にはクローリングとスクレイピングに分けることができます。

・クローリング
WebサイトのハイパーリンクをたどってWebページを探す作業

・スクレイピング
Webページから必要な情報を抜き出し、整形し直す作業

例えば、電子書籍の販売サイトから書籍情報を抜き出して価格を比較、最安値の情報のみをまとめるなど、要するに複数のWebサイトから任意の情報だけを抜き出し、雑多なデータを整理して有益な情報にすることでしょうか。

Pythonって何?おいしいの?

 

GoogleFacebookで採用されていて、機械学習やIoTの事例も多い現在最も旬な言語とも言われていますので、おいしいです。他のプログラミング言語同様、WindowsMacOSLinuxなどのプラットフォームで動作でき、環境構築・Webシステムの開発~データ解析までひとつの言語で実現できることから世界中で広く使われています。

Pythonの特徴

 

文法が読みやすい

 

プログラムは一度書かれた後も他の人に読まれるもの。pythonでは「シンプルで読みやすいコードが書けること」という設計思想があり、コード上の装飾が極力少なくなるような記述方法になっています。少し文例を見てみましょう

実行結果:hogeです

 

このように文の終わりに閉じタグが必要なく、制御構文では影響する範囲を括弧で囲む代わりにインデントで定義。変数は代入するだけで宣言されたことになるのでとてもすっきりとして読みやすいコードになります。

Pythonってなんだか難しそうなイメージがありましたが、PHPなどと比べても別段特殊な書き方をしているわけでもなく、文法が見やすいので非常に馴染みやすく感じました。教育の現場でも採用されていたりするそうで、プログラミング初心者にも学びやすい言語だと思います。

 

・導入が簡単!

 

MacならHomebrewでインストールするだけですぐに使えました。コンパイルする必要もないので、ぶっちゃけ笑ってしまうぐらい早いですwww

(以前PHPを導入した際は、php.iniファイルの設定を調整したり、事前にDBを用意したりと面倒だった思い出があります。)

 

・豊富なライブラリ

 

Pythonには正規表現、数学関数、通信プロコトルなどの標準ライブラリが非常に豊富でインストールするだけで利用が可能です。さらにサードパーティ製のライブラリも豊富に提供されています。最近ではディープラーニング用のTensorFlowなどが有名ですね。データ解析のライブラリも強力で、スクレイピングしたデータをインフォグラフィックとして表現できたりもします。

 

それではPythonの導入方法を見てみましょう

 

Pythonは2系と3系があり、現在は3系が主流になりつつあります。2系と3系の間には互換性がありません。Macではデフォルトでインストールされていますが2系だったりするので、Homebrewで3系をインストールします。

 

 

バージョンを確認してみましょう

 

Homebrewでインストールしたものが参照されているか確認します。

と表示されれば準備は完了です。

 

では、対話方式でプログラム実行できる「インタラクティブシェル」でPythonを動かしてみます。やり方はターミナル上で「python3」と入力するだけですw

立ち上がったら上記のようなメッセージが表示され、コマンド受付状態になります。では、構文を入力してみましょう。

はい、これだけですw簡単ですw

 

終了する時は

または

これでbashに戻ることができます。

 

第一回目は以上になります。説明や導入を中心に駆け足でご紹介してきました。
まだまだ勉強中の身のため、上手く伝えられず分かりにくい部分が多々あると思いますが、次回からは実際にPythonを利用して少しでも魅力をお伝えできればと思います!


NginxをHTTP/2対応する際のポイント

NginxをHTTP/2に対応するにはALPNに対応する必要があり、下記ソフトウェアバージョンの条件を満たす必要があります。

  • Nginx 1.9.5以上であること
    ※但し、その後のバージョンでHTTP/2に関する不具合の修正がある為、ご注意ください。
  • OpenSSL 1.0.2以上であること

導入されているソフトウェアバージョンについては、下記コマンドにて確認可能です。

$ nginx -V

下記のようにバージョン条件が満たされた出力がされていれば問題ありません。

nginx version: nginx/1.10.3 (Ubuntu)
built with OpenSSL 1.0.2g 1 Mar 2016
TLS SNI support enabled

過去にHTTP/2対応したと思っていてもOpenSSLのバージョンが低く、正しくHTTP/2に対応できていないということがあるのでご注意ください。

正しく対応できているかの確認はchromeのDeveloper toolにてProtocol列を表示し、確認してください。

問題がない場合には[h2]と出力されています。

 


パスワードを使わなくてもWeb認証できる?「WebAuthn」

WebAuthnが、Web認証の新たなスタンダードになるかもしれません。

FIDO Alliance and W3C Achieve Major Standards Milestone in Global Effort Towards Simpler, Stronger Authentication on the Web
https://www.w3.org/2018/04/pressrelease-webauthn-fido2.html.ja

本日発表された新しいFIDO2仕様と、それをサポートする主要ブラウザの取り組みは、全てのプラットフォームやデバイス間でFIDO認証が不偏のものとして存在する第一歩を踏み出したことを示しています。データの侵害とパスワードなどの資格情報の盗難は増加し続けていましたが、これからサービスプロバイダは、脆弱なパスワードやワンタイムパスコードに頼ることなく、全てのウェブサイトやアプリケーションで フィッシング耐性を持つFIDO認証を実装する時が来たのです。

 
発表によると、生体認証(指紋や顔、虹彩等)や、USB、BluetoothまたはNFCを介した外部認証ツールを利用し、パスワードやワンタイムパスコードを使用せずにWeb認証が可能となるそうです。
現在、W3Cにおける「勧告候補」となり、すでに主要ブラウザであるChromeやFirefox、Microsoft Edgeがサポートを発表しています。
 
生体認証と聞いてスマートフォンのロック解除を思い浮かべる方が多いのではないでしょうか。
寝起き顔で認証されずに悲しみにくれた経験をした方もいるかもしれません。
Webアプリケーションもそれらと同じように手軽にログインできるようになれば、パスワードそのものの管理の不便さ、煩わしさを嘆く必要はなくなります。
 
W3Cでは実装サンプルが公開されています。
https://www.w3.org/TR/webauthn/#sample-registration
 
Firefox Nightlyにおいては、about:configにsecurity.webauth.webauthnという項目がすでに存在していることが分かります。

firefox nightliyのabout:config

もうほぼ実現するとみていい状況だと思われます。

検索してみるとDemoサイトも出てくるのですが、試してみるとデバイスの接続を求められるアラートが表示されるところから進めませんでした。
FIDO・CTAPに対応した認証用アプリや機器が必要なのだと思われます。
また機会をみて試してみたいと思います。
 
ところで、Appleは4月現在のところだんまりです。
珍しいことでもないので近いうちに何らかの発表があるかもしれません。