カントリーモーニング(仮)

しがないサラリーマンが不定期に更新する雑記帳。
スポンサーサイト

一定期間更新がないため広告を表示しています

| - | | - | - | pookmark |
【Amazon】AWS EC2 上で、node.js を使ってスピードオセロを作ってみた。


今回は、AWS EC2 上で、node.js を使ってみたお話です。

node.js を使うことで、サーバ側の処理も、javascriptを使って書けるとのこと、
お勉強のために、スピードオセロゲームを作ってみました。

題して「みんなでリバーシブル」。
スマホやPCなど、各自で持っているそれぞれのデバイスから、
共有のURLにブラウザ経由でアクセスし、
好き勝手に白や黒を置くことしかできませんができます。
相手の番の時に自分も置けてしまうるのでスピードが勝負です。
あと、3人以上の複数人でも楽しめてしまいます。

【ブラウザからのアクセスの様子】


【スマホからのアクセスの様子】


■ やったこと
1. AWSアカウント作成
アカウント作成後、12ヶ月無料で使える利用枠があるので、それを利用しました。
https://aws.amazon.com/jp/free/

2. EC2インスタンス作成
アカウント作成後、AWSホーム画面から、EC2 を選択し、
「インスタンス」メニューから、EC2インスタンスを作成します。
https://console.aws.amazon.com/console/home

3. TeraTermのインストール、設定を行い、接続、ファイルアップが出来るようにする
# 以下のページ(*1)を参考にさせていただきました。
-----------
ユーザー名 : ec2-user
接続先ホスト名 : ec2-xx-xxx-xxx-xx.compute-1.amazonaws.com
秘密鍵 : ec2-2015xxxx-1.pem
-----------
みたいな感じ。xxのところは、作成したインスタンスの情報を入れる。
(*1)Amazon EC2編〜EC2インスタンスにTera Termで接続するには?〜
http://recipe.kc-cloud.jp/archives/27

4. TeraTerm経由で接続し、node.js をインストールする
# 以下のページ(*2)を参考にさせていただきました。
(*2)Amazon EC2でnode.js,Expressアプリケーションを立ち上げる
http://qiita.com/Sugima/items/670924901e38cf9eb84a

5. TeraTerm経由で「othelo」フォルダを作成し、その下に、socket.io をインストールする
[ec2-user@ip-xx-xx-xx-xx ~]$ mkdir othelo
[ec2-user@ip-xx-xx-xx-xx ~]$ cd othelo
[ec2-user@ip-xx-xx-xx-xx ~]$ npm install socket.io

6. TeraTerm の SSH SCP機能を使って、「othelo」フォルダにファイル(app.js, index.html)をアップロードします。
# 以下のページ(*3)を参考にさせていただきました。
(*3)TeraTermのSCP機能で送信・受信共に「To:」欄のデフォルト値が変更可能です
http://www.j-oosk.com/teraterm/file-transfer/1213/

7. TeraTerm経由で、app.jsを実行
[ec2-user@ip-xx-xx-xx-xx ~]$ node app.js

8. ブラウザ経由で、以下にアクセスする。
http://ec2-xx-xx-xx-xx.compute-1.amazonaws.com:3000/



app.js(サーバ側処理), index.html(クライアント側処理) のソースコードです。

■ app.js(サーバ側処理)


■ index.html(クライアント側処理)



PS. 今回初めて、ソースコード表示の見た目を変えてみました(便利!)。
# 以下のページ(*4)を参考にさせていただきました。
(*4)GitHubのGistを使う
http://raptor36.hateblo.jp/entry/2015/04/11/202438

| Amazon | 11:21 | comments(0) | trackbacks(0) | pookmark |
【YouTube】AutoUTube が また 動かなくなっていた。
AutoUTube が また動かなくなってしまっていたので修正しました。
(【Android版】【mixi版】【PC版】、いづれも)

==============================================
■ 現象
開始ボタンをおしても再生開始されず、
「www.youtube.com/devicesupport」が表示される

