Security

⚡ 8 min read

Important: Scope of Service

Transcodes is an authentication service, not a security service.

We provide:

✅ WebAuthn-based passwordless authentication
✅ Secure credential storage and verification
✅ JWT token issuance

We do NOT provide:

❌ Protection against client-side attacks (XSS, CSRF, etc.)
❌ Application-level security
❌ Infrastructure security
❌ Comprehensive security solutions

Disclaimer: Your Responsibilities

Client-side security is YOUR responsibility.

Transcodes is NOT liable for:

Attacks originating from compromised client code (XSS, code injection)
Security vulnerabilities in your application
Data breaches due to improper implementation
User devices compromised by malware

You are responsible for securing your application, implementing proper CSP, sanitizing inputs, and following web security best practices.

What is WebAuthn?

WebAuthn (Web Authentication API) is a web standard developed by the W3C and FIDO Alliance that enables passwordless authentication using public-key cryptography. It allows users to authenticate with biometrics (fingerprint, face recognition), security keys, or device PINs instead of passwords.

WebAuthn is the foundation of passkeys—a modern, phishing-resistant authentication method that Transcodes uses to protect your users.

Learn More: For detailed technical specifications and API documentation, visit the MDN Web Authentication API Guide .

How Passkeys Work

Simple flow:

User registers with biometric/security key
Private key stored on device (IndexedDB)
Public key sent to Transcodes
Authentication uses cryptographic signatures
Your app receives a JWT token

Key benefits:

No passwords to remember
Phishing-resistant (origin-bound)
Works across devices via sync

What Transcodes Provides

Component	What We Do
Authentication	Issue JWT tokens after passkey verification
Credential Storage	Store public keys and credential IDs
WebAuthn API	Handle FIDO2/WebAuthn protocol

Component	What We DON’T Do
Authorization	You manage user permissions and roles
Client Security	You prevent XSS, CSRF, injection attacks
Data Encryption	You encrypt sensitive business data
Infrastructure	You secure your servers and networks

What is CSP?

CSP (Content Security Policy) is a security standard that helps prevent cross-site scripting (XSS) attacks by controlling which resources (scripts, stylesheets, images, etc.) your web page is allowed to load and execute.

CSP works by defining a whitelist of trusted sources. The browser will only load resources from these sources and block anything else, making it much harder for attackers to inject malicious code.

Learn More: For detailed technical specifications and best practices, visit the MDN Content Security Policy Guide .

Why CSP is Important for Transcodes

When using Transcodes SDK, your application needs to load resources from Transcodes CDN and connect to Transcodes APIs. CSP helps ensure:

✅ Only trusted Transcodes resources are loaded
✅ XSS attacks are prevented
✅ Unauthorized scripts cannot execute
✅ Your application’s security posture is improved

Without proper CSP configuration, your browser may block Transcodes SDK resources, causing authentication features to fail.

How to Configure CSP for Transcodes

Add the CSP meta tag to your HTML <head> section:


<meta
  http-equiv="Content-Security-Policy"
  content="
  script-src 'self' https://cdn.transcodes.link;
  connect-src 'self' https://api.transcodes.io;
  frame-src 'self' https://auth.transcodes.io;
"
/>

Note: This CSP configuration only restricts the resources needed for Transcodes SDK. If you want stricter security, you can add default-src 'self'; at the beginning, but this will also restrict images, stylesheets, and other resources to your domain only.

Where to add:

React/Vue/Next.js: In your root index.html or layout.tsx file
WordPress: In your theme’s header.php or using a plugin like WPCode
Static HTML: In the <head> section of your HTML file

CSP Directives Explained

Directive	Purpose	Transcodes Requirement
`script-src`	Allowed sources for JavaScript	`'self'` + `https://cdn.transcodes.link`
`connect-src`	Allowed URLs for fetch, XMLHttpRequest, WebSocket	`'self'` + `https://api.transcodes.io`
`frame-src`	Allowed sources for `<iframe>` elements	`'self'` + `https://auth.transcodes.io`

Client Security Best Practices

Critical: These are YOUR responsibilities to prevent client-side attacks.

1. Prevent XSS (Cross-Site Scripting)


// ❌ NEVER do this - vulnerable to XSS
element.innerHTML = userInput;
 
// ✅ Use textContent or sanitize
element.textContent = userInput;

Essential XSS protections:

Sanitize all user inputs
Use Content Security Policy (CSP)
Escape HTML in templates
Validate data from all sources

3. Require HTTPS

WebAuthn requires HTTPS (except localhost for development).

Use valid TLS certificates
Enable HSTS
No mixed content

4. Secure Token Handling


// ✅ Use SDK methods
const token = await transcodes.token.getAccessToken();
 
// ❌ NEVER expose tokens
console.log(token); // Don't do this in production
localStorage.setItem('token', token); // SDK handles this

Token security rules:

Never log tokens in production
Never include tokens in URLs
Never store tokens in cookies without httpOnly flag
Always verify tokens on your server

5. Validate on Server-Side

Never trust client-side validation alone.


// Backend (Node.js example)
const jwt = require('jsonwebtoken');
 
// Always verify JWT on your server
const decoded = jwt.verify(token, TRANSCODES_PUBLIC_KEY, {
  algorithms: ['RS256'],
  issuer: 'https://auth.transcodes.io',
  audience: 'YOUR_PROJECT_ID',
});

Security Checklist

Before Production

HTTPS enabled with valid certificate
CSP headers configured
All user inputs sanitized
Server-side token verification implemented
XSS/CSRF protections in place
Security headers configured (HSTS, X-Frame-Options, etc.)
Rate limiting on authentication endpoints
Error messages don’t leak sensitive info

Ongoing

Keep SDK updated
Monitor for security advisories
Conduct security audits
Review access logs

Need Help?

Implementation Guide - Detailed security setup
Privacy & Data Handling - Data practices
MDN Web Security - General web security
OWASP Top 10 - Common vulnerabilities

Security Issues: security@transcodes.io