Modify docker file to setup enviroment variables using emtrypoint.sh

This commit is contained in:
Vikas Nale 2025-03-30 12:31:53 +05:30
parent 959e4dd7dd
commit 0ad38baa99
6 changed files with 58 additions and 27 deletions

2
.env
View File

@ -1 +1 @@
VITE_BASE_URL=http://localhost:5032
VITE_API_URL=http://localhost:5032

View File

@ -21,5 +21,9 @@ RUN npm run build # This will run tsc -b and vite build
# Expose the port the app will use
EXPOSE 4173
# Copy the entrypoint script
COPY entrypoint.sh /entrypoint.sh
RUN chmod +x /entrypoint.sh
# Start the app using the preview server
CMD ["npm", "run", "preview"]

7
entrypoint.sh Normal file
View File

@ -0,0 +1,7 @@
#!/bin/sh
# Create a JavaScript file with environment variables
echo "window._env_ = { VITE_API_URL: \"$VITE_API_URL\" };" > /app/dist/env.js
# Start the Vite preview server
exec "$@"

0
env.js Normal file
View File

View File

@ -46,7 +46,9 @@
<!-- Helpers -->
<script src="/assets/vendor/js/helpers.js"></script>
<script src="/assets/js/config.js"></script>
<script src="/env.js"></script>
<!-- Timer Picker -->
<!-- Flatpickr CSS -->
@ -70,12 +72,12 @@
<script src="/assets/vendor/libs/select2/select2.js"></script>
<script src="/assets/vendor/js/menu.js"></script>
<!-- endbuild -->
<!-- Vendors JS -->
@ -83,7 +85,7 @@
<script src="/assets/vendor/libs/bootstrap-select/bootstrap-select.js"></script>
<script src="/assets/vendor/libs/select2/select2.js"></script>
<script src="/assets/vendor/libs/apex-charts/apexcharts.js"></script>
<script src="/assets/vendor/libs/jquery-timepicker/jquery-timepicker.js" ></script>
<script src="/assets/vendor/libs/jquery-timepicker/jquery-timepicker.js"></script>
<!-- Main JS -->
<script src="/assets/js/main.js"></script>
@ -95,24 +97,24 @@
<!-- component -->
<script src="./public/js/timppick.js"></script>
<script src="/assets/vendor/libs/sweetalert2/sweetalert2.js" ></script>
<script src="/assets/vendor/libs/sweetalert2/sweetalert2.js"></script>
<!-- <script src="https://cdn.jsdelivr.net/npm/@popperjs/core@2.10.2/dist/umd/popper.min.js"></script>
<script src="https://cdn.jsdelivr.net/npm/bootstrap@5.3.0-alpha1/dist/js/bootstrap.min.js"></script> -->
<!-- Flatpickr JS -->
<script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
<!-- Flatpickr JS -->
<script src="https://cdn.jsdelivr.net/npm/flatpickr"></script>
<script>
<script>
// Initialize flatpickr for 12-hour time format with AM/PM
flatpickr("#timePicker", {
enableTime: true,
noCalendar: true,
time_24hr: false, // Disable 24-hour format
dateFormat: "h:i K", // 12-hour format with AM/PM
enableTime: true,
noCalendar: true,
time_24hr: false, // Disable 24-hour format
dateFormat: "h:i K", // 12-hour format with AM/PM
});
</script>
</script>
</body>
</html>

View File

@ -2,9 +2,11 @@ import axios from "axios";
import { useNavigate } from "react-router-dom";
import axiosRetry from "axios-retry";
import showToast from "../services/toastService";
const base_Url = process.env.VITE_BASE_URL;
const API_URL = window._env_?.VITE_API_URL || import.meta.env.VITE_API_URL;
export const axiosClient = axios.create({
baseURL: base_Url, // Your Web API URL
baseURL: API_URL, // Your Web API URL
withCredentials: false, // Required if the API uses cookies
headers: {
"Content-Type": "application/json", // Specify the content type
@ -44,32 +46,44 @@ axiosClient.interceptors.response.use(
originalRequest._toastShown = true;
if (error.code === "ERR_CONNECTION_REFUSED") {
console.error("Connection refused. Please ensure the server is running.");
showToast("Unable to connect to the server. Please try again later.", "error");
console.error(
"Connection refused. Please ensure the server is running."
);
showToast(
"Unable to connect to the server. Please try again later.",
"error"
);
} else if (error.code === "ERR_NETWORK") {
console.error("Network error: Unable to reach the server.");
showToast("Server is unreachable. Try again later!", "error");
redirectToLogin();
} else if (error.code === "ECONNABORTED") {
console.error("Request timed out.");
showToast("The request took too long. Please try again later.", "error");
showToast(
"The request took too long. Please try again later.",
"error"
);
} else if (error.response) {
console.error("Error response:", error.response.status, error.response.data);
console.error(
"Error response:",
error.response.status,
error.response.data
);
if (error.response.status === 401 && !originalRequest._retry) {
originalRequest._retry = true;
try {
// debugger;
// Get the refresh token from secure storage
// debugger;
// Get the refresh token from secure storage
const refreshToken = localStorage.getItem("refreshToken");
if (!refreshToken) {
// Redirect to login if refresh token is not available
// Redirect to login if refresh token is not available
redirectToLogin();
return Promise.reject(error);
}
// Make a request to refresh the access token
// Make a request to refresh the access token
const response = await axiosClient.post("/api/Auth/refresh-token", {
token: localStorage.getItem("jwtToken"),
refreshToken,
@ -82,15 +96,19 @@ axiosClient.interceptors.response.use(
// Retry the original request with the new token
originalRequest.headers["Authorization"] = `Bearer ${token}`;
// Retry the original request
// Retry the original request
return axiosClient(originalRequest);
} catch (err) {
// Redirect to login if token refresh fails
// Redirect to login if token refresh fails
redirectToLogin();
return Promise.reject(err);
}
} else {
showToast(error.response.data?.message || "An error occurred. Please try again.", "error");
showToast(
error.response.data?.message ||
"An error occurred. Please try again.",
"error"
);
}
} else {
console.error("An unknown error occurred:", error.message);