■ 原因
YouTube Data API v2 が廃止され、v3への移行に追従できていなかったため
・一部の古い YouTube アプリのサポート終了(2015 年 4 月)について

・YouTube Data API v3 に向けて


■ 対策
Data API v2 から v3 を使用するよう変更。

[ 変更前 ]
function search(keyword) {
:
var query = "http://gdata.youtube.com/feeds/api/videos?"
+ "vq=" + keyword
+ "&max-results=30"
+ "&format=5"
+ "&alt=json-in-script"
+ "&callback=view";
:
}

[ 変更後 ]
function search(keyword) {
:
var query = "https://www.googleapis.com/youtube/v3/search?key={APIキー}"
+ "&q=" + keyword
+ "&maxResults=30"
+ "&part=id,snippet"
+ "&callback=view";
:
}

function view(data) {
:
// VideoIDの取得
var videoid = data.items[rnd].id.videoId;
// Videoタイトルの取得
var title = data.items[rnd].snippet.title;
// サムネイルURLの取得
thumbnailimg.src = response.data.items[0].snippet.thumbnails.default.url;
:
}
==============================================


【Android版】AutoUTube for Chromecast



【Android版】AutoUTube for Android2



【mixi版】AutoUTube for mixi



【PC版】AutoUTube




トミーテック
¥ 2,850
(2013-06-08)
コメント:これで、自宅でもICOCA使いたい放題だぜー。

| YouTube | 21:53 | comments(0) | trackbacks(0) | pookmark |
【Android】毎回同じメールしか送らんのんよ。
¥ 1,300
コメント:「なぜならそうよ わらわが美しいから!」……………。そう、ハンコックのセリフをハンモックで寝転んで読みたいあなたにオススメ、くつろぎドキドキハンモック♪





さて、



毎回同じメールしか送らんのんよ



会社から家に帰る前に、「これから帰る」メールを打つのが毎回面倒くさいくさいので、
自分用に作りました。

あらかじめ保存しておいた、宛先/本文 の内容を、ウィジェットボタンが押された際に以下で送信しているだけです。

------------------------
smsManager.sendTextMessage(destinationAddress, null, text, sentIntent, null);
------------------------

普段、「設定」→「モバイルネットワーク設定」→「データ通信を有効にする」のチェックを外して使っているので、
SMSで送信できるようにしたかったのでした。











| Android | 23:52 | comments(0) | trackbacks(0) | pookmark |
【Android】AutoUTube for Chromecast。
Google
¥ 3,900
コメント:クロノトリガーは名古屋ではクロノトリギャーというらしいので、クロムキャストは名古屋ではきっとクロムギャストというのだろうたぶん。



AutoUTube for Chromecast



Chromecast をゲットしたので、YouTubeコンテンツ自動連続再生プレイヤ、AutoUTubeの Chromecast版を作りました。


やったことのまとめです。



・Chromecastについて

Chromecastデバイス側で動作する、Recieverアプリと、
クライアントデバイス側(今回の場合は、androidスマホ)で動作する、Senderアプリがあります。

Recieverアプリ には、3種類あります。
-------------------
1. Default Media Receiver(デフォルトのReciever上で再生させる、実装は不要)
2. Styled Media Receiver(プリビルドされた Media Receiverを使って UIのみ変更する)
3. Custom Receiver(HTML5とJavascriptとCSSを使って開発者が実装)
-------------------

また、Receiverアプリでは、クライアントから接続要求を受けると、
その要求されたIDに応じて、サーバからReceiverアプリソフトをロードし、処理を開始します。

今回、AutoUTube for Chromecast は、
「3. Custom Receiver」のタイプで作成しました。

「3. Custom Receiver」の作成には、Registrationが必要で、
その際、Google Cast SDK Develope から、5ドル支払う必要があります。

Registration すると、そのRecieverアプリ固有のIDが発行されます。

また、Recieverアプリは、HTML5とJavascriptとCSSで作成し、
任意のhttpsサーバに格納し、そのURLを上記のGoogle Cast SDK Develope ページに登録します。

