忍者ブログ

ひつ(じのひよこが)プログラミングします。
お仕事や趣味で困ったこととか、何度も「あれ?どうだったかしら」と調べたりしたこととか、作ったものとか、こどものこととかを書きます
★前は週末定期更新でしたが今は不定期更新です

2024/03    02« 1  2  3  4  5  6  7  8  9  10  11  12  13  14  15  16  17  18  19  20  21  22  23  24  25  26  27  28  29  30  31  »04

JavaScript でサーバ上にある画像のハッシュ値を計算する

×

[PR]上記の広告は3ヶ月以上新規記事投稿のないブログに表示されています。新しい記事を書く事で広告が消えます。

コメント

ただいまコメントを受けつけておりません。

JavaScript でサーバ上にある画像のハッシュ値を計算する

少し苦労したので備忘。実際に作ってみたときのソースコード

const getPicture = (src) => {
	return new Promise((resolve, reject) => {
		let xhr = new XMLHttpRequest();
		xhr.open('GET', src, true);
		xhr.responseType = "blob";
		xhr.onload = (e) => {
			// 画像が取得が終わったらここに来る
			const fileName = src.slice(src.lastIndexOf("/") + 1);
			// jsSHA を使ってハッシュ値を計算する
			// jsSHA がないようならば警告を出して reject しちゃう
			if(! Boolean(jsSHA)) {
				const errorMessage = 'To calculate SHA256 value of the picture, jsSHA is required: https://github.com/Caligatio/jsSHA';
				console.warn(errorMessage );
				reject({ event:e, data: e.currentTarget.response, fileName: fileName, hash: '', error: errorMessage });
				return;
			}
			// onload イベントの currentTarget.response に画像データが入っている
			// これを arrayBuffer 関数で Array Buffer に変換
			e.currentTarget.response.arrayBuffer().then((arraybuffer) => {
				const sha = new jsSHA("SHA-256", 'ARRAYBUFFER');
				sha.update(arraybuffer);
				const hash = sha.getHash("HEX");
				resolve({ event:e, data: e.currentTarget.response, fileName: fileName, hash: hash });
				return;
			});
		};
		xhr.onerror = (e) => resolve(reject({ event:e, data: null, fileName: '', hash: '', error: 'error in getting picture process' }););
		xhr.onabort = (e) => resolve(reject({ event:e, data: null, fileName: '', hash: '', error: 'getting picture process is aborted' }););
		xhr.ontimeout = (e) => resolve(reject({ event:e, data: null, fileName: '', hash: '', error: 'getting picture process is timeout' }););
		xhr.send();
	});
};

// 実際には同一ドメインじゃないと無理なので注意
const pictureUrl = 'http://blog.cnobi.jp/v1/blog/user/dae47eb5ba97f522fac369dd34ed4c62/1453740726';
getPicture(pictureUrl).then((result) => {console.log(result.hash)});

L5 を blob じゃなくて array buffer にすればすぐに計算できるのでは?と思ったのだがなぜか値が少しだけ違っていてうまくハッシュ値を計算できなかった。この辺の事情もちゃんと調べようと思ったのだがよくわからず。

PR

コメント

ただいまコメントを受けつけておりません。

ブログ内検索

P R