Send a request via ajax and
Backend processed images using "Intervention Image"
I'd like to download it locally.
I couldn't convert the processed image data to blob and it was blocked.
I heard that there are functions to return to the Intervention Image in stream.
I was trying, but
When I came back to the front desk, I ended up writing.
Could someone help me?
Thank you for your cooperation.
$.ajax({
type: 'GET',
url: '/export/img',
data: {
'img_type': imgType
},
headers:{
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
}).done(response)=>{
const blob = new Blob([response], {type: 'image/png'});
const filename = 'test.png'
const downloadUrl=(window.URL||window.webkitURL).createObjectURL(blob);
constlink = document.createElement('a');
link.href=downloadUrl;
link.download=filename;
link.click();
(window.URL||window.webkitURL).revokeObjectURL(downloadUrl);
}).fail(()=>{
$("#errorModal").modal("show");
});
public function export(Request$request)
{
// image generation processing
$img = $this->service->createImg($request->img_type);
return$img->stream('png') ->__toString();
}
}
I solved myself!!
function exportImg(imgType){
$.ajax({
type: 'GET',
url: '/export/img',
data: {
'img_type': imgType
},
headers:{
'X-CSRF-TOKEN': $('meta[name="csrf-token"]').attr('content')
}
}).done(response)=>{
constbase64 = response.encoded;
a = document.createElement("a");
a. href=base64;
a. download = dayjs().format("YYYYMMDDHHmmss") + ".png";
a.click();
$("#spinner").css("display", "none");
}).fail(()=>{
$("#errorModal").modal("show");
});
}
public function export(Request$request)
{
// image generation processing
$img = $this->service->createImg($request->img_type);
return$img->encode('png')->encode('data-url');
}
© 2024 OneMinuteCode. All rights reserved.