スマホで使う<audio>タグの動作検証
html5からaudioタグが追加されましたが、スマホだとどういった風に動作するのか検証してみました。
<script> var audio = new Audio(); audio.src = "http://foo.mp3"; function play() { audio.load(); audio.play(); } </script> <a href="javascript:void(0)" onClick="play()">play</a>
これが一番簡潔なコードで、PCだと特に問題ないのですがスマホだと色々な挙動をします。
そもそも大前提としてスマホで使った場合はどうなるのか？
iPhone、Androidでは一回は画面にタップしないと、読み込みと、再生が出来ないように制限されている。
しかしiOS8.4のiPhone6で検証した所、タップをしないでも読み込みができることに気づきました(バグ？
<script> var audio = new Audio(); audio.src = "http://foo.mp3"; audio.load();//iOS8.4だと動作する function play() { audio.play(); } </script> <a href="javascript:void(0)" onClick="play()">play</a>
ちなみに読み込みのload()関数は書かなくても動作します。srcにソースを指定したタイミングと、play()を呼び出した際にも自動的に読み込みが始まります。
それとAQUOS PHONE SERIE(shl23)だとplay()の前にload()を書くと何故か再生されないバグがあります。
<script> var audio = new Audio(); audio.src = "http://foo.mp3"; function play() { audio.load();//shl23だと再生されなくなる・・・・ audio.play(); } </script> <a href="javascript:void(0)" onClick="play()">play</a>
audioタグにはイベントリスナを設定できるのですが、iOS8.4だと画面をもどった際にイベントリスナが効かなくなります(バグ？
<script> var audio = new Audio(); audio.addEventListener("ended", function(){}, false);//画面を戻った際に反応しない audio.src = "http://foo.mp3"; audio.load(); function play() { audio.play(); } </script> <a href="javascript:void(0)" onClick="play()">play</a>
対処方法としては再度audioインスタンスを生成するしかありません。
<script> function play() { var audio = new Audio(); audio.addEventListener("ended", function(){}, false); audio.src = "http://foo.mp3"; audio.load(); audio.play(); } </script>
Apache＋nodejs＋socket.ioを使ったリアルタイムWeb
普段のサーバーはApacheを使っているのですが、少し前にnodejsというサーバーからクライアントまでJavaScriptで書ける物がリリースされました。
nodejsはV8エンジンというGoogleChromeで使われている高速なエンジンを使用していたり、またApacheのC10K問題を解決しようとするものでした。
メリットも多いながらデメリットもそこそこあり、デプロイ時に再起動しないと新しいリソースが反映されなかったり(現在は解決してるのかな？)、イベント駆動ループ型なので、どこかでエラーが発生すると止まったり、またシングルスレッドで動くので最近主流のマルチコアCPUとは相性が悪かったりするんですが、デメリットを理解して使えれば色々と面白いです。
以下のBlog記事がとても面白かったです。実際のGreeの導入事例や、アメリカチェーンのスーパーマーケットWalmartのブラックフライデー時の高負荷時にもサーバーが落ちずに耐えきった話など。
GREEが悩むNode.jsの問題を考えるヒント - ぼちぼち日記
隠れていたNode.jsの4バイトメモリリーク、Walmart問題の解決 - ぼちぼち日記
少しタイトルと話がそれましたが、そのnodejsはhtml5のsocket.ioの実装もとても簡単にできます。これが出来るとリアルタイムWeb(情報の更新をリアルタイムに反映し共有する概念やその仕組み)が使えます。
要するに、いままではブラウザ画面を更新したり、画面遷移をしたりと、クライアント(ブラウザ)側からアクションを起こさないと画面が切り替わりませんでしたが、これを使うとサーバーから好きなタイミングでクライアント(ブラウザ)に情報を送信できます。例えばチャットや、簡単なオンラインゲームなんかも作れたりします。
これ自体はnodejsだけでも出来るのですが、今回は裏の通信部分だけをnodejsで実装します。
以下がサンプルソースです。Apacheは80ポートで使用しているので、nodejsは今回は8080ポートを使用した想定です。
サーバー側
var io = require('socket.io').listen(8080); io.sockets.on('connection', function (socket) { socket.emit('connected', 'connected'); /* socket.emit('news', { hello: 'world' }); socket.on('my other event', function (data) { console.log(data); }); */ // クライアントが切断したときの処理 socket.on('disconnect', function() {}); });
クライアント側
<html> <head> <meta charset="utf-8"> <script src="http://foo.co.jp:8080/socket.io/socket.io.js"></script> <script> var socket = io.connect('http://foo.co.jp:8080'); /* socket.on('news', function (data) { console.log(data); socket.emit('my other event', { my: 'data' }); }); */ socket.on('connected', function (data) { console.log(data); }); socket.on('disconnect', function (data) { //console.log(data); socket.disconnect(); }); </script> </head> <body> HelloWorld </body> </html>
これで最低限の接続と切断が行えます。送信したいときはemitで受け取りはonで使用できます。
これを使って何か作ってみたいところです。
追記
Firefoxや、Thunderbirdを作ったMozillaが公開しているサンプル↓
nodejsとsocket.ioを使ってますbrowserquest.mozilla.org
PHP5.2でより良い乱数生成
PHPの乱数生成で偏りを感じるので、異なる方法での乱数生成を調べてみました。
乱数の取得にはrand()とmt_rand()があり、mt_rand()がより良い乱数を取得とドキュメントに書いてあるのですがイマイチです。
mt_rand()はmt_srand()によりシードを生成できますが、指定がない場合は自動でやってくれるみたいです。ここに問題があると思われるので、ここを別の方法でシードを生成します。
PHP5.3だとopenssl_random_pseudo_bytes()を使用して乱数を初期化する方法があるようです。
<?php mt_srand(hexdec(bin2hex(openssl_random_pseudo_bytes(4))));
しかし私の職場環境だとPHP5.2なので、この方法は使えません(ノД`)・゜・。
そこでLinuxの疑似乱数生成器/dev/urandomを利用することにします
<?php $file = file_get_contents('/dev/urandom', false, null, 0, 1000); $file = base64_encode($file); exec("echo {$file} | tr -dc 0-9 | head -c 8", $output); mt_srand($output[0]);
これで8桁の乱数を取得できます。
Mysqlの最大接続数の設定
作ったサービスのMysqlの接続数の設定とか全然してかったなぁ～と思いつき色々調べたのでメモ(笑
現在設定してある最大接続数の設定確認
show global variables like 'max_connections';
起動してからこれまでの最大同時接続数
show global status like 'Max_used_connections';
スレッドの色々な状態
show global status like 'Thread_%';
↑でThreads_createdが異常に多い場合はキャッシュの数が足りない
(私のでは2万ぐらいになってた。キャッシュの設定はしていなかったので)
キャッシュ接続数の確認
show variables like 'thread_cache_size';
/etc/my.cnfに以下を追加して再起動
[mysqld]
thread_cache_size = 100
即時反映なら
set global thread_cache_size=100;
キャッシュサイズの値は最大同時接続数の1～3倍ぐらいがいいかも
SVNを普段使っている人がWindowsでGitインストールしてみた
普段はSVNを仕事で使っていますが、ここ最近はGitが流行っていてSVNの肩身が狭いです。
codezine.jp
ここの記事によると
”ソースコードの管理では、ほとんどのユーザーがGit（69.3％）を使用しており、SVN（36.9％）がそれに続いている”
SVN使用者が減ってきているのを感じます。でもそこまでSVN嫌いじゃないけどね！
github.com
しかしイケイケな開発者や、会社は当たり前のようにGithub使ってますし、確かにGit使えないとエンジニアとして遅れている感じがします。
個人的に作ったサイトはLinuxでGitを使ってソース管理していますが、Androidのソースを管理しようとした時にWindowsでGit使えないと色々めんどうだなと思ったので使う方法を探しました。
ちなみに2、3年前にも某Gさんに「エンジニアはGitぐらい使えないと駄目だよね」言われたのを思い出した( ˘ω˘ )なつい・・・・
msysgit.github.io
とりあえずWindows標準っぽいのを今回はインストールします
英語なので忘れそうなのをメモ
上二つはショートカットの設定なので、お好みで初期ではチェックがAdvanced Contextに入ってますが、普通のが良いのでSimple Contentで右クリックメニューに追加する項目をチェックします。
git bash以外で以外で使うかの設定。これもシンプルなのが良いので一番上のgit bash onlyを選択
最後に改行の設定。Windowsで使うので自動でLFをCRLFに変えたりしてくれるが、いまどきのはエディターが複数の改行コードに対応しているので特に変換なしの一番下を選択
インストール後に右クリックメニューに先ほど選択した項目が追加されます
Let's enjoy Git life！！
追記
”ソースコードのインデントは、Tab派（45.0％）がスペース派（33.6％）を上回る結果となった。”
なんでじゃ！！スペースの方がいいに決まっtくぁwせdrftgyふじこlp；
IT業界の常駐について
この記事は深夜のノリ30%と、リリース後の疲れ70%で出来ています。
良いこと(少し)書いたので、ぶっちゃけます(笑
IT業界の新人の方の今後の参考になるかな～
この業界の会社は大きく分けて二つあると思っていまして、一つは常駐系の会社、もう一つは社内開発系の会社です。
私は常駐系の会社に勤めていました。たぶんIT業界的には常駐系の会社の方が多いのではと思います。
常駐は他の会社に行って働くことですが、知らない人に言わせると派遣みたいなものです。派遣とは違うんだと力説されたこともありますが(笑
常駐する際は会社にもよりますが、常駐先の会社の面接を受ける必要があります。そもそも正社員であるはずの人間が別の会社に行って何故面接をしなければ行けないのかずっと疑問に思っていましたし、これでは正社員になった意味がないなと思っていました。
そもそも常駐には限界がありまして、年齢が高くなると面接が受かりにくくなります。年齢が高いと言うことは、それだけ技術者としての経験が豊富なはずですが、まず受かりません。
原因は常駐する会社で「作業の支持をする人」＜「作業をする人」の年齢が高くなって指示が出しにくくなるからです。自分より年齢が高い人に雑用みたいに作業を指示することは難しいですからね。
私は常駐がメインの会社には将来性がないと思っています。そもそもつい最近も特定労働派遣(常駐のこと)が廃止されるなんて話もありました。実際は廃止にはなりませんでしたが・・・この先どうなるか予想もつきません。
これでもマイルドに書いた内容です。
