用户请求域名->服务器 nginx->前端 docker 服务
前端 docker 配置如下
[ol]
[/ol]
FROM node:lts-alpine AS builder
# install simple http server for serving static content
RUN npm install -g http-server
# make the 'app' folder the current working directory
WORKDIR /app
# copy both 'package.json' and 'package-lock.json' (if available)
COPY package*.json ./
# install project dependencies
RUN npm install
# copy project files and folders to the current working directory (i.e. 'app' folder)
COPY . .
# build app for production with minification
RUN npm run build
# build the nginx image
FROM nginx:1.17
COPY --from=builder /app/dist /usr/share/nginx/html
COPY ./nginx.conf /etc/nginx/conf.d/
EOF
2.docker nginx 配置 nginx.conf
server {
listen 80;
server_name localhost;
root /usr/share/nginx/html;
index index.html;
location ~* ^.+\.(jpg|jpeg|gif|png|ico|css|js|pdf|txt){
root /usr/share/nginx/html;
}
location / {
try_files $uri $uri/ @router;
index index.html;
}
location @router {
rewrite ^.*$ /index.html last;
}
}
服务器的 nginx 配置
现在是这样的配置
location /api/ {
rewrite ^.+api/?(.*)$ /$1 break; # 去除本地接口 /api 前缀, 否则会出现 404
proxy_pass http://xxx.xxxx:8081; # 前端代理的后端服务接口
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
proxy_set_header X-Forwarded-Server $host;
#add_header 'Access-Control-Allow-Origin' '*';
#add_header 'Access-Control-Allow-Credentials' 'true';
}
location / {
proxy_pass http://127.0.0.1:8080; #前端 docker 访问的路径
# try_files $uri $uri/ /index.html;
}
上面这种配置后，访问刷新路由会 404 ，如果加上 try_files $uri $uri/ /index.html; 就会报错
iled to load module script: Expected a JavaScript module script but the server responded with a MIME type of "text/html". Strict MIME type checking is enforced for module scripts per HTML spec.
注：两边 nginx 都有配置
include /etc/nginx/mime.types;
default_type application/octet-stream;
求大佬解答
