Vue App Launch Security Checklist: 14 Items Before Going Live

TL;DR

Vue apps run in the browser, so secrets must stay on the server. Before launch, check for v-html usage with untrusted content, verify VITE_ env vars don't contain secrets, ensure backend validates all inputs, and test authentication works server-side.

API Keys and Secrets 4

Verify no secret keys in client codeVue code is visible in browser. Secret keys must stay server-side.

Check VITE_ environment variablesThese are bundled into the build. Only use for public values.

Search for hardcoded secretsGrep for sk_, pk_, api_key, password, secret, token

Review Network tab in DevToolsCheck no sensitive data is exposed in API requests/responses

XSS Prevention 3

Audit v-html usagev-html renders raw HTML. Only use with trusted, sanitized content.

Check URL bindingsVerify :href and :src don't allow javascript: URLs from user input

Test with malicious inputEnter <script> tags in form fields, verify they're escaped

Authentication and API 4

Backend validates authenticationDon't trust Vuex/Pinia auth state. Server must verify on every request.

Test protected routes directlyNavigate to protected URLs in incognito mode without logging in

Backend validates all inputsClient validation can be bypassed. Server must validate everything.

CORS configured correctlyAPI should only accept requests from your domain

Build and Deployment 3

Source maps disabled in productionCheck vite.config.js for sourcemap: false in production

HTTPS enforcedhttp:// should redirect to https://

Run automated security scanCatch issues you may have missed with manual review

Is Vue.js secure for production?

Vue.js uses template compilation that prevents most XSS attacks by default. However, v-html directive can introduce XSS if used with untrusted content, and like all client-side frameworks, Vue apps must never contain secret API keys.

How do I secure API keys in Vue?

Never put secret keys in Vue code. Create a backend API that holds your secrets and makes authenticated calls on behalf of your Vue app.

TL;DR

API Keys and Secrets 4

XSS Prevention 3

Authentication and API 4

Build and Deployment 3

Is Vue.js secure for production?

How do I secure API keys in Vue?

Scan Your Vue App

Related Articles

v0 Component Launch Security Checklist: 14 Items Before Going Live

Vercel Deployment Launch Security Checklist: 14 Items Before Going Live

Viral Ready Security Checklist: 15 Items Before Going Viral

API Public Launch Security Checklist: 16 Items Before Opening Your API

Beta Launch Security Checklist: 14 Items Before Inviting Beta Users

Vue App Launch Security Checklist: 14 Items Before Going Live