js修正referer解決画像盗難チェーン問題

1466 ワード

最近プロジェクトの中で一つの問題が発生しました。プロジェクトの中で他のウェブサイトの写真を表示する必要があります。インターネットでたくさん探しましたが、具体的なコードポリシーがありません。ここで皆さんに一つの案を提供します。
まず、防犯チェーンの原理を説明します。httpプロトコルでは、一つのページから別のページにジャンプすると、httpヘッダフィールドの中にRefererがあります。画像サーバは、Refererが所定のドメイン名から来ているかどうかを検出することにより、防犯チェーンを行う。
盗用サイトがhttpsのprotocolであり、画像リンクがhttpであれば、httpsからhttpへの要求は安全性の規定によりrefererを持たずに、防犯チェーンの迂回が可能となります。
 
私の解決策の原理はiframeを使って画像の盗難防止チェーンを回って、具体的にはページの中のピクチャーの住所を取って、それからこのピクチャーを1つのiframeの中に置いて、それから新しいiframeをもとのピクチャーの位置に替えて、それからもとのピクチャーを取り除いて、完璧に解決します。
具体的なコードは以下の通りです
 

 $(document).ready(function() {
    //  Class arcContent     img
    var imglist=$(".mainList img");
    //       ,  ID divArticle     img
    //var imglist=$("#divArticle img");
    for(var i=0;i<imglist.length;i++){ 
    	if(imglist[i].getAttribute('src')){
    		url = new URL(imglist[i].getAttribute('src')); 
        	var frameid = 'frameimg' + Math.random();
        	window.img = '<img id="img" width="158" height="108" src=\''+url+''+Math.random()+'\' /><script>window.onload = function() { parent.document.getElementById(\''+frameid+'\').height = document.getElementById(\'img\').height+\'px\'; }<'+'/script>';
    		$(imglist[i]).parent().empty().append('<iframe id="'+frameid+'" src="javascript:parent.img;" frameBorder="0" scrolling="no" width="158" height="108"></iframe>');
        }
    }
});