すると、クライアントのSenderアプリから、アプリ固有のIDで接続要求された際に、
IDに紐付いたURLから、Receiverアプリソフトがロードされ動作することになります。



・AutoUTube機能について

今回、AutoUTube機能を実装するに当たっての、Senderアプリ/Receiverアプリ の分担は以下です。

・Senderアプリ(クライアントandroidスマホ側)
ユーザからの検索キーワードの入力を受け付け、start/skip/stop の要求をReceiverアプリ側に送信する。
Chromecastとの接続方法、メッセージの送信方法については、Google Castのサンプルコード(CastHelloText-android)を参考に。

・Recieverアプリ(Chromecastデバイス側)
Senderアプリから送信された要求に基づき、
検索処理(YouTube Data APIを使用)と
再生処理(iframe 組み込みの YouTube Player APIを使用)を行う。
ホストするhttpsサーバには、Googleドライブを使用。



・署名付加時困ったことについて(おまけ)

今回、Chromecastの機能は、Android2.3以降でしか動作しないとのこと、
久しぶりに SDKを入れ替えたところ、デバッグ動作時には、全く問題なかったのに、いざ、GooglePlayへリリースするため、署名を付加しようとしたところ、


-----------------------
"auth_client_using_bad_version_title"
is translated here but not found in default locale
-----------------------

みたいな、MissingTranslationエラーが発生。。

google-play-services の libで出ている様子で、
valuesフォルダにデフォルトの翻訳文字値が詰められていなくておこられている様子。


“auth_client_using_bad_version_title” is translated here but not found in default locale
のページを参考に、values-en-rIN 内の auth_strings.xmlを valuesフォルダにコピーして、解決。
google-play-services、なんでエラー出るのだ。。。



AutoUTube for Chromecast









| Android | 17:38 | comments(0) | trackbacks(0) | pookmark |
【Android】Applivに掲載されました(ティヒロフラッシュ)。
「ティヒロフラッシュ」が、Applivに掲載されました。




Androidアプリ発見サイト −Appliv






紀文
¥ 1,229
コメント:豆乳コーラだよ。コーラガムを噛みながらアンバサを飲んでるような感じの味がするよ。

| Android | 22:20 | comments(0) | trackbacks(0) | pookmark |
【Android】Applivに掲載されました(JustPushThisCameraButton)。
「JustPushThisCameraButton」が、Applivに掲載されました。




Androidアプリ発見サイト −Appliv



回天堂
¥ 7,504
(2014-05-20)
コメント:べっ、べつに、自転車が好きなだけなんだからねっ!

| Android | 22:05 | comments(0) | trackbacks(0) | pookmark |
【Android】Applivに掲載されました(EndlessVoiceTweeter)。
「EndlessVoiceTweeter」が、Applivに掲載されました。





Androidアプリ発見サイト −Appliv


¥ 7,980
コメント:これからの梅雨の季節にぴったりのアイテムなのか。

| Android | 21:58 | comments(0) | trackbacks(0) | pookmark |
【Android】Applivに掲載されました(YouCanCheckPhotoEvery15min)。
「YouCanCheckPhotoEvery15min」が、Applivに掲載されました。






が、


Google play ストアからは、以下の通知とともに、削除されてしまったため、、、
# ストア掲載内容がまずかった模様(検索用キーワードの記載がNGらしい)。
----------------
削除の理由: コンテンツ ポリシーのスパム条項への違反

キーワードの乱用や単語の羅列は認められません。
説明欄の部分に独立したキーワード欄を作成し、キーワードや数字を詰め込むことは避けてください。
同じ単語や語句を不自然に感じられるほどに繰り返すことは避けてください。
他のアプリや商品の参照は避けてください。

----------------

YouCanCheckPhotoEvery15min2として、再リリース!

そして、



「YouCanCheckPhotoEvery15min2」が、Applivに掲載されました。





Androidアプリ発見サイト −Appliv



