端くれプログラマの備忘録 – ページ 47 – 最近はウェブ系アプリ中心、あとWindowsアプリちょっと

[ソフト] SnapCrab – マウスひとつで、即キャプチャ

2016年5月23日2016年9月24日 @84kure

いろいろ試したけど、これに落ち着いてる。

高機能スクリーンショットツール SnapCrab – マウスひとつで、即キャプチャ | フェンリル
http://www.fenrir-inc.com/jp/snapcrab/

[Red5] サンプルアプリがリストされない問題を解決する

2016年5月22日2016年9月24日 @84kure

Red5にはサンプルアプリとそれらを使ったデモが幾つか同梱されている。だけど、セットアップしてみたものの、サンプルアプリがリストされない。

サンプルアプリのパスが間違ってるんじゃないかと思っていろいろ調べたところ、その通り。リポジトリのパスがGoogle Codeから自サーバーに変わったみたいだけど、それが反映されていない箇所があったので以下のように直す。

webapps/installer/WEB-INF/red5-web.properties

webapp.contextPath=/installer
webapp.virtualHosts=localhost, localhost:5080

# Used by the installer to locate the available wars
# application.repository.url=http://red5.googlecode.com/svn/snapshots/
application.repository.url=http://red5.org/snapshots/

webapp.contextPath=/installer

webapp.virtualHosts=localhost, localhost:5080

# Used by the installer to locate the available wars

# application.repository.url=http://red5.googlecode.com/svn/snapshots/

application.repository.url=http://red5.org/snapshots/

Gitリポジトリはこちら。

red5-server/red5-web.properties at master · Red5/red5-server · GitHub
https://github.com/Red5/red5-server/blob/master/src/main/server/webapps/installer/WEB-INF/red5-web.properties

修正して再起動したらサンプルアプリがリストされるようになった。

[Red5] DigitalOceanで動かす (CentOS 7.1)

2016年5月21日2016年9月24日 @84kure

以前に書いた手順通りでいい。

[Red5] インストール (CentOS 7) – 端くれプログラマの備忘録
https://www.84kure.com/blog/2016/02/03/red5-%e3%82%a4%e3%83%b3%e3%82%b9%e3%83%88%e3%83%bc%e3%83%ab-centos-7/

ポートを開けるのを忘れずに。

$ sudo firewall-cmd --list-all
$ sudo firewall-cmd --permanent --add-port=5080/tcp
$ sudo firewall-cmd --permanent --add-port=1935/tcp
$ sudo firewall-cmd --reload

$ sudo firewall-cmd --list-all

$ sudo firewall-cmd --permanent --add-port=5080/tcp

$ sudo firewall-cmd --permanent --add-port=1935/tcp

$ sudo firewall-cmd --reload

5080番はウェブページ用、1935番がRTMP。

参考サイト

red5’s manual: さくらVPSにRed5の環境を構築する「まとめ」
http://red5-manual.blogspot.com/2012/02/vpsred5.html

Red5サーバー構築と検証 – Qiita
http://qiita.com/alingogo/items/1176a7d42b9c0b36515c

[ソフト] クラウドストレージ暗号化ツール

2016年5月20日2016年9月24日 @84kure

Cloudfoggerを使っていたんだけど、理由はわからないけどディスコンになってしまった。

Cloudfogger
https://www.cloudfogger.com/en/

取り急ぎ代わりを探さないと。まずは暗号化ツールの紹介記事を探して読む。

Top 5 Encryption tools for Dropbox, OneDrive, Google Drive | Next of Windows
http://www.nextofwindows.com/top-3-free-encryption-tools-to-protect-your-data-stored-in-the-cloud

Best Free Encryption Utility for Cloud Storage | Gizmo’s Freeware
http://www.techsupportalert.com/best-free-encryption-utility-for-cloud-storage

Top 10 Best Alternatives to BoxCryptor | Top Best Alternatives
http://www.topbestalternatives.com/2015/top-10-best-alternatives-to-boxcryptor/

Open Source Cloudfogger Alternatives – AlternativeTo.net
http://alternativeto.net/software/cloudfogger/?license=opensource

よさげな無料ツールをいくつか試す。

nCrypted Cloud
https://www.encryptedcloud.com/

Viivo
https://www.viivo.com/

Boxcryptor
https://www.boxcryptor.com/en

Boxcryptorが自分の用途にあっていそう。

[Photoshop] チュートリアルいろいろ

2016年5月19日2016年9月24日 @84kure

プログラマでも、フォトレタッチやちょっとしたグラフィック作成ができると守備範囲が広がる。Photoshopを手っ取り早く勉強したければ、理屈を学ぶよりも実例をなぞってみるのが近道かな。

photoshopで仕事をしたい人が身につけておきたい技術や使い方のまとめ。日本語のチュートリアルです。
http://threem-design.com/web-design/photoshop-tutorial/

Photoshopをデザイン素人が勉強するために見たサイト – NAVER まとめ
http://matome.naver.jp/odai/2133585342067292101

Photoshopでのロゴフォントの作り方　【文字加工集】 – NAVER まとめ
http://matome.naver.jp/odai/2137880967580363201

