imgのSRCをbase64で書き換え続ければ動画っぽくなるのですか?(o^^o)

imgタグのSRCにもbase64とか使えます

まぁそういうことです。
かいたまんまです。

<img class='mypicture' src='data:image/jpeg;base64,
/9j/4AAQSkZJRgABAQEASABIAAD/2wBDAAEBAQEB~~~

とか書けばよいのです。

さぁ、これをjavascriptで連続的に書き換えれば、動画っぽくなるんでしょうか?

jpegのbase64を作るには

『退屈なことはPythonにやらせよう』

に則り、jpegのbase64を作ります。
とりあえず5コくらい作って、連続で書き換えてみましょう。

import base64
import os
for w in range(5):
	ww = str(w+1)
	filename	= os.path.abspath("a0" + ww + ".jpg")
	filename2	= os.path.abspath("a0" + ww + ".b64")
	with open(filename, "br") as f:
		Q = f.read()
		S = base64.b64encode( Q )
		with open(filename2, "bw") as g:
			g.write(('var a0' + ww + '="').encode("utf-8"))
			g.write("data:image/jpeg;base64,".encode("utf-8"))
			g.write(S)
			g.write('";'.encode("utf-8"))

とりあえずこんな感じで、a01.jpg~a08.jpgを、a01.b64~a08.b64に変換します。
それでhtmlで読み込みます。

HTMLで読み込んで、、

って言ってもPHPですが、、

<!--
	$uid		= uniqid("",false);
-->	
<script type="text/javascript" src="a01.b64?a=<?php echo $uid; ?>"></script>
<script type="text/javascript" src="a02.b64?a=<?php echo $uid; ?>"></script>
<script type="text/javascript" src="a03.b64?a=<?php echo $uid; ?>"></script>
<script type="text/javascript" src="a04.b64?a=<?php echo $uid; ?>"></script>
<script type="text/javascript" src="a05.b64?a=<?php echo $uid; ?>"></script>
<script type="text/javascript" src="a06.b64?a=<?php echo $uid; ?>"></script>
<script type="text/javascript" src="a07.b64?a=<?php echo $uid; ?>"></script>
<script type="text/javascript" src="a08.b64?a=<?php echo $uid; ?>"></script>

javascriptで回してみましょう

		setInterval(function(){
			var str = "";
			CT++;
			if(CT > 8)	CT = 1;
			switch(CT){
				default:
				case 1:	str = a01;	break;
				case 2:	str = a02;	break;
				case 3:	str = a03;	break;
				case 4:	str = a04;	break;
				case 5:	str = a05;	break;
				case 6:	str = a06;	break;
				case 7:	str = a07;	break;
				case 8:	str = a08;	break;
			}
			$(".mypicture").attr("src",str);
		},100);

結果

あとがき

まぁこんなとこでつまづくわけもないとは思ってたけど、
変にフラッシュしたり画面がガタつくこともなく、普通に表示できました。

もちろん、これをさらにWebSocketやtcp/ipでやろうっていうわけだから、
まぁUDPでもいいけど、、
問題はそこですね。

では、そのとき考えましょう。

とさっ。

どんとはらい(o^^o)

コメントする

メールアドレスが公開されることはありません。 が付いている欄は必須項目です