Browser quickstart

Create an Eazip Cloud job directly from React or browser JavaScript with a publishable key.

Use the browser integration when your frontend already knows which file URLs belong in the ZIP. Eazip.js creates the Cloud job without a backend endpoint.

Create a Public App

Use a name your team will recognize, such as Acme Photos.

Allow your app and file hosts

Under Websites that can use this key, add each browser origin that will create Cloud jobs:

http://localhost:3000
https://app.acme.example

Under Where the files come from, add the hosts Eazip may fetch:

cdn.acme.example
acme-exports.s3.amazonaws.com

Browser origins include the scheme and optional port. Source hosts are hostnames without a path or query.

Test source reachability

Eazip fetches files from its servers. Test with a real URL from each source host, even if that URL already works in your browser.

Copy the public key and install Eazip.js

Select Create app & get key and copy the generated pk_ez_... value. Then install the package for your application:

npm install @eazip/react

npm install @eazip/core

Create your first Cloud job

Pass the public key, file URLs, and strategy: 'cloud':

App.tsx

'use client';

import { useEazip, EazipTray } from '@eazip/react';

export default function App({ urls }: { urls: string[] }) {
  const zip = useEazip();

  return (
    <>
      <button
        onClick={() =>
          zip.download({
            strategy: 'cloud',
            publicKey: process.env.NEXT_PUBLIC_EAZIP_KEY,
            files: urls,
          })
        }
      >
        Download as ZIP
      </button>

      <EazipTray />
    </>
  );
}

app.js

import { createZip } from '@eazip/core';

const urls = [
  'https://cdn.acme.example/report.pdf',
  'https://cdn.acme.example/photos.zip',
];

document.querySelector('#download').addEventListener('click', async () => {
  const result = await createZip({
    strategy: 'cloud',
    publicKey: import.meta.env.VITE_EAZIP_KEY,
    files: urls,
  });

  result.download();
});

Public keys are browser-safe

A pk_ez_... key is restricted by the origins and source hosts configured for its Public App. Never use a secret zk_... API key in frontend code.

Troubleshooting

Symptom	Check
Origin error before a job starts	Add the exact browser origin, including its port.
Job starts but fetching fails	Confirm the source host is allowed and reachable from Eazip.
Request is rejected by policy	Review the Public App's limits and allowed modes.

Next, read Public keys and origins or follow Create multi-GB ZIP archives with JavaScript.