Merge pull request #10 from Bardioc26/frontend_APIURL_Fix2
The frontend refused to communicate with the backend in production deployment. The implementation can be improved
This commit is contained in:
Bardioc26
@@ -0,0 +1,107 @@
|
||||
# How to setup
|
||||
Setting up is quite easy. I both cases I would suggest docker
|
||||
|
||||
## Production Environment
|
||||
|
||||
* fetch certificate for frontend and backend
|
||||
certbot certonly -d frontend.domain.de -d backend.domain.de --standalone
|
||||
* Setup proxy
|
||||
Apache2:
|
||||
<IfModule mod_ssl.c>
|
||||
<VirtualHost *:443>
|
||||
ServerName frontend.domain.de
|
||||
|
||||
SSLEngine on
|
||||
SSLCertificateFile /etc/letsencrypt/live/frontend.domain.de/fullchain.pem
|
||||
SSLCertificateKeyFile /etc/letsencrypt/live/frontend.domain.de/privkey.pem
|
||||
Include /etc/letsencrypt/options-ssl-apache.conf
|
||||
|
||||
#-# Request header rules
|
||||
RequestHeader set X-Forwarded-Proto "https"
|
||||
|
||||
ProxyPreserveHost On
|
||||
ProxyRequests Off
|
||||
|
||||
ProxyPass / http://localhost:8181/
|
||||
ProxyPassReverse / http://localhost:8181/ timeout=120
|
||||
|
||||
LogLevel warn
|
||||
ErrorLog ${APACHE_LOG_DIR}/frontend.domain.de.error.log
|
||||
|
||||
</VirtualHost>
|
||||
<VirtualHost *:443>
|
||||
ServerName backend.domain.de
|
||||
|
||||
SSLEngine on
|
||||
SSLCertificateFile /etc/letsencrypt/live/bamort.trokan.de/fullchain.pem
|
||||
SSLCertificateKeyFile /etc/letsencrypt/live/bamort.trokan.de/privkey.pem
|
||||
Include /etc/letsencrypt/options-ssl-apache.conf
|
||||
|
||||
#-# Request header rules
|
||||
RequestHeader set X-Forwarded-Proto "https"
|
||||
|
||||
ProxyPreserveHost On
|
||||
ProxyRequests Off
|
||||
|
||||
ProxyPass / http://localhost:8182/
|
||||
ProxyPassReverse / http://localhost:8182/ timeout=120
|
||||
|
||||
LogLevel warn
|
||||
ErrorLog ${APACHE_LOG_DIR}/backend.domain.de.error.log
|
||||
TransferLog ${APACHE_LOG_DIR}/backend.domain.de.transfer.log
|
||||
CustomLog ${APACHE_LOG_DIR}/backend.domain.de.access.log combined
|
||||
</VirtualHost>
|
||||
</IfModule>
|
||||
|
||||
* Set URLS to configure frontend and backend
|
||||
edit ./docker/.env
|
||||
#- Environment variables for Bamort production environment
|
||||
|
||||
#- API Configuration
|
||||
API_URL=https://backend.domain.de
|
||||
VITE_API_URL=https://backend.domain.de
|
||||
|
||||
#- Database Configuration Backend
|
||||
DATABASE_TYPE=mysql
|
||||
#DATABASE_URL=bamort:your_secure_user_password@tcp(mariadb:3306)/bamort?charset=utf8mb4&parseTime=True&loc=Local
|
||||
|
||||
#- MariaDB Configuration
|
||||
MARIADB_ROOT_PASSWORD=your_secure_root_password
|
||||
MARIADB_PASSWORD=your_secure_user_password
|
||||
MARIADB_DATABASE=bamort
|
||||
MARIADB_USER=bamort
|
||||
|
||||
API_PORT=8180
|
||||
BASE_URL=https://frontend.domain.de
|
||||
TEMPLATES_DIR=./templates
|
||||
EXPORT_TEMP_DIR=./export_temp
|
||||
|
||||
!!! Do not configure DATABASE_URL for production in .env !!!
|
||||
|
||||
* edit ./frontend/src/utils/api.js because the env variable does not work reliably
|
||||
const API = axios.create({
|
||||
baseURL: import.meta.env.VITE_API_URL || 'https://backend.domain.de', // Use env variable with fallback
|
||||
})
|
||||
|
||||
* edit ./docker/docker-compose.yml
|
||||
Set VITE_API_URL and VITE_BASE_URL to https://backend.domain.de and https://frontend.domain.de
|
||||
|
||||
* run ./docker/start-prd.sh
|
||||
* test https://backend.domain.de/api/public/version
|
||||
should responde like this: {"version":"0.1.30","gitCommit":"unknown"}
|
||||
|
||||
|
||||
## Development Environment
|
||||
* Edit ./docker/.env
|
||||
set
|
||||
API_URL=http://localhost:8180
|
||||
VITE_API_URL=http://localhost:8180
|
||||
API_PORT=8180
|
||||
BASE_URL=http://localhost:5173
|
||||
|
||||
* run ./docker/start-dev.sh
|
||||
|
||||
Frontend is not reachable at http://localhost:5173 and backend at http://localhost:8180.
|
||||
Both containers are reacting on code changes and reload or rebuild automatically
|
||||
Database is automatically created with env variables in MARIADB_* set your DATABASE_URL accordingly
|
||||
Database is filled at first creation with values from ./docker/initdb/*.sql
|
||||
@@ -26,6 +26,9 @@ type Config struct {
|
||||
|
||||
DevTesting string // "yes" or "no", used to determine if we are in a test environment
|
||||
|
||||
// Frontend URLs for CORS
|
||||
FrontendURL string // Frontend URL for CORS configuration
|
||||
|
||||
// PDF Templates
|
||||
TemplatesDir string // Directory where PDF templates are stored
|
||||
ExportTempDir string // Directory for temporary PDF exports
|
||||
@@ -49,9 +52,10 @@ func defaultConfig() *Config {
|
||||
DebugMode: false,
|
||||
LogLevel: "INFO",
|
||||
Environment: "production",
|
||||
DevTesting: "no", // Default to "no", can be overridden in tests
|
||||
TemplatesDir: "./templates", // Default templates directory
|
||||
ExportTempDir: "./xporttemp", // Default export temp directory
|
||||
DevTesting: "no", // Default to "no", can be overridden in tests
|
||||
FrontendURL: "http://localhost:5173", // Default frontend URL for development
|
||||
TemplatesDir: "./templates", // Default templates directory
|
||||
ExportTempDir: "./xporttemp", // Default export temp directory
|
||||
}
|
||||
}
|
||||
|
||||
@@ -117,6 +121,11 @@ func LoadConfig() *Config {
|
||||
fmt.Printf("DEBUG LoadConfig - DEVTESTING nicht gefunden, setze DevTesting auf 'no'\n")
|
||||
}
|
||||
|
||||
// Frontend URL
|
||||
if frontendURL := os.Getenv("BASE_URL"); frontendURL != "" {
|
||||
config.FrontendURL = frontendURL
|
||||
}
|
||||
|
||||
// Templates Directory
|
||||
if templatesDir := os.Getenv("TEMPLATES_DIR"); templatesDir != "" {
|
||||
config.TemplatesDir = templatesDir
|
||||
|
||||
@@ -55,9 +55,6 @@ QUOTED_VALUE='single quotes'
|
||||
os.Unsetenv("DATABASE_URL")
|
||||
os.Unsetenv("QUOTED_VALUE")
|
||||
|
||||
// Test-Datei laden
|
||||
loadEnvFileContent(".env.test")
|
||||
|
||||
// Tests
|
||||
tests := []struct {
|
||||
key string
|
||||
@@ -128,9 +125,6 @@ LOG_LEVEL=ERROR`
|
||||
os.Setenv("DEBUG", "true")
|
||||
os.Setenv("LOG_LEVEL", "INFO")
|
||||
|
||||
// .env-Datei laden
|
||||
loadEnvFileContent(".env.precedence")
|
||||
|
||||
// Tests - bereits gesetzte Werte sollten nicht überschrieben werden
|
||||
if debug := os.Getenv("DEBUG"); debug != "true" {
|
||||
t.Errorf("DEBUG sollte 'true' bleiben, aber ist '%s'", debug)
|
||||
|
||||
+11
-1
@@ -1,18 +1,28 @@
|
||||
package router
|
||||
|
||||
import (
|
||||
"bamort/config"
|
||||
|
||||
"github.com/gin-contrib/cors"
|
||||
"github.com/gin-gonic/gin"
|
||||
)
|
||||
|
||||
func SetupGin(r *gin.Engine) {
|
||||
// Build allowed origins list from configuration
|
||||
allowedOrigins := []string{
|
||||
config.Cfg.FrontendURL,
|
||||
"http://localhost:5173", // Development frontend
|
||||
"https://bamort.trokan.de", // Production frontend
|
||||
}
|
||||
|
||||
// Add CORS middleware
|
||||
r.Use(cors.New(cors.Config{
|
||||
//AllowOrigins: []string{"http://localhost:3000"}, // Replace with your frontend's URL
|
||||
AllowOrigins: []string{"*"},
|
||||
AllowOrigins: allowedOrigins,
|
||||
AllowMethods: []string{"GET", "POST", "PUT", "DELETE"},
|
||||
AllowHeaders: []string{"Origin", "Content-Type", "Authorization"},
|
||||
ExposeHeaders: []string{"Content-Length"},
|
||||
AllowCredentials: true,
|
||||
MaxAge: 12 * 3600, // Cache preflight for 12 hours
|
||||
}))
|
||||
}
|
||||
|
||||
+16
-6
@@ -1,11 +1,21 @@
|
||||
# Environment variables for Bamort production deployment
|
||||
# Copy this file to .env and adjust the values as needed
|
||||
|
||||
# MariaDB Configuration
|
||||
MARIADB_ROOT_PASSWORD=your_secure_root_password_here
|
||||
MARIADB_PASSWORD=your_secure_user_password_here
|
||||
#- API Configuration
|
||||
API_URL=https://backend.domain.de
|
||||
VITE_API_URL=https://backend.domain.de
|
||||
|
||||
# Application Configuration
|
||||
VITE_API_URL=http://localhost:8180
|
||||
#- Database Configuration Backend
|
||||
DATABASE_TYPE=mysql
|
||||
#DATABASE_URL=bamort:your_secure_user_password@tcp(mariadb:3306)/bamort?charset=utf8mb4&parseTime=True&loc=Local
|
||||
|
||||
# Add other environment variables as needed
|
||||
#- MariaDB Configuration
|
||||
MARIADB_ROOT_PASSWORD=your_secure_root_password
|
||||
MARIADB_PASSWORD=your_secure_user_password
|
||||
MARIADB_DATABASE=bamort
|
||||
MARIADB_USER=bamort
|
||||
|
||||
API_PORT=8180
|
||||
BASE_URL=https://frontend.domain.de
|
||||
TEMPLATES_DIR=./templates
|
||||
EXPORT_TEMP_DIR=./export_temp
|
||||
@@ -1,6 +1,16 @@
|
||||
# =========== 1) Build stage ===========
|
||||
FROM node:22-alpine AS build
|
||||
|
||||
# Accept build arguments for Vite environment variables
|
||||
ARG VITE_API_URL
|
||||
ARG VITE_BASE_URL
|
||||
ARG VITE_API_PORT
|
||||
|
||||
# Set them as environment variables for the build process
|
||||
ENV VITE_API_URL=$VITE_API_URL
|
||||
ENV VITE_BASE_URL=$VITE_BASE_URL
|
||||
ENV VITE_API_PORT=$VITE_API_PORT
|
||||
|
||||
WORKDIR /usr/src/app
|
||||
|
||||
# Copy package files
|
||||
|
||||
@@ -5,12 +5,13 @@ services:
|
||||
dockerfile: ../docker/Dockerfile.backend
|
||||
container_name: bamort-backend
|
||||
ports:
|
||||
- "8180:8180"
|
||||
- "8182:8180"
|
||||
environment:
|
||||
- GO_ENV=production
|
||||
- CGO_ENABLED=1
|
||||
- DATABASE_TYPE=${DATABASE_TYPE:-mysql}
|
||||
- DATABASE_URL=${DATABASE_URL:-bamort:${MARIADB_PASSWORD:-secure_user_password}@tcp(mariadb:3306)/bamort?charset=utf8mb4&parseTime=True&loc=Local}
|
||||
- DATABASE_URL=${MARIADB_USER:-bamort}:${MARIADB_PASSWORD:-secure_user_password}@tcp(mariadb:3306)/${MARIADB_DATABASE:-bamort}?charset=utf8mb4&parseTime=True&loc=Local
|
||||
- BASE_URL=${BASE_URL:-https://bamort.trokan.de}
|
||||
- API_PORT=${API_PORT:-8180}
|
||||
depends_on:
|
||||
mariadb:
|
||||
@@ -24,13 +25,17 @@ services:
|
||||
build:
|
||||
context: ../frontend
|
||||
dockerfile: ../docker/Dockerfile.frontend
|
||||
args:
|
||||
VITE_API_URL: ${API_URL:-https://bamort-api.trokan.de}
|
||||
VITE_BASE_URL: ${BASE_URL:-https://bamort.trokan.de}
|
||||
VITE_API_PORT: ${API_PORT:-443}
|
||||
container_name: bamort-frontend
|
||||
ports:
|
||||
- "8181:80"
|
||||
environment:
|
||||
- NODE_ENV=production
|
||||
- VITE_API_URL=${API_URL:-http://bamort.trokan.de:8180}
|
||||
- VITE_BASE_URL=${BASE_URL:-http://bamort.trokan.de}
|
||||
- VITE_API_URL=${API_URL:-https://bamort.trokan.de:8180}
|
||||
- VITE_BASE_URL=${BASE_URL:-https://bamort.trokan.de}
|
||||
- VITE_API_PORT=${API_PORT:-8180}
|
||||
depends_on:
|
||||
- backend
|
||||
@@ -78,4 +83,4 @@ services:
|
||||
# condition: service_healthy
|
||||
|
||||
#volumes:
|
||||
# db_data:
|
||||
# db_data:
|
||||
|
||||
File diff suppressed because one or more lines are too long
+3
-3
@@ -1,6 +1,6 @@
|
||||
#!/bin/bash
|
||||
|
||||
echo "🚀 Starting Bamort Development Environment..."
|
||||
echo "🚀 Starting Bamort Production Environment..."
|
||||
|
||||
# Prüfe ob Docker läuft
|
||||
if ! docker info > /dev/null 2>&1; then
|
||||
@@ -11,7 +11,7 @@ fi
|
||||
# Gehe ins Docker-Verzeichnis
|
||||
cd "$(dirname "$0")"
|
||||
|
||||
echo "📦 Building and starting development containers..."
|
||||
echo "📦 Building and starting production containers..."
|
||||
|
||||
# Stoppe vorhandene Container
|
||||
docker-compose -f docker-compose.yml down
|
||||
@@ -19,4 +19,4 @@ docker-compose -f docker-compose.yml down
|
||||
# Baue und starte die Container
|
||||
docker-compose -f docker-compose.yml up --build -d
|
||||
|
||||
echo "✅ Development environment started."
|
||||
echo "✅ Production environment started."
|
||||
@@ -1,7 +1,7 @@
|
||||
import axios from 'axios'
|
||||
|
||||
const API = axios.create({
|
||||
baseURL: import.meta.env.VITE_API_URL || 'http://localhost:8180', // Use env variable with fallback
|
||||
baseURL: import.meta.env.VITE_API_URL || 'https://bamort-api.trokan.de', // Use env variable with fallback
|
||||
})
|
||||
|
||||
// Request interceptor to add auth token
|
||||
|
||||
Reference in New Issue
Block a user