Video データ処理

<!DOCTYPE html>
<html lang=”en”>
<head>
<meta charset=”UTF-8″>
<meta name=”viewport” content=”width=device-width, initial-scale=1.0″>
<meta http-equiv=”X-UA-Compatible” content=”ie=edge”>
<title>Document</title>
</head>
<body>
<script language=”javascript”>

function changeColor(newColor) {
var elem = document.getElementById(‘h1’);
elem.style.color = newColor;
}
function drawVideo(){
var video = document.getElementById(“v”);
var canvas = document.getElementById(“c”);
canvas.getContext(“2d”).drawImage(video, 0, 0, 480, 270);

}
function drawVideoBW(){
var video = document.getElementById(“v”);

setInterval(function(){
var canvas = document.getElementById(“c”);
var ctx = canvas.getContext(“2d”);
ctx.drawImage(video, 0, 0, canvas.width, canvas.height);

var src = ctx.getImageData(0, 0, canvas.width, canvas.height);
var dst = ctx.createImageData(canvas.width, canvas.height);

for (var i = 0; i < src.data.length; i=i+4) {
var y = ~~((src.data[i] + src.data[i + 1] + src.data[i + 2])/3);
src.data[i] = src.data[i+1] = src.data[i+2] = y;
src.data[i+3] = src.data[i+3];
}

ctx.putImageData(src, 0, 0);
}, 1000/30);
}
</script>

<h1 id=”h1″>Video 白黒化</h1>
<button onclick=”changeColor(‘blue’);”>blue</button>

<div>
<video id=v preload=’none’ onclick=’this.play();’ controls>
<source src=’test2.mp4′>
</video>
</div>
<div>
<button onClick=”drawVideo()”>Draw Color</button>
</div>
<div>
<button onClick=”drawVideoBW()”>Draw BW</button>
</div>
<div>
<canvas id=”c” width=”320″ height=”180″></canvas>
</div>
</body>
</html>

この接続ではプライバシーが保護されません

証明書を誤って設定した場合のGoogle Chrome のエラーメッセージ

aaaaa.com では、悪意のあるユーザーによって、パスワード、メッセージ、クレジット カードなどの情報が盗まれる可能性があります。 詳細 NET::ERR_CERT_COMMON_NAME_INVALID 一部のシステム情報とページのコンテンツを Google に送信して、セーフ ブラウジングの改善にご協力ください。プライバシー ポリシーセキュリティで保護されたページに戻る詳細情報を表示しない

このサーバーが aaaaa.com であることを確認できませんでした。このサーバーのセキュリティ証明書は bbbbb.com から発行されています。原因としては、不適切な設定や、悪意のあるユーザーによる接続妨害が考えられます。

aaaa.com にアクセスする(安全ではありません)

宇宙仮面のSSL対応

放置状態が続いていたuchukamen.comですが、再開するにあたって、まずSSL対応にしましたが、いろいろと大変だったので、そのメモです。

これまで、uchukamen.com は Willnet のWASP-10というプランでホスティングしていました。WASP-10はSSL未対応のプランです。2015年ごろはSSL未対応でもあまり問題はなかったのですが、最近はブラウザが 安全ではないと表示するようになり、SSL未対応だと危ないサイトのように表示されてしまい、いまいちです。

デスマっている間に、世の中はいろいろ進歩していて、Willnet のレンタルサーバープランWASP3プランでは、Let’s Encryptにより無料でSSL対応ができるようになっていました。 そこで、Willnet のWASP-10プランから、Willnet でWASP3を申し込みました。このさい、WASP-10から、WASP3のプランを変更した場合、サイトを移行する必要があります。具体的には、WASP-1oのコンテンツをWASP3へ移行する必要があります。このとき、IPアドレスも変更になります。具体的には、IP aaa.bbb.ccc.xxx というIPアドレスから、aaa.bbb.ccc.yyy へ変更になります。

以下は、その後の手順です。

  1. WillnetのWASP3を申し込む。
  2. Plesk で顧客(uchukamen)を登録する
  3. ドメイン(uchukamen.com)を追加する
  4. ftpユーザーを追加する。このとき、パーミッションがデフォルトで読み・書きともにオフとなっているので、可とする必要があります。
  5. DNSを新しいIPに変更する
  6. uchukamen.com のコンテンツを 新しいサイトに発行する
  7. ドメイン→ホスティング設定で、SSL/TLSサポートをチェック、SEOに対するHTTPからHTTPSへの購入的301リダイレクトをチェック
  8. ドメイン→Let’s Encrypt でメールアドレスを設定、現在の証明書で新しい証明書(w25-2018*)を選択し、インストールする。