Authentication Guide
Learn how to securely authenticate with BlogNow using API keys and protect your blog content with CORS domain restrictions.
Security Overview
BlogNow uses public API keys for authentication, designed specifically for client-side use. To protect your content and prevent unauthorized access, you can restrict API key usage to specific domains using CORS.
- Public API keys are safe for client-side applications
- CORS domain restrictions add an extra layer of security
- No sensitive data exposed through public endpoints
API Keys
Public API Keys
Your public API key is used to access published blog posts and public content
Note: API keys are not created by default. You need to manually create them in your dashboard. This gives you full control over when and how API access is granted.
How to Create Your API Key:
- Log in to your BlogNow Dashboard
- Navigate to Settings → API Keys
- Click Create New API Key
- Give your API key a descriptive name (e.g., ‘Production’, ‘Development’, ‘Staging’)
- Configure allowed domains (required) - Add at least one domain to the allowlist
- Click Create to generate your API key
- Copy the API key immediately - it won't be shown again for security reasons
Example API Key Format:
pk_live_1234567890abcdef1234567890abcdef
Public API Keys are Client-Safe: BlogNow public API keys are specifically designed for client-side use and only provide read access to published content. They do not expose any sensitive data or allow modifications to your blog.
CORS Domain Restrictions
Protect Your API Key with Domain Restrictions
Limit which domains can use your API key to prevent unauthorized access
What are CORS Domain Restrictions?
CORS (Cross-Origin Resource Sharing) domain restrictions allow you to specify which domains are authorized to make API requests using your public API key. This prevents other websites from using your API key to access your blog content.
Required: CORS domain restrictions are mandatory. By default, all domains are blocked until you explicitly add them to the allowed domains list. Your API key will not work until you configure at least one allowed domain.
How to Configure CORS Domains:
- Go to your BlogNow Dashboard
- Navigate to Settings → API Keys
- Find the Allowed Domains section
- Add your domain(s) to the allowlist
- Click Save Changes
Example Domain Configurations:
Production domain:
https://yourblog.com
Multiple domains (production + staging):
https://yourblog.com
https://staging.yourblog.com
Development environment:
http://localhost:3000
Domain Format Guidelines:
- Include the protocol:
https://
orhttp://
- Use exact domain matches (subdomains matter)
- For localhost, include the port:
http://localhost:3000
- Add one domain per line
Security Best Practice: Always configure CORS domain restrictions for production applications. This prevents unauthorized websites from using your API key and helps you maintain control over who can access your blog content.
Using API Keys in Your Application
Environment Variables
Store your API key securely in environment variables
Different frameworks use different environment variable naming conventions. Choose the appropriate format for your framework:
# Next.js
NEXT_PUBLIC_BLOGNOW_API_KEY=your_api_key_here
# Vite / Astro
VITE_BLOGNOW_API_KEY=your_api_key_here
PUBLIC_BLOGNOW_API_KEY=your_api_key_here
# Create React App
REACT_APP_BLOGNOW_API_KEY=your_api_key_here
# Nuxt 3
NUXT_PUBLIC_BLOGNOW_API_KEY=your_api_key_here
Note: Environment variables prefixed with NEXT_PUBLIC_
, VITE_
, PUBLIC_
, or REACT_APP_
are exposed to the client-side code. This is intentional and safe for BlogNow public API keys.
Best Practices for API Key Management
Use Different API Keys for Different Environments
Create separate API keys for development, staging, and production to maintain security and control
Why Use Separate Keys?
- Isolate environments: Development and testing won't affect production
- Easy revocation: Disable dev/staging keys without impacting production
- Better tracking: Monitor usage per environment
- Security hygiene: Reduce risk if a development key is accidentally exposed
Recommended Key Setup:
Production API Key
For your live website (https://yourblog.com)
Staging API Key
For your staging environment (https://staging.yourblog.com)
Development API Key
For local development (http://localhost:3000)
Disable or Revoke Non-Production Keys
Clean up unused API keys to maintain security
Important: After completing development and testing, disable or revoke API keys that are no longer needed.
- •Disable temporary keys created for testing
- •Revoke keys if you suspect they've been compromised
- •Remove keys for deprecated environments
How to Disable/Revoke Keys:
- Go to Settings → API Keys in your dashboard
- Find the key you want to disable
- Click Disable (temporary) or Revoke (permanent)
- Confirm your action
Common CORS Configurations
Development Environment
For local development, add your localhost domain:
http://localhost:3000
Don't forget to include the port number if you're using a custom port.
Staging & Production
Add both staging and production domains:
https://staging.yourblog.com
https://yourblog.com
Use separate API keys for each environment.
Multiple Subdomains
Add each subdomain separately:
https://blog.yourdomain.com
https://news.yourdomain.com
https://www.yourdomain.com
Wildcard subdomains are not supported for security reasons.
Preview Deployments
For platforms like Vercel with preview URLs:
https://your-app.vercel.app
https://your-app-*.vercel.app
Create a separate API key for preview environments.
Troubleshooting CORS Errors
Common CORS Error Messages:
Access to fetch at 'https://api.blognow.tech/...' from origin 'https://yourdomain.com' has been blocked by CORS policy
This error means your domain is not in the allowed domains list, or you haven't configured any allowed domains yet.
Remember: All domains are blocked by default. You must add your domain to the allowed list before your API key will work.
Solutions:
- Add your domain to the allowed domains list in the API key settings
- Verify the domain in the error message matches exactly what's in your allowed domains list
- Check that you included the protocol (http:// or https://)
- Ensure there are no trailing slashes in your domain configuration
- Clear your browser cache and try again after adding the domain
Next Steps
Get Your API Key
Log in to your dashboard to view and configure your API key
SDK Documentation
Learn how to use the BlogNow SDK in your application
Need Help?
Having trouble with authentication or CORS configuration? We're here to help!