# Saving Files

Use [`saveAs`](https://www.telerik.com/kendo-angular-ui-develop/components/file-saver/api/saveas) whenever your application generates file content in the browser and needs to deliver it to the user without a round-trip to the server. To trigger a download of a file already hosted on a server, use the native HTML [`download`](https://developer.mozilla.org/en-US/docs/Web/HTML/Reference/Attributes/download) attribute on an anchor element instead.

The function triggers a file download on the client machine. It accepts a data [URI](https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/Data_URIs) or a [Blob](https://developer.mozilla.org/en-US/docs/Web/API/Blob) and a file name.

An optional [`SaveOptions`](https://www.telerik.com/kendo-angular-ui-develop/components/file-saver/api/saveoptions) object lets you route downloads through a [server proxy](https://www.telerik.com/kendo-angular-ui-develop/components/file-saver/server-proxy). This approach is recommended for large files or environments that restrict client-side saves.

```js
import { saveAs, encodeBase64 } from '@progress/kendo-file-saver';

const notes = "Meeting notes";
const dataURI = "data:text/plain;base64," + encodeBase64(notes);
saveAs(dataURI, "meeting_notes.txt");
```

The following demo shows how to save a simple text file generated in the browser.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/file-saver/overview/source.txt)

## Saving a Blob

The [`saveAs`](https://www.telerik.com/kendo-angular-ui-develop/components/file-saver/api/saveas) function also accepts a [`Blob`](https://developer.mozilla.org/en-US/docs/Web/API/Blob) directly, which skips the base64 encoding step entirely and is often simpler when the content is already in memory, whether as a string or as raw bytes.

Saving a Blob through a [server proxy](https://www.telerik.com/kendo-angular-ui-develop/components/file-saver/server-proxy) is not supported. When a proxy is involved, build a data URI instead—see [Saving Binary Data](https://www.telerik.com/kendo-angular-ui-develop/components/file-saver/save-as#saving-binary-data) for the data URI equivalent of binary content.

```js
import { saveAs } from '@progress/kendo-file-saver';

const content = new Blob(["line 1\nline 2\n"], { type: "text/plain" });
saveAs(content, "report.txt");
```

The following demo generates a daily sales summary in memory and saves it as a text file from a `Blob`.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/file-saver/blob/source.txt)

## Saving XML Content

Save XML content either as a [`Blob`](https://developer.mozilla.org/en-US/docs/Web/API/Blob) or as a base64 data URI built with [`encodeBase64`](https://www.telerik.com/kendo-angular-ui-develop/components/file-saver/api/encodebase64).

Both approaches produce an identical `.xml` file—choose the `Blob` when you already have a `Blob`-producing API (for example, an XML serializer), and the data URI when a server proxy is involved.

```js
import { saveAs, encodeBase64 } from '@progress/kendo-file-saver';

const xml = '<order id="10248"><customer>Café Alfreds</customer></order>';

const xmlBlob = new Blob([xml], { type: "application/xml" });
saveAs(xmlBlob, "order-10248.xml");
```

```js Save from Data URI
import { saveAs, encodeBase64 } from '@progress/kendo-file-saver';

const xml = '<order id="10248"><customer>Café Alfreds</customer></order>';

const dataURI = "data:application/xml;base64," + encodeBase64(xml);
saveAs(dataURI, "order-10248.xml");
```

The following demo shows how to save XML content generated in the browser.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/file-saver/xml/source.txt)

## Saving Binary Data

Use a base64 data URI instead of a `Blob` for binary formats such as PDF or XLSX when a [server proxy](https://www.telerik.com/kendo-angular-ui-develop/components/file-saver/server-proxy) is involved, since saving a `Blob` through a proxy is not supported. The [`encodeBase64`](https://www.telerik.com/kendo-angular-ui-develop/components/file-saver/api/encodebase64) function only accepts strings, so encode raw bytes with the built-in `btoa` function instead:

```js
import { saveAs } from '@progress/kendo-file-saver';

// pdfBytes is a Uint8Array produced by a PDF generation library
const base64 = btoa(Array.from(pdfBytes, b => String.fromCharCode(b)).join(''));
const dataURI = "data:application/pdf;base64," + base64;
saveAs(dataURI, "document.pdf");
```

The following demo shows how to save a PDF file generated in the browser.

[Demo Source](https://demos.telerik.com/kendo-angular-ui/demos/file-saver/pdf/source.txt)

## Next Steps

* [Base64 Encoding](https://www.telerik.com/kendo-angular-ui-develop/components/file-saver/encode-base64)
* [Server Proxy](https://www.telerik.com/kendo-angular-ui-develop/components/file-saver/server-proxy)
* [File Saver API](https://www.telerik.com/kendo-angular-ui-develop/components/file-saver/api)