A Python Flask application with WebUSB frontend for detecting and communicating with Carlinkit CarPlay dongles.
- 🔌 WebUSB integration for direct browser-to-USB communication
- 🌐 Real-time WebSocket communication between frontend and backend
- 🚗 Automatic Carlinkit dongle detection
- 📡 Bidirectional data streaming
- 📝 Activity logging
- 🎨 Modern, responsive UI
- Python 3.8+
- Chrome, Edge, or Opera browser (WebUSB support)
- HTTPS connection (required for WebUSB)
-
Clone or download this project
-
Create a virtual environment (recommended)
python3 -m venv venv
source venv/bin/activate # On Windows: venv\Scripts\activate- Install dependencies
pip install -r requirements.txtpython app.pyThe app will automatically generate a self-signed SSL certificate and run on https://localhost:5000
Important: Your browser will show a security warning. Click "Advanced" → "Proceed to localhost" to continue.
-
Obtain SSL certificate and key (e.g., from Let's Encrypt)
-
Modify
app.pyto use your certificates:
socketio.run(app,
host='0.0.0.0',
port=5000,
ssl_context=('path/to/cert.pem', 'path/to/key.pem'))-
Open the application
- Navigate to
https://localhost:5000in Chrome, Edge, or Opera
- Navigate to
-
Connect to Carlinkit dongle
- Plug in your Carlinkit dongle via USB
- Click "Detect Carlinkit Dongle" button
- Select your device from the browser popup
- Grant USB permissions when prompted
-
View device information
- Once connected, device details will be displayed
- Activity log shows real-time communication events
-
Send commands
- Use the command buttons to interact with the dongle
- Commands are sent via WebUSB to the device
carplay-flask/
├── app.py # Flask application & WebSocket handlers
├── requirements.txt # Python dependencies
├── templates/
│ └── index.html # Main HTML template
└── static/
├── css/
│ └── style.css # Styling
└── js/
├── usb-handler.js # WebUSB communication logic
├── socket-handler.js # WebSocket communication logic
└── main.js # Application coordination
The application is configured to detect Carlinkit dongles with:
- Vendor ID:
0x1314(4884) - Product IDs:
0x1520(5408),0x1521(5409)
WebUSB requires:
- HTTPS connection (or localhost)
- Supported browser (Chrome, Edge, Opera)
- User permission (browser will prompt)
- Use Chrome, Edge, or Opera browser
- Ensure you're accessing via HTTPS
- Check USB cable connection
- Try a different USB port
- Ensure device is Carlinkit dongle
- Check browser console for errors
- Accept self-signed certificate in browser
- For production, use proper SSL certificate
- Check if Flask server is running
- Verify HTTPS connection
- Check browser console for errors
Edit static/js/usb-handler.js to change:
- Device filters (vendor/product IDs)
- Data parsing logic
- Endpoint configuration
Edit app.py to add server-side event handlers:
@socketio.on('your_event')
def handle_your_event(data):
# Process data
emit('response_event', {'result': 'success'})Edit static/js/socket-handler.js to handle client-side events.
- Add button in
templates/index.html - Add event listener in
static/js/main.js - Handle command in
app.py
- Change
SECRET_KEYinapp.pyfor production - Use proper SSL certificates for production
- Validate all data received from USB devices
- Implement authentication if exposing publicly
This project is provided as-is for educational purposes.
Based on the architecture of react-carplay