ホビーリンク・ジャパン
¥ 1,018
(2012-03-31)
コメント:餃子のプラモデル。「どどんぱー!」ではない。

| Android | 21:50 | comments(0) | trackbacks(0) | pookmark |
【Android】Applivに掲載されました(AutoUTubeforAndroid2)。
「AutoUTube for Android 2」が、Applivに掲載されました。




Androidアプリ発見サイト −Appliv


| Android | 21:37 | comments(0) | trackbacks(0) | pookmark |
【Android】AutoUTubeforAndroid2。


AutoUTubeforAndroid2


少し前に 突然、Google Play Teamから 下記のようなメールが届き、
AutoUTubeforAndroid が公開停止になっていました。。。
公開したのは、3年くらい前なので、なんでいまさら?という感じではありますが、
apkとしては、Intentを飛ばしてブラウザを起動するだけの機能のため、
どうやら、スパムアプリと判断されたようです。

----------------------------
Hello Google Play Developer,

We are constantly striving to make Google Play a great community for developers and consumers. This requires us to update our policies in accordance with current practices as the ecosystem evolves. This email is to notify you that we’ve made some changes to our policies which are highlighted below.

We've updated our content policies to further clarify our stance on sexually explicit material and provide a better experience for our users, including minors
We’re introducing the App Promotion policy, which provides guidance on what app promotion tactics are disallowed when promoting your app on Play
We’ve introduced a provision that requires you to clearly disclose when an advertised feature in your app’s description requires in-app payment
We’ve clarified the System Interference policy to prohibit any browser modifications on behalf of third-parties or advertisements
We’ve re-emphasized in the Ads Policy that all advertising behavior must be properly attributed to, or clearly presented in context with the app it came along with

We’ve also updated the Spyware section of our Policy Guidelines Help Site to address surveillance or tracking apps. Please take a look at the Google Play Developer Program Policy to see all the changes and make sure your app complies with our updated policies.

Any new apps or app updates published after this notification will be immediately subject to the latest version of the Program Policy. If you find any existing apps in your catalog that don’t comply, we ask you to unpublish the app, or fix and republish the app within 15 calendar days of receiving this email. After this period, existing apps discovered to be in violation may be subject to warning or removal from Google Play.

Regards,
Google Play Team

Google Inc.
1600 Amphitheatre Parkway
Mountain View, CA 94043

You have received this mandatory service announcement to update you about important changes to your Google Play service or account.
----------------------------





というわけで、せっかくなので、WebViewで読み込むようにしてみました。

・WebView
==========================================
WebView webview = new WebView(this);
setContentView(webview);

// JavaScript有効
webview.getSettings().setJavaScriptEnabled(true);

// プラグイン有効
webview.getSettings().setPluginsEnabled(true);

// スクロールバー非表示
webview.setVerticalScrollBarEnabled(false);

// ブラウザに遷移せずに、webview上で表示
webview.setWebViewClient(new WebViewClient() {});

// URL指定
webview.loadUrl("http://ww7.enjoy.ne.jp/~noria/youtube/AutoUTubeforAndroid2.html");
==========================================


AutoUTubeforAndroid2








マイルストン
¥ 980
(2013-03-16)
コメント:男子便所が好きな男子や女子にオススメ!

| Android | 22:18 | comments(0) | trackbacks(0) | pookmark |
デザイングッズストア。
CALENDAR
S M T W T F S
      1
2345678
9101112131415
16171819202122
23242526272829
<< February 2020 >>
SPONSORED LINKS
AMAZON RECOMMEND
ハァハァCD
ハァハァCD (JUGEMレビュー »)
オムニバス,白雪みるく,河原木志穂,くーたん,森永まみ,たぬまゆみ
SELECTED ENTRIES
CATEGORIES
ARCHIVES
RECENT COMMENT
デザイングッズストア。
心頭MakeUp Tシャツ。
2009_09_18_11_39_28
ブロカン
サンプル・モニターの口コミ広告ならブロカン
おしゃれショップ「かさぶた人生」
MOBILE
qrcode
LINKS
PROFILE