やってみたかった表現を完全マスター！Photoshop基礎チュートリアル60まとめ｜ferret [フェレット]
https://ferret-plus.com/1214

[動画処理] 4K動画のエンコード設定例 – YouTubeの場合

2016年5月18日2016年9月1日 @84kure

民生用カメラで撮影した約1時間の4K動画をテスト用にもらった。1ファイルで500GB以上ある。4K動画をオンライン配信する場合、どの程度のクオリティで配信するのだろう？

気になったのでYouTubeの例を調べてみた。

アップロードする動画の推奨エンコード設定 – YouTube ヘルプ
https://support.google.com/youtube/answer/1722171?hl=ja

コンテナ: MP4
音声コーデック: AAC-LC
動画コーデック: H.264
推奨映像ビットレート　2160p(4K)
標準フレームレート (24, 25, 30): 35-45Mbps
高フレームレート (48, 50, 60): 53-68Mbps
推奨音声ビットレート
モノラル: 128Kbps
ステレオ: 384Kbps
5.1: 512Kbps

H.264で35-45Mbpsか。H.265が使えればビットレートはさらに高くできそう。

[HTML5] JWPlayerで字幕のスタイルを指定する

2016年5月18日2016年9月1日 @84kure

以下に解説あり。

Styling Captions for FCC Compliance | JW Player
https://support.jwplayer.com/customer/portal/articles/1482067

JWPlayerオプション指定

captionsオブジェクトで指定できる。

var playerInstance = jwplayer("myElement")
playerInstance.setup({
    playlist: [{
        file: "/assets/sintel.mp4",
        image: "/assets/sintel.jpg",
        tracks: [{
            file: "/assets/captions-en.vtt",
            label: "English",
            kind: "captions",
            "default": true
        },{
            file: "/assets/captions-fr.vtt",
            kind: "captions",
            label: "French"
        }]
    }],
    captions: {
        color: '#FF0000',
        fontSize: 24,
        backgroundOpacity: 50
    }
});

var playerInstance = jwplayer("myElement")

playerInstance.setup({

playlist: [{

file: "/assets/sintel.mp4",

image: "/assets/sintel.jpg",

tracks: [{

file: "/assets/captions-en.vtt",

label: "English",

kind: "captions",

"default": true

},{

file: "/assets/captions-fr.vtt",

kind: "captions",

label: "French"

}]

}],

captions: {

color: '#FF0000',

fontSize: 24,

backgroundOpacity: 50

}

});

[HTML5] JWPlayerのシーク機能

2016年5月17日2016年9月1日 @84kure

JWPlayerを埋め込んだページでプログレッシブダウンロードしながら動画を再生しているとき、まだダウンロードされていない時刻へ早送り(シーク)しようとしてもできないという問題に直面。シークバー上のポインタをマウスでドラッグして放すと、ドラッグ前の位置に戻ってしまって動画の再生には変化なしという状況。HTML5プレイヤーではシークできるので、Flashプレイヤー特有の問題っぽい。

調べた結果、以下のページに解決法が見つかった。

JW6: Pseudo Streaming in Flash | JW Player
https://support.jwplayer.com/customer/portal/articles/1430518

startparamオプションを指定することで解決する。

<div id="myElement"></div>
<script>
    jwplayer("myElement").setup({
      image: "/uploads/myPoster.jpg",
      file: "/uploads/myVideo.mp4",
      startparam: "start"
    });
</script>

jwplayer("myElement").setup({

image: "/uploads/myPoster.jpg",

file: "/uploads/myVideo.mp4",

startparam: "start"

});

</script>

[決済] クレジットカード番号からカード種別を判別する

2016年5月16日2016年9月1日 @84kure

カード番号の先頭6桁で発行元を特定する (IIN: Issuer Identification Number)。Wikipediaにカード種別ごとのIINの範囲が示されているので、これを使えばクレジットカード番号からカード種別を判別することができる。

Payment card number – Wikipedia
https://en.wikipedia.org/wiki/Payment_card_number

クレジットカードの番号 – Wikipedia
https://ja.wikipedia.org/wiki/%E3%82%AF%E3%83%AC%E3%82%B8%E3%83%83%E3%83%88%E3%82%AB%E3%83%BC%E3%83%89%E3%81%AE%E7%95%AA%E5%8F%B7

ちなみに、入場カードや銀行キャッシュカードやクレジットカードなどの磁気ストライプ付き (IDカード) の国際規格はISO/IEC 7812に定められている。

ISO/IEC 7812 – Wikipedia
https://en.wikipedia.org/wiki/ISO/IEC_7812

ISO/IEC 7812 (日本語) – Wikipedia
https://ja.wikipedia.org/wiki/ISO/IEC_7812

[Webサービス] Googleフォーム

2016年5月15日2016年9月1日 @84kure

結構使えそうなので、積極的に活用してみようかと。

Google フォーム – アンケートを作成、分析できる無料サービス
https://www.google.com/intl/ja/forms/about/

ドキュメントエディタヘルプ
https://support.google.com/docs#topic=1360904

ASCII.jp：Googleフォームで自動返信システムをサクッとつくる (1/4)｜Web制作をちょっと便利にするGoogle Apps Script入門
http://ascii.jp/elem/000/000/879/879412/