Files
crdc-demo/Dockerfile
T
jared 4ce64c7839
Deploy to git-pages / deploy (push) Successful in 20s
Fix CORS: add proxy support for browser-based API calls on git-pages
- Add VITE_PROXY_URL env var to route requests through a CORS proxy when
  deployed as static site (CRDC API doesn't send Access-Control-Allow-Origin)
- Update useApi.js, LoadingAnimation.jsx, and ChartPanel.jsx to respect proxy
- Add nginx.conf with /api/v1/ reverse proxy + CORS headers for Docker deployment
- Include proxy.php — simple PHP CORS proxy for git-pages hosts that support PHP
- Document CORS workaround in README

Without this fix, browser fetch() calls are blocked by same-origin policy and
the app shows a blank white screen despite serving correct HTML.
2026-08-10 11:22:44 -04:00

28 lines
825 B
Docker

# Multi-stage build for the CRDC Arrests API Demo app.
# Stage 1: Build static files with Vite + React
FROM node:22-alpine AS builder
WORKDIR /app
COPY package*.json ./
RUN npm ci --prefer-offline
COPY . .
ARG VITE_API_BASE=https://crdc-api.civilytics.org/api/v1
ENV VITE_API_BASE=${VITE_API_BASE}
ARG VITE_PROXY_URL=""
ENV VITE_PROXY_URL=${VITE_PROXY_URL}
RUN npm run build
# Stage 2: Serve with nginx (tiny image, ~5MB) + reverse proxy for API CORS bypass
FROM nginx:alpine AS runtime
# Copy static site files
COPY --from=builder /app/dist/ /usr/share/nginx/html/
# Custom nginx config — serves static files AND proxies /api/v1/ to the CRDC API
# with CORS headers, so browser-based requests work without preflight issues.
COPY nginx.conf /etc/nginx/conf.d/default.conf
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]