From 66c12eefc76fd952568b540d2628d5c0ec9d05ab Mon Sep 17 00:00:00 2001 From: Aaro_laptop Date: Sun, 19 Feb 2023 15:27:44 +0200 Subject: [PATCH 1/3] made core axios instance to simplify api calls to suppis-core --- src/App.tsx | 15 ++++++++++++++- src/firebaseConfig.ts | 3 ++- src/pages/message.tsx | 24 +++--------------------- 3 files changed, 19 insertions(+), 23 deletions(-) diff --git a/src/App.tsx b/src/App.tsx index 0f630cc..0de7d0a 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -7,9 +7,22 @@ import MessageWrapper from "./pages/message"; import {BrowserRouter, Route, Routes} from "react-router-dom"; import Login from "./pages/login"; import {onAuthStateChanged, User} from "firebase/auth"; -import {auth, verifyClaim} from "./firebaseConfig"; +import {auth, getAppCheckTokenForApiCall, getIdTokenForApiCall, verifyClaim} from "./firebaseConfig"; import Error from "./pages/error"; import Main from "./pages/main"; +import axios from "axios"; + +export const core = axios.create({ + baseURL: 'http://localhost:3001', +}); + +core.interceptors.request.use(async config => { + config.headers = { + "X-Firebase-IdToken": await getIdTokenForApiCall(), + "X-Firebase-AppCheck": await getAppCheckTokenForApiCall() + } + return config; +}); function App() { useEffect(() => { diff --git a/src/firebaseConfig.ts b/src/firebaseConfig.ts index 309c312..32d3b4a 100644 --- a/src/firebaseConfig.ts +++ b/src/firebaseConfig.ts @@ -66,7 +66,8 @@ export const getIdTokenForApiCall = async () => { // Async function which gets AppCheck token for making request to the api export const getAppCheckTokenForApiCall = async () => { try { - return await getToken(appCheck, false) + const result = await getToken(appCheck, false) + return result.token } catch (error) { throw error } diff --git a/src/pages/message.tsx b/src/pages/message.tsx index fb6958d..62afd7d 100644 --- a/src/pages/message.tsx +++ b/src/pages/message.tsx @@ -2,6 +2,7 @@ import React, {useEffect, useState} from "react"; import {auth, getAppCheckTokenForApiCall, getIdTokenForApiCall} from "../firebaseConfig"; import axios, {AxiosResponse} from "axios"; import {onAuthStateChanged} from "firebase/auth"; +import {core} from "../App"; const Papa = require("papaparse") @@ -59,19 +60,9 @@ export default function MessageWrapper() { event.preventDefault() if (!toList) { try { - - // Getting tokens from Firebase to send along the API request, so backend can ensure that user has correct access rights - const idToken = await getIdTokenForApiCall() - const appCheckToken = await getAppCheckTokenForApiCall() - - const result: AxiosResponse = await axios.post("http://localhost:3001/whatsapp/send/one", { + const result: AxiosResponse = await core.post("whatsapp/send/one", { number: phoneNumber, message: message - }, { - headers: { - "X-Firebase-IdToken": idToken, - "X-Firebase-AppCheck": appCheckToken.token - } }) alert(result.data) @@ -82,20 +73,11 @@ export default function MessageWrapper() { } if (toList) { try { - - // Getting tokens from Firebase to send along the API request, so backend can ensure that user has correct access rights const phoneNumbers = await handleCsvToJson() - const idToken = await getIdTokenForApiCall() - const appCheckToken = await getAppCheckTokenForApiCall() - const result: AxiosResponse = await axios.post("http://localhost:3001/whatsapp/send/list", { + const result: AxiosResponse = await core.post("/whatsapp/send/list", { numbers: phoneNumbers, message: message - }, { - headers: { - "X-Firebase-IdToken": idToken, - "X-Firebase-AppCheck": appCheckToken.token - } }) alert(result.data) From a912a8579089e73dfc97f80b9c10c2b11c2e812d Mon Sep 17 00:00:00 2001 From: Aaro_laptop Date: Sun, 19 Feb 2023 15:57:28 +0200 Subject: [PATCH 2/3] config files --- src/App.tsx | 4 +--- src/components/navbar/navElement.tsx | 2 +- src/config/axios.json | 4 ++++ src/config/firebase.json | 8 ++++++++ src/firebaseConfig.ts | 9 +-------- src/pages/message.tsx | 6 ++---- 6 files changed, 17 insertions(+), 16 deletions(-) create mode 100644 src/config/axios.json create mode 100644 src/config/firebase.json diff --git a/src/App.tsx b/src/App.tsx index 0de7d0a..7427b26 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -12,9 +12,7 @@ import Error from "./pages/error"; import Main from "./pages/main"; import axios from "axios"; -export const core = axios.create({ - baseURL: 'http://localhost:3001', -}); +export const core = axios.create(require("./config/axios.json")); core.interceptors.request.use(async config => { config.headers = { diff --git a/src/components/navbar/navElement.tsx b/src/components/navbar/navElement.tsx index 5b8405c..9cfd6e0 100644 --- a/src/components/navbar/navElement.tsx +++ b/src/components/navbar/navElement.tsx @@ -1,4 +1,4 @@ -import React, {ReactElement, ReactNode} from "react"; +import React, {ReactElement} from "react"; export default function NavElement(props: { children?: ReactElement[], text: string, linksTo: string}) { return ( diff --git a/src/config/axios.json b/src/config/axios.json new file mode 100644 index 0000000..0041b8c --- /dev/null +++ b/src/config/axios.json @@ -0,0 +1,4 @@ + +{ + "baseUrl": "http://localhost:3001" +} \ No newline at end of file diff --git a/src/config/firebase.json b/src/config/firebase.json new file mode 100644 index 0000000..4927a88 --- /dev/null +++ b/src/config/firebase.json @@ -0,0 +1,8 @@ +{ + "apiKey": "AIzaSyBWcwH_q5vnqSRhtiIZShtNray1aYzRRtI", + "authDomain": "suppis-382f9.firebaseapp.com", + "projectId": "suppis-382f9", + "storageBucket": "suppis-382f9.appspot.com", + "messagingSenderId": "847554464937", + "appId": "1:847554464937:web:2afeb9e429ff128bd12db8" +} \ No newline at end of file diff --git a/src/firebaseConfig.ts b/src/firebaseConfig.ts index 32d3b4a..345f173 100644 --- a/src/firebaseConfig.ts +++ b/src/firebaseConfig.ts @@ -15,14 +15,7 @@ import { initializeAppCheck, ReCaptchaV3Provider, getToken } from "firebase/app- // https://firebase.google.com/docs/web/setup#available-libraries // Your web app's Firebase configuration -const firebaseConfig = { - apiKey: "AIzaSyBWcwH_q5vnqSRhtiIZShtNray1aYzRRtI", - authDomain: "suppis-382f9.firebaseapp.com", - projectId: "suppis-382f9", - storageBucket: "suppis-382f9.appspot.com", - messagingSenderId: "847554464937", - appId: "1:847554464937:web:2afeb9e429ff128bd12db8" -}; +const firebaseConfig = require("./config/firebase.json") // Initialize Firebase const app = initializeApp(firebaseConfig); diff --git a/src/pages/message.tsx b/src/pages/message.tsx index 62afd7d..51fe0d1 100644 --- a/src/pages/message.tsx +++ b/src/pages/message.tsx @@ -1,7 +1,5 @@ -import React, {useEffect, useState} from "react"; -import {auth, getAppCheckTokenForApiCall, getIdTokenForApiCall} from "../firebaseConfig"; -import axios, {AxiosResponse} from "axios"; -import {onAuthStateChanged} from "firebase/auth"; +import React, {useState} from "react"; +import {AxiosResponse} from "axios"; import {core} from "../App"; const Papa = require("papaparse") From 340714f17e9e98c8eb9efab6121f602240d89ad3 Mon Sep 17 00:00:00 2001 From: Aaro_laptop Date: Tue, 21 Feb 2023 12:44:41 +0200 Subject: [PATCH 3/3] docker --- .dockerignore | 3 +++ Dockerfile | 32 ++++++++++++++++++++++++++++++++ nginx.conf | 17 +++++++++++++++++ package-lock.json | 4 ++-- src/App.tsx | 4 +++- src/config/axios.json | 4 ---- src/pages/message.tsx | 10 ++++++++-- 7 files changed, 65 insertions(+), 9 deletions(-) create mode 100644 .dockerignore create mode 100644 Dockerfile create mode 100644 nginx.conf delete mode 100644 src/config/axios.json diff --git a/.dockerignore b/.dockerignore new file mode 100644 index 0000000..83dfeeb --- /dev/null +++ b/.dockerignore @@ -0,0 +1,3 @@ +node_modules +.idea +build \ No newline at end of file diff --git a/Dockerfile b/Dockerfile new file mode 100644 index 0000000..57aece8 --- /dev/null +++ b/Dockerfile @@ -0,0 +1,32 @@ +# Use Node.js 18 as the base image +FROM node:18 as build + +# Set the working directory +WORKDIR /app + +# Copy package.json and package-lock.json files to the container +COPY package*.json ./ + +# Install dependencies +RUN npm install + +# Copy the rest of the application code to the container +COPY . . + +# Build the React app +RUN npm run build + +# Use a lightweight Nginx image as the base image +FROM nginx:1.21 + +# Copy the React build files to the Nginx default public folder +COPY --from=build /app/build /usr/share/nginx/html + +# Copy the Nginx configuration file to the container +COPY nginx.conf /etc/nginx/conf.d/default.conf + +# Expose the port used by Nginx +EXPOSE 80 + +# Start Nginx +CMD ["nginx", "-g", "daemon off;"] \ No newline at end of file diff --git a/nginx.conf b/nginx.conf new file mode 100644 index 0000000..f2a9da2 --- /dev/null +++ b/nginx.conf @@ -0,0 +1,17 @@ +server { + listen 80; + server_name localhost; + + location /api { + proxy_pass http://core:3001/; + proxy_set_header Host $host; + proxy_set_header X-Real-IP $remote_addr; + proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for; + } + + location / { + root /usr/share/nginx/html; + index index.html; + try_files $uri $uri/ /index.html; + } +} diff --git a/package-lock.json b/package-lock.json index ad452e3..b80317c 100644 --- a/package-lock.json +++ b/package-lock.json @@ -1,12 +1,12 @@ { "name": "suppis-nettisivut", - "version": "2.0.0-Beta", + "version": "1.0.0-rc.1", "lockfileVersion": 2, "requires": true, "packages": { "": { "name": "suppis-nettisivut", - "version": "2.0.0-Beta", + "version": "1.0.0-rc.1", "dependencies": { "@testing-library/jest-dom": "^5.16.5", "@testing-library/react": "^13.4.0", diff --git a/src/App.tsx b/src/App.tsx index 7427b26..0b8cddb 100644 --- a/src/App.tsx +++ b/src/App.tsx @@ -12,7 +12,9 @@ import Error from "./pages/error"; import Main from "./pages/main"; import axios from "axios"; -export const core = axios.create(require("./config/axios.json")); +export const core = axios.create({ + baseURL: process.env.BASE_URL +}); core.interceptors.request.use(async config => { config.headers = { diff --git a/src/config/axios.json b/src/config/axios.json deleted file mode 100644 index 0041b8c..0000000 --- a/src/config/axios.json +++ /dev/null @@ -1,4 +0,0 @@ - -{ - "baseUrl": "http://localhost:3001" -} \ No newline at end of file diff --git a/src/pages/message.tsx b/src/pages/message.tsx index 51fe0d1..078cc00 100644 --- a/src/pages/message.tsx +++ b/src/pages/message.tsx @@ -30,6 +30,12 @@ export default function MessageWrapper() { setShowQr(true) return } + + if (error.response.status == 409) { + core.get("/api/whatsapp/status") + .catch(reason => handleMessageApiCallResponse(reason)) + } + alert(error.response.data) } @@ -58,7 +64,7 @@ export default function MessageWrapper() { event.preventDefault() if (!toList) { try { - const result: AxiosResponse = await core.post("whatsapp/send/one", { + const result: AxiosResponse = await core.post("/api/whatsapp/send/one", { number: phoneNumber, message: message }) @@ -73,7 +79,7 @@ export default function MessageWrapper() { try { const phoneNumbers = await handleCsvToJson() - const result: AxiosResponse = await core.post("/whatsapp/send/list", { + const result: AxiosResponse = await core.post("/api/whatsapp/send/list", { numbers: phoneNumbers, message: message })