Troubleshooting

Fix common integration issues quickly

guides
troubleshooting errors debugging cors 401 400

Troubleshooting

Fix common integration issues quickly.

Common Issues & Solutions

Quick fixes for the most common integration problems:

Error 401: Origin Not Allowed

Symptoms: Form submissions fail with "401 Unauthorized" or "Origin not allowed"

Common Causes:

  • Domain not in the form's allowed domains list
  • Missing or incorrect Origin header in request
  • Protocol mismatch (http vs https)
  • Subdomain mismatch (www vs non-www)
  • Port mismatch (localhost:3000 vs localhost:3001)

Solutions:

  1. Check your browser's Network tab for the actual Origin header being sent
  2. Add the exact origin to your form's allowed domains (including protocol and port)
  3. For local development, add http://localhost:3000
  4. Remember: Origins are normalized to lowercase with no trailing slash

Example: If your site is https://www.example.com, add exactly that to allowed domains.

Error 400: Bad Request

Symptoms: Form submission returns 400 status code

Common Causes:

  • Invalid JSON format
  • Missing required fields
  • File upload exceeds size limits
  • Unsupported file type
  • Invalid form field names

Solutions:

  1. Validate your JSON payload with a JSON validator
  2. Check that all required fields are included
  3. Verify file sizes are within limits (default: 5MB per file, 10MB total)
  4. Check file types against allowed extensions
  5. Ensure form field names don't contain invalid characters

Error 429: Rate Limited

Symptoms: "Too Many Requests" error after multiple submissions

Common Causes:

  • Exceeded per-minute rate limits
  • Rapid-fire form submissions during testing
  • Bot traffic or spam attacks

Solutions:

  1. Wait a few minutes before trying again
  2. Implement client-side rate limiting
  3. Add proper debouncing to prevent accidental rapid submissions
  4. Contact support if you need higher rate limits

Files Not Being Sent

Symptoms: Form submits successfully but files don't reach connectors

Common Causes:

  • Missing enctype="multipart/form-data" on form
  • JavaScript not including files in FormData
  • File size exceeds connector limits
  • Unsupported file types

Solutions:

  1. Add enctype="multipart/form-data" to your HTML form
  2. Use FormData for JavaScript submissions with files
  3. Check file sizes against connector limits (MailJet: 8MB total)
  4. Verify file types are supported by your connectors

CORS Errors in Browser

Symptoms: Console shows CORS-related error messages

Common Causes:

  • Preflight request failing
  • Incorrect Origin header
  • Missing allowed domain configuration

Solutions:

  1. Ensure your domain is in the form's allowed domains list
  2. Check that the Origin header matches exactly (case-sensitive)
  3. For development, add http://localhost:3000 or your dev server URL
  4. Verify you're using HTTPS if your allowed domain uses HTTPS

Form Submission Never Completes

Symptoms: Form submission hangs or times out

Common Causes:

  • Network connectivity issues
  • Firewall blocking requests
  • Form ID doesn't exist
  • Server overload

Solutions:

  1. Check network connectivity and DNS resolution
  2. Verify the form ID is correct
  3. Try submitting from a different network
  4. Check FormFeeder status page for service issues

Debugging Steps

1. Check Browser Network Tab

  1. Open browser Developer Tools (F12)
  2. Go to Network tab
  3. Submit your form
  4. Look for the request to FormFeeder
  5. Check the status code, headers, and response

2. Verify Form Configuration

# Test with curl to isolate issues
curl -X POST "https://api.formfeeder.io/v1/form/your-form-id" \
  -H "Content-Type: application/json" \
  -H "Origin: https://your-domain.com" \
  -d '{"name":"Test","email":"[email protected]"}' \
  -v

3. Test with Simple HTML

Create a minimal test form:

<!DOCTYPE html>
<html>
<body>
  <form action="https://api.formfeeder.io/v1/form/your-form-id" method="POST">
    <input name="name" value="Test User" required>
    <input name="email" value="[email protected]" type="email" required>
    <button type="submit">Test Submit</button>
  </form>
</body>
</html>

4. Check Response Bodies

Always check the response body for detailed error messages:

fetch('https://api.formfeeder.io/v1/form/abc123', {
  method: 'POST',
  body: formData
}).then(async response => {
  if (!response.ok) {
    const error = await response.text();
    console.error('Form submission failed:', error);
  }
});

Getting Help

Error Codes Reference

Code Description Action
400 Bad Request Check request format and data
401 Unauthorized Verify domain is allowed
403 Forbidden Check form permissions
413 Payload Too Large Reduce file sizes
429 Rate Limited Wait and retry
500 Server Error Contact support

Diagnostic Information to Collect

When contacting support, provide:

  1. Form ID: The specific form having issues
  2. Domain: The domain where the form is hosted
  3. Browser: Browser type and version
  4. Error Message: Exact error message or status code
  5. Network Request: Details from browser developer tools
  6. Sample Code: The HTML/JavaScript code you're using

Contact Support

  • Email: [email protected]
  • Response Time: Within 24 hours
  • Include: Form ID, domain, and error details

Community Resources

Prevention Tips

Development Best Practices

  1. Test Early: Test form integration during development
  2. Error Handling: Implement proper error handling in JavaScript
  3. Validation: Add client-side validation for better UX
  4. Monitoring: Set up alerts for form submission failures

Production Deployment

  1. Domain Configuration: Double-check allowed domains before launch
  2. Rate Limits: Configure appropriate limits for your use case
  3. Monitoring: Set up uptime monitoring for your forms
  4. Backup Plans: Have fallback form handling if needed

Security Considerations

  1. HTTPS Only: Always use HTTPS for production forms
  2. Domain Restrictions: Keep allowed domains list minimal
  3. Rate Limiting: Enable appropriate rate limits
  4. File Types: Restrict uploaded file types as needed

On this page