私がやりたいこと
javaで出力したファイルが、ブラウザの右上で「ダウンロード完了」と表示される時、検知したい。
ネットで調べた結果、主に以下三つでダウンロード完了の検知をしていた。
- chrome.dounloads.onClicked.addListener
- fetch・then
- cookie
1. chrome.dounloads.onClicked.addListener
Chromeの拡張機能を使うことになるが、私の環境では使えなかったので却下。
こんな感じだって。
chrome.downloads.onChanged.addListener(function (delta) {
if (delta.state && delta.state.current === 'complete') {
console.log('ダウンロード完了:', delta);
}
});
2. fetch・then
thenでレスポンスを取得した後にファイルがダウンロード完了したかを検知することができるが、
springのform:formタグをそのまま使えなかった。
FormDataというオブジェクトに無理やり入れて送信できるかもしれないが、、面倒なので一応却下。
こんな感じ。
async function postData() {
const response = await fetch('/行きたいURL', {
method: 'POST',
body: ここが問題だった。JSONだったら楽だけど、私はカスタムオブジェクトだった。
});
//レスポンスが来たら、
if (response.ok) {
console.log('検知');
} else {
console.error(response.status);
}
}
3. cookie
これで検知できた。
クッキーを使って、ダウンロード完了の状態を追跡する。
ダウンロードが完了したら、サーバー側でクッキーを設定する。→クライアント側でクッキーの値を監視する。(setInterval)
サーバー側(JAVA response出力の前)
Cookie cookie = new Cookie("download_status", "completed");
cookie.setPath("/");
response.addCookie(cookie);
クライアント側(JS)
// 監視開始(ダウンロードボタンのonClick()とかで)
const intervalId = window.setInterval(function() {
let cookie = document.cookie;
if (cookie.includes("download_status=completed")) {
console.log("ダウンロード完了");
document.clearInterval(intervalId); // 監視を停止
document.cookie = 'download_status=; expires=Thu, 01 Jan 1970 00:00:00 UTC; path=/;';//cookie削除
}
}, 3000); // 3秒ごとに監視。
( ・。。・ )🖐
間違っている内容がありましたら、教えて頂ければ喜びます。