Merge pull request #950 from NUTFes/feat/nose/fix-prod-Dockerfile

Dockerfileを修正

Author: TkymHrt

Makefile

@@ -5,6 +5,11 @@ build:
 	docker compose build
 	docker compose run --rm view npm install
 
+
+build-stg:
+	docker compose -f compose.stg.yml build
+
+
 # アプリコンテナの起動
 run:
 	docker compose up -d
@@ -97,3 +102,7 @@ run-all:
 
 gen-er:
 	docker run -v "./er:/output" --net="host" schemaspy/schemaspy:snapshot -t mysql -host localhost:3306 -db finansu_db -u root -p root -connprops  allowPublicKeyRetrieval\\=false  -s finansu_db
+
+
+
+

api/drivers/server/server.go

@@ -27,7 +27,7 @@ func RunServer(router router.Router) *echo.Echo {
 
 	// CORS対策
 	e.Use(middleware.CORSWithConfig(middleware.CORSConfig{
-		AllowOrigins: []string{"http://localhost:3000", "127.0.0.1:3000", "http://localhost:3001", "127.0.0.1:3001", "http://localhost:8000", "127.0.0.1:8000", "https://finansu.nutfes.net"}, // ドメイン
+		AllowOrigins: []string{"http://localhost:3000", "127.0.0.1:3000", "http://localhost:3001", "127.0.0.1:3001", "http://localhost:8000", "127.0.0.1:8000", "https://finansu.nutfes.net", "https://stg-finansu.nutfes.net"}, // ドメイン
 		AllowMethods: []string{http.MethodGet, http.MethodPost, http.MethodPut, http.MethodDelete},
 	}))
 

api/prod.Dockerfile

@@ -7,17 +7,16 @@ services:
 
   view:
     build:
-      context: ./view
-      dockerfile: prod.Dockerfile
+      context: ./
+      dockerfile: prod.view.Dockerfile
     container_name: "nutfes-finansu-view"
-    command: "npm run start"
     ports: ["3000:3000"]
     depends_on: ["api"]
 
   api:
     build:
-      context: ./api
-      dockerfile: prod.Dockerfile
+      context: ./
+      dockerfile: prod.api.Dockerfile
     container_name: "nutfes-finansu-api"
     env_file: ["./finansu.env"]
     ports: ["1323:1323"]

compose.prod.yml

@@ -7,17 +7,18 @@ services:
 
   view:
     build:
-      context: ./view
-      dockerfile: prod.Dockerfile
+      context: ./
+      dockerfile: prod.view.Dockerfile
+      args:
+        NEXT_PUBLIC_APP_ENV: "stg"
     container_name: "nutfes-finansu-view"
-    command: "npm run start"
     ports: ["3000:3000"]
     depends_on: ["api"]
 
   api:
     build:
-      context: ./api
-      dockerfile: prod.Dockerfile
+      context: ./
+      dockerfile: prod.api.Dockerfile
     container_name: "nutfes-finansu-api"
     env_file: ["./finansu.env"]
     ports: ["1323:1323"]

compose.stg.yml

@@ -1,23 +1,34 @@
 # Build用 コンテナ
-FROM node:20.14 AS builder
-WORKDIR /app/next-project
-COPY ./view/next-project /app/next-project
-RUN npm install
+FROM node:20-alpine AS base
+
+FROM base AS builder
+
+# build時に必要な環境変数
+ARG NEXT_PUBLIC_APP_ENV=production
+ENV NEXT_PUBLIC_APP_ENV=${NEXT_PUBLIC_APP_ENV}
+
+WORKDIR /app
+
+COPY ./view/next-project/package*.json ./
+RUN npm ci
+
+COPY ./view/next-project/ ./
 RUN npm run build
 
-# 本番用 軽量 nodejs20.14
-FROM node:20.14-slim
+# Create runner image
+FROM gcr.io/distroless/nodejs20-debian12:nonroot AS runner
+
 WORKDIR /app
 LABEL org.opencontainers.image.source="https://github.com/NUTFes/FinanSu"
-ENV NODE_ENV production
-ENV NEXT_PUBLIC_APP_ENV "production"
-
-COPY --from=builder /app/next-project/next.config.js ./
-COPY --from=builder /app/next-project/public ./public
-COPY --from=builder --chown=nonroot:nonroot /app/next-project/.next ./.next
-COPY --from=builder /app/next-project/node_modules ./node_modules
-COPY --from=builder /app/next-project/package.json ./package.json
-
-USER nonroot
-EXPOSE 3000
-CMD ["node_modules/.bin/next", "start"]
+ENV NODE_ENV=production
+
+COPY --from=builder --chown=65532:65532 /app/.next/standalone /app/
+COPY --from=builder --chown=65532:65532 /app/.next/static /app/.next/static
+COPY --from=builder --chown=65532:65532 /app/public /app/public
+
+ARG PORT=3000
+ENV HOSTNAME=0.0.0.0
+ENV PORT=${PORT}
+EXPOSE ${PORT}
+
+ENTRYPOINT [ "/nodejs/bin/node", "server.js" ]

prod.view.Dockerfile

@@ -1,5 +1,6 @@
 /** @type {import('next').NextConfig} */
 const isProd = process.env.NEXT_PUBLIC_APP_ENV === 'production';
+const isStg = process.env.NEXT_PUBLIC_APP_ENV === 'stg';
 
 module.exports = {
   reactStrictMode: true,
@@ -9,7 +10,16 @@ module.exports = {
     // SSR_API_URI: isProd ? 'http://nutfes-finansu-api:1323' : 'http://nutfes-finansu-api:1323',
     // CSR_API_URI: isProd ? 'http://localhost:1323' : 'http://localhost:1323',
 
-    SSR_API_URI: isProd ? 'https://finansu-api.nutfes.net' : 'http://nutfes-finansu-api:1323',
-    CSR_API_URI: isProd ? 'https://finansu-api.nutfes.net' : 'http://localhost:1323',
+    SSR_API_URI: isProd
+      ? 'https://finansu-api.nutfes.net'
+      : isStg
+      ? 'https://stg-finansu-api.nutfes.net'
+      : 'http://nutfes-finansu-api:1323',
+    CSR_API_URI: isProd
+      ? 'https://finansu-api.nutfes.net'
+      : isStg
+      ? 'https://stg-finansu-api.nutfes.net'
+      : 'http://localhost:1323',
   },
+  output: 'standalone',
 };

view/next-project/next.config.js

@@ -1,4 +1,4 @@
-import { Meta } from '@storybook/react';
+import type { Meta } from '@storybook/react';
 import FinanSuButton from '@components/common/FinanSuButton';
 
 const meta: Meta<typeof FinanSuButton> = {

view/next-project/package-lock.json

@@ -1,4 +1,4 @@
-import { Meta } from '@storybook/react';
+import type { Meta } from '@storybook/react';
 import { OpenAddModalButton } from '@components/fund_information';
 
 const meta: Meta<typeof OpenAddModalButton> = {