Принудительно загрузить файл изображения, который возвращается как HTTP-ответ с использованием laravel, vue, axios и вмешательства.

Question

Я пытаюсь настроить базу данных медиаресурсов, используя образы Laravel, Vue, Axios и Intervention.Я хочу, чтобы пользователь мог установить желаемую высоту и ширину изображения перед его загрузкой.Затем он отправляется на контроллер с помощью пост-запроса axios.Внутри контроллера изображение вмешательства работает своим волшебством (k) и возвращает мой измененный файл в качестве ответа.

Теперь я хочу, чтобы изображение, которое возвращается в качестве ответа, инициировало загрузку.Что мне нужно сделать с моим аксиос-ответом?

Вот что у меня сейчас есть:

Аксиос-запрос:

resize(file) {
        this.file = file;

        let formData = new FormData();
        formData.append('imageHeight', this.imageHeight);
        formData.append('imageWidth', this.imageWidth);

        axios.post('files/resize/' + file.id, formData).then(response => {
            console.log(response.data);
        })
        .catch(error => {
            console.log(error);
            this.errors = error.response.data.errors;
            this.showNotification(error.response.data.message, false);
            this.fetchFile(this.activeTab, this.pagination.current_page);
        });
    }

Контроллер:

public function resize($id, Request $request)
{
    $file = File::where('id', $id)->where('user_id', Auth::id())->first();

    $originalImage = $file->getName($file->type, $file->name, $file->extension);
    $originalImagePath = Storage::get($originalImage);

    $imageHeight = $request['imageHeight'];
    $imageWidth = $request['imageWidth'];

    if ($img = Image::make($originalImagePath)) {
        return $img->resize($imageWidth,$imageHeight)->response();
    }
}

Answer 1

Вам нужно, чтобы заголовок ответа Content-Disposition был attachment, а не inline.

http://image.intervention.io/use/http