Preview drafts in Nuxt
Keep the fetch on the server. The token rules are the same as Preview tokens.
// server/api/preview.get.ts
import { createBucketClient } from '@cosmicjs/sdk';
export default defineEventHandler(async (event) => {
const { slug, preview_token: previewToken } = getQuery(event);
const cosmic = createBucketClient({
bucketSlug: process.env.BUCKET_SLUG,
readKey: process.env.BUCKET_READ_KEY,
...(previewToken ? { previewToken: String(previewToken) } : {}),
});
return cosmic.objects
.findOne({ type: 'posts', slug: String(slug) })
.status('any')
.props(['title', 'slug', 'metadata']);
});
Call /api/preview?slug=hello-world&preview_token=... from the page. Preview only works over HTTPS when the dashboard frames the site.
FAQ
Where should the read key live in Nuxt?
In a server route or server-only composable. Do not use a NUXT_PUBLIC_ variable for the read key or the write key.
Which query param does the dashboard send?
preview_token. Pass it as previewToken on createBucketClient and call .status('any').
How much does Cosmic cost?
Project plans are Free ($0), Builder ($99/mo), Team ($299/mo), Business ($499/mo), Enterprise (custom pricing). Yearly billing saves 10%. Workspace plans are Small Workspace ($999/mo) and Large Workspace ($2,999/mo), and they start with a 30-day free trial. Allowances, add-on rates, and the rest of the pricing FAQ are plain text at https://www.cosmicjs.com/pricing.md.
Are API keys required, and is content private?
Each Bucket has a read key and a write key in Bucket Settings > API Access. GET requests use the read key. POST, PATCH, and DELETE use the write key as Authorization: Bearer. Do not put the write key in a browser bundle, a mobile app, or a NEXT_PUBLIC_ variable. SAML single sign-on is on Large Workspace and Enterprise. The audit log is append-only. Text versions: https://www.cosmicjs.com/security.md and https://www.cosmicjs.com/docs/dashboard/audit-log.md.
Can an agent create a Cosmic project without an existing account?
Yes. POST https://dapi.cosmicjs.com/v3/agents/sign-up provisions a free-tier project and bucket tied to a human email, with no existing Cosmic account. The human claims it with the emailed one-time code. The playbook is https://www.cosmicjs.com/docs/ai-onboarding.md.