Add defensive backend URL validation and auto-cleanup

- Add getApiUrl() function to validate and clean backend URL
- Automatically strip /membership or /api suffix if present
- Log all environment variables on module load for debugging
- Add detailed URL logging in login function
- Provide fallback if REACT_APP_BACKEND_URL is undefined

This fixes the intermittent CORS error caused by incorrect backend URL
This commit is contained in:
Koncept Kit
2026-01-05 15:42:11 +07:00
parent 1acb13ba79
commit 03b76a8e58

View File

@@ -3,7 +3,34 @@ import axios from 'axios';
const AuthContext = createContext();
const API_URL = process.env.REACT_APP_BACKEND_URL;
// Ensure API_URL is correctly set, with fallback and validation
const getApiUrl = () => {
const url = process.env.REACT_APP_BACKEND_URL;
// Log the environment variable for debugging
console.log('[AuthContext] Environment check:', {
REACT_APP_BACKEND_URL: url,
REACT_APP_BASENAME: process.env.REACT_APP_BASENAME,
PUBLIC_URL: process.env.PUBLIC_URL
});
if (!url) {
console.error('[AuthContext] REACT_APP_BACKEND_URL is not defined!');
// Fallback to current origin API (same domain)
return window.location.origin.replace('/membership', '');
}
// Remove any trailing /membership or /api from the backend URL
const cleanUrl = url.replace(/\/(membership|api)\/?$/, '');
if (cleanUrl !== url) {
console.warn('[AuthContext] Cleaned backend URL:', { original: url, cleaned: cleanUrl });
}
return cleanUrl;
};
const API_URL = getApiUrl();
export const AuthProvider = ({ children }) => {
const [user, setUser] = useState(null);
@@ -55,7 +82,11 @@ export const AuthProvider = ({ children }) => {
const login = async (email, password) => {
try {
console.log('[AuthContext] Starting login request...');
console.log('[AuthContext] Starting login request...', {
API_URL: API_URL,
envBackendUrl: process.env.REACT_APP_BACKEND_URL,
fullUrl: `${API_URL}/api/auth/login`
});
const response = await axios.post(
`${API_URL}/api/auth/login`,