“加载资源失败：服务器响应状态为 404”express docker
Posted
技术标签:
【中文标题】“加载资源失败：服务器响应状态为 404”express docker【英文标题】："Failed to load resource: the server responded with a status of 404" express docker 【发布时间】：2019-01-27 20:38:51 【问题描述】：我在浏览器中收到错误消息“加载资源失败：服务器响应状态为 404”，我正在使用 Node/Express、Mongo 数据库和 Docker。 没有 Docker 一切正常。
文件夹结构：
后端 服务器 server.js 前端 源 index.html 分布 webpack.config.js package.json Dockerfile docker-compose.yml
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
<!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 脚本
"server": "node ./backend/server/server.js",
"webpack": " webpack-dev-server --host 0.0.0.0 --disable-host-check",
"start": "run-p webpack server " /* run-p is part of npm-run-all package*/
Dockerfile
FROM node:latest
WORKDIR /app
COPY . /app
EXPOSE 3000
docker-compose.yml
版本：“3”
服务：
应用程序：
容器名称：projectX
图片：docker-node-express-mongoapp
重启：总是
建造： 。
命令： npm 运行开始
端口：
- “3000:3000”
蒙哥：
容器名称：mongo
图片：蒙哥
命令：[“mongod”，“--bind_ip_all”]
卷：
- /app:/data/configdb
- 蒙戈数据：/数据/分贝
端口：
- “27017:27017”
卷：
mongo 数据：
如果我在浏览器中输入“192.168.99.100:3000/gallery”，我只有来自数据库的数据 (json) 响应，但没有任何 html/css 代码。
当我尝试手动将 index.html 发送到浏览器时：
app.get('/', function(request, response)
response.sendFile(path.resolve(__dirname + '../../../frontend/src/index.html'),
);
);
我在加载 frontend-output.js 时遇到问题。 （404 未找到）
非常感谢您的帮助:)
【问题讨论】：
你能显示你的frontend-output.js脚本的代码吗？您是否尝试过从浏览器访问 192.168.99.100:3000/？ 是的，我试过了。前端输出应该从 webpack 编译。帖子已编辑，我添加了 webpack.config.js。 【参考方案1】：问题解决了！！！ 到 dockerfile 添加：
曝光 3000 暴露 8080到 docker-compose.yml 添加：
端口： “8080:8080” “3000:3000”并在 webpack.config.js 中为 devServer 设置端口
端口：8080【讨论】：
以上是关于“加载资源失败：服务器响应状态为 404”express docker的主要内容，如果未能解决你的问题，请参考以下文章
Apache Cordova：“加载资源失败：服务器响应状态为 404（未找到）”