vuejs初心者です
以下、vuejsでダウンロードソースを作成し、axiosでファイルをgetするソースを書きました
以下でファイルは取得されてきました おそらくバイナリデータが取れたと思われるのですが
ret=this.$axios.$get('ダウンロードサーバーAPIurl', { responseType : 'blob' })
var fileBlob= []
fileBlob = new Blob([ret.data]);
let url = URL.createObjectURL(fileBlob);
let a = document.createElement('a');
a.href = url;
a.download = 'name.png';
document.body.appendChild(a);
a.click();
ダウンロードされるファイルを開くと
このファイルはサポートされていない形式です
と言われてしまい、画像として開けません
ダウンロードしたファイルはpngの画像になります。
おそらくバイナリデータをテキスト変換し、そこからバイナリに戻そうとしたためだと思いますが
ダウンロードしたままのファイルを開けるようにそのまま落とすにはどうすればよいでしょうか
なお
fileBlob = new Blob([ret.data]); にtype pngと記載してもダメでした
試しにDLしたこの画像ファイルはpngなのですが、pngとは限らないので、ダウンロードしたファイルの名称を別から取得し、そちらの拡張子を当てる必要があるので、拡張子は固定指定はできないです
APIのバグとかではありません
APITesterにて、APIを同じように実行したところ、ファイルが取得され、正しく画像がダウンロード&表示されたため、
APIは正しく動いています
APITesterと同じようにダウンロードしたいだけなのです
<追記>
ダウンロードしたAPItesterでの正しいファイルと
VueJSでの正しくない形式ファイルを両方テキストエディタで開くと、中身が異なりました
APITESTERでのファイルは元にUPLOADした画像ファイルと同じ文字列が並んでいましたが、
Vuejsからダウンロードしたファイルは文字列が異なっていました
つまり、何らかの間違ったバイナリデータの変換が行われてしまっているのですが、理由がわかりません
どなたか教えてください
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。