Skip to content

feat: add CORS support and create frontend integration example #6

@Pertempto

Description

@Pertempto

Description

Add Cross-Origin Resource Sharing (CORS) support to enable browser-based clients and create a simple frontend example demonstrating the complete API integration. This completes the simple-sync MVP by making it accessible from web applications.

Acceptance Criteria

  • Add CORS middleware to allow cross-origin requests
  • Configure appropriate CORS headers for development and production
  • Create simple HTML/JavaScript frontend example
  • Demonstrate authentication flow (login, get token)
  • Show event retrieval and posting from browser
  • Include ACL management functionality in example
  • Provide clear error handling and user feedback
  • Document frontend integration patterns

Technical Requirements

  • Use Gin CORS middleware or implement custom CORS handler
  • Allow appropriate HTTP methods (GET, POST, PUT, OPTIONS)
  • Set proper Access-Control headers for development
  • Frontend should be vanilla HTML/CSS/JavaScript (no frameworks)
  • Include form-based login and event management
  • Show real-time event updates after posting
  • Handle authentication errors gracefully
  • Provide example of token storage and usage

CORS Configuration

Access-Control-Allow-Origin: * (or specific domains)
Access-Control-Allow-Methods: GET, POST, PUT, OPTIONS
Access-Control-Allow-Headers: Content-Type, Authorization
Access-Control-Allow-Credentials: true

Frontend Example Features

  • Login form with username/password
  • Display current events with filtering
  • Add new events form
  • ACL management interface
  • Token expiration handling
  • Error message display
  • Responsive design for mobile/desktop

Definition of Done

  • CORS is properly configured and working
  • Browser can make authenticated requests to all endpoints
  • Frontend example successfully authenticates users
  • Events can be retrieved and posted from browser
  • ACL permissions can be managed through frontend
  • Example includes proper error handling
  • Documentation shows how to integrate with other frontend frameworks
  • CORS settings are production-ready

Dependencies

  • Requires completion of all previous MVP features
  • Should work with Docker deployment setup
  • Frontend should work with the deployed service

Metadata

Metadata

Assignees

Labels

No labels
No labels

Type

No type

Projects

No projects

Relationships

None yet

Development

No branches or pull requests

Issue actions