[英]“Failed to load resource: the server responded with a status of 404” express docker
I got error message in browser "Failed to load resource: the server responded with a status of 404" and I am using Node/Express, Mongo Database and Docker. 我在浏览器中收到错误消息“无法加载资源:服务器响应状态为404”,并且我正在使用Node / Express,Mongo Database和Docker。 Everything works fine without a Docker.
没有Docker,一切工作正常。
Folder structure: 资料夹结构:
server.js server.js
app.use('/', express.static(__dirname + '../../dist/'));
app.get('/gallery', (req, res) => { Gallery.find({}, {name: 1, path: 1, _id: 0, image: 1}).then( gallery => { res.json({gallery}); }, e => { res .status(500) .send(e) .send('Undefined error'); }, ); });
index.html index.html
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1, shrink-to-fit=no"> <title>Gallery</title> <base href="/"> <link href="https://fonts.googleapis.com/css?family=Roboto:400,500,700" rel="stylesheet"> </head> <body> <div id="root"></div> <script type="text/javascript" src="dist/frontend-output.js"></script> </body> </html>
const frontend = { resolve: { modules: [path.resolve(__dirname, 'frontend'), 'node_modules'], }, mode: 'development', entry: './frontend/js/index.js', output: { path: path.resolve(__dirname, '/dist/'), publicPath: '/', filename: 'frontend-output.js', }, module: { rules: [ { test: /\\.(js)$/, exclude: /node_modules/, use: { loader: 'babel-loader', options: { presets: ['env', 'stage-0', 'react'], }, }, }, {test: /\\.css$/, use: ['style-loader', 'css-loader']}, {test: /\\.(jpe?g|png|gif|svg)$/i, use: ['url-loader', 'file-loader']}, { test: /\\.(jpe?g|png|ttf|eot|gif|svg|woff(2)?)(\\?[a-z0-9=&.]+)?$/, use: 'base64-inline-loader?limit=1000&name=[name].[ext]', }, ], }, plugins: [ new HtmlWebpackPlugin({ publicPath: '/', template: './frontend/src/index.html', }), ], devServer: { historyApiFallback: true, }, };
package.json {scripts} package.json {脚本}
FROM node:latest
WORKDIR /app
COPY . /app
EXPOSE 3000
Dockerfile Docker文件
version: "3" services: app: container_name: projectX image: docker-node-express-mongoapp restart: always build: . command: npm run start ports: - "3000:3000" mongo: container_name: mongo image: mongo command: ["mongod", "--bind_ip_all"] volumes: - /app:/data/configdb - mongo-data:/data/db ports: - "27017:27017" volumes: mongo-data:
docker-compose.yml docker-compose.yml
version: "3"版本:“ 3”\nservices:
服务:\n app:
应用程式:\n container_name: projectX
container_name:projectX\n image: docker-node-express-mongoapp
图片:docker-node-express-mongoapp\n restart: always
重启:总是\n build: .
建立:。\n command: npm run start
命令:npm运行开始\n ports:
端口:\n - "3000:3000"
-“ 3000:3000”\n\n\n mongo:
蒙哥:\n container_name: mongo
container_name:mongo\n image: mongo
图片:蒙哥\n command: ["mongod", "--bind_ip_all"]
命令:[“ mongod”,“ --bind_ip_all”]\n volumes:
数量: \n - /app:/data/configdb
-/ app:/ data / configdb\n - mongo-data:/data/db
-mongo-data:/数据/数据库\n ports:
端口:\n - "27017:27017"
-“ 27017:27017”\n\nvolumes:
数量:\n mongo-data:
mongo-data:
If I type in the browser "192.168.99.100:3000/gallery" I had only data (json) response from database but not any html/css code. 如果我在浏览器中输入“ 192.168.99.100:3000/gallery”,则只有数据库的数据(json)响应,而没有任何html / css代码。
When I try manually send index.html to the browser with: 当我尝试通过以下方式手动将index.html发送到浏览器时:
app.get('/', function(request, response) { response.sendFile(path.resolve(__dirname + '../../../frontend/src/index.html'), ); });
I have problem with load frontend-output.js. 我对load frontend-output.js有问题。 (404 not found)
(找不到404)
Thank you very much for help :) 非常感谢您的帮助:)
PROBLEM SOLVED !!! 问题解决了 !!! to dockerfile add:
到dockerfile添加:
to docker-compose.yml add: 到docker-compose.yml添加:
and set port for devServer in webpack.config.js 并在webpack.config.js中设置devServer的端口
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.