# Offering the output image for download
Using the web [URL.createObjectURL](https://developer.mozilla.org/en-US/docs/Web/API/URL/createObjectURL) API we can turn a file object into a URL and offer it as a download to the client.
To prevent memory leaks we have to revoke the URL with the [URL.revokeObjectURL](https://developer.mozilla.org/en-US/docs/Web/API/URL/revokeObjectURL) function when we no longer need the image.
[Learn more about downloading files in the browser](https://pqina.nl/blog/how-to-prompt-the-user-to-download-a-file-instead-of-navigating-to-it/)
* [ JavaScript](#javascript-panel-0)
* [ React](#react-panel-0)
* [ Vue](#vue-panel-0)
* [ Svelte](#svelte-panel-0)
* [ Angular](#angular-panel-0)
* [ jQuery](#jquery-panel-0)
* [index.html](#index-html-panel-0)
```html
```
* [App.jsx](#App-jsx-panel-0)
* [App.css](#App-css-panel-0)
```jsx
import '@pqina/pintura/pintura.css';
import './App.css';
import { useRef } from 'react';
import { PinturaEditor } from '@pqina/react-pintura';
import { getEditorDefaults } from '@pqina/pintura';
const editorDefaults = getEditorDefaults();
const downloadFile = (file) => {
// Create a hidden link and set the URL using createObjectURL
const link = document.createElement('a');
link.style.display = 'none';
link.href = URL.createObjectURL(file);
link.download = file.name;
// We need to add the link to the DOM for "click()" to work
document.body.appendChild(link);
link.click();
// To make this work on Firefox we need to wait a short moment before clean up
setTimeout(() => {
URL.revokeObjectURL(link.href);
link.parentNode.removeChild(link);
}, 0);
};
function App() {
const editorRef = useRef(null);
const handleEditorProcess = (imageState) => {
downloadFile(imageState.dest);
};
return (
```
* [app.component.ts](#app-component-ts-panel-0)
* [app.component.html](#app-component-html-panel-0)
* [app.component.css](#app-component-css-panel-0)
* [app.module.ts](#app-module-ts-panel-0)
```javascript
import { Component, ViewChild } from '@angular/core';
import { getEditorDefaults } from '@pqina/pintura';
const downloadFile = (file: File): void => {
// Create a hidden link and set the URL using createObjectURL
const link = document.createElement('a');
link.style.display = 'none';
link.href = URL.createObjectURL(file);
link.download = file.name;
// We need to add the link to the DOM for "click()" to work
document.body.appendChild(link);
link.click();
// To make this work on Firefox we need to wait a short moment before clean up
setTimeout(() => {
URL.revokeObjectURL(link.href);
link.parentNode.removeChild(link);
}, 0);
};
@Component({
selector: 'app-root',
templateUrl: './app.component.html',
styleUrls: ['./app.component.css'],
})
export class AppComponent {
@ViewChild('editor') editor?: any;
editorDefaults: any = getEditorDefaults();
handleEditorProcess(imageState: any): void {
this.downloadFile(imageState.dest);
}
}
```
```html
```
```css
::ng-deep .pintura-editor {
height: 600px;
}
```
```javascript
import { BrowserModule } from '@angular/platform-browser';
import { NgModule } from '@angular/core';
import { AppComponent } from './app.component';
import { AngularPinturaModule } from '@pqina/angular-pintura';
@NgModule({
declarations: [AppComponent],
imports: [BrowserModule, AngularPinturaModule],
exports: [AppComponent],
providers: [],
bootstrap: [AppComponent],
})
export class AppModule {}
```
* [index.html](#index-html-panel-0)
```html
```