8

次の例を考えると

<img id="my_img" src="images/current.png" />

<script language="javascript">
var i = document.getElementById('my_img');
var filetime = i.is_there_any_method_for_this(); // ?????
i.title = 'image created: ' + filetime; // don't care about formating now
</script>

is_there_any_method_for_this();存在するかどうか、または表示された画像のファイル作成 (または変更) 時間にアクセスできるかどうかを尋ねたいと思います。

4

7 に答える 7

5

Apache がデフォルトで最終変更時刻をヘッダーとして送信しているように見えることが明らかになりました。あなたが説明したように、JavaScriptメソッドを使用するだけでは、このヘッダーを取得することはできません。AJAX を使用してファイルを再ダウンロードし、再ダウンロードしたイメージの最終変更時刻 (ほとんどの場合、元のイメージと同じになります) を確認することにより、100% 信頼性が低く効率的な方法でそれを行うことができます。

AJAX呼び出しに小さなjQueryを使用しています...

<img id="my_img" src="images/current.png" />

<!-- include jQuery - better done in the head -->
<script src="http://code.jquery.com/jquery-1.7.2.min.js"></script>

<script language="javascript">
var i = document.getElementById('my_img');
$.get(i.src,function(data,status,xhr){
    // in the callback - after the ajax request completes...
    var filetime = xhr.getResponseHeader('Last-Modified');
    i.title = 'image created: ' + filetime; // don't care about formating now
})
</script>

このメソッドは、サーバーが正しいLast-Modifiedヘッダーを送信した場合にのみ機能し、以前に読み込まれた画像とは異なる場合があり (通常はそうではありません)、タイムスタンプが必要な画像を再ダウンロードすることで余分なトラフィックと要求が発生します。

可能であれば、より良い解決策は、サーバーに小さなデータフィードを介してファイルのタイムスタンプを公開させることだと思います。おそらく、ファイル名をキーとして、各ファイルの最終更新日およびその他のメタデータを示す JSON を送信します...サーバーは次のようなものを送信する必要があります。

{
    "images/current.png":{"last-modified":"2012-08-07","filesize":"1056 kb"},
    "images/raisin.png":{"last-modified":"2012-08-04","filesize":"334 kb"},
    "images/sultana.png":{"last-modified":"2012-08-02","filesize":"934 kb"}
}

これにより、クライアント側を（ を使用して）簡単に解析しJSON.parse()、必要なすべてのファイルサイズをより効率的かつ確実に決定できます。

于 2012-08-08T08:51:24.610 に答える
3

サーバーからの実際のファイル名またはメタ情報なしで、クライアント (javascript が実行される場所) にファイルのコピーが送信されるため、これは不可能です。これを可能にする唯一の方法は、クライアントがルックアップできる方法でサーバーが何らかの方法でファイル属性を喜んで宣言する場合ですが、これを行うにはサーバー コードを制御できる必要があります。

于 2012-08-08T08:07:03.303 に答える
2

これは、従来HTMLの一部として読み込まれた画像では不可能ですが、AJAXを介して読み込むと、画像の最終変更日時を取得できます（サーバーがこのヘッダー情報を送信する場合）。

$.get('path/to/img').done(function(response, result, xhr) {
    alert("last modified "+xhr.getResponseHeader('last-modified'));
});
于 2012-08-08T08:10:43.467 に答える
2

次のようなものを使用して詳細を取得できます。

var fso, f, s;
fso = new ActiveXObject("Scripting.FileSystemObject");
f = fso.GetFile(filespec);
s = f.Path.toUpperCase() + "<br>";
s += "Created: " + f.DateCreated + "<br>";
s += "Last Accessed: " + f.DateLastAccessed + "<br>";
s += "Last Modified: " + f.DateLastModified
于 2012-08-08T08:11:54.530 に答える
2

DOM 仕様の image 要素には、画像のファイル時間のプロパティがないため、image 要素の直接 DOM プロパティから取得することはできません。

デジタル カメラで記録された多くの画像には、ファイルの作成時刻を含むメタデータ (EXIF) が含まれています。JavaScript を使用して EXIF メタデータを読み取り、EXIF から作成時間を読み取ることができます。実際、ブラウザ内の画像からこの種のメタデータを表示するブラウザ プラグインがいくつかあります。

于 2012-08-08T08:08:16.727 に答える
1

img ファイルの種類によっては、ダウンロードして、一部のヘッダーでメタ情報を取得できます (形式によって異なります)。

しかし、言及されているように、たとえばいくつかの ajax がそれを行います。

于 2012-08-08T08:16:23.603 に答える