nginx 代理访问 nodejs 问题

[aaabababa]

npm run dev http://127.0.0.1:8080/sockjs-node/info?t=1709478831246

nginx proxy_pass http://127.0.0.1:8080;

本地访问是正常的，用 nginx 域名访问后， 链接会多个端口出来的。 https://www.test.com:8080/sockjs-node/info?t=1709478831246

npm -v 8.19.4

Operating system

Linux instance-20240121-1638 3.10.0-1160.105.1.el7.x86_64 #1 SMP Thu Dec 7 15:39:45 UTC 2023 x86_64 x86_64 x86_64 GNU/Linux Scope

code

try { self.xhr.send(payload); } catch (e) { self.emit('finish', 0, ''); self._cleanup(false); }

[andyskaura]

你服务监听的 8080 ，nginx 监听的也是 8080 ？

[br_wang]

这是 HMR 的服务吧？

[aaabababa]

@andyskaura 服务是 8080 ， nginx 监听 80 443 ，反向代理到 proxy_pass http://127.0.0.1:8080;

[aaabababa]

@br_wang 不太懂，用的 npm 启动项目

[HHsunday]

没猜错的话，估计要加上

proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "Upgrade";

[aaabababa]

@HHsunday 原来就上有的，还是一样域名后有 8080 端口

[YellowDog7]

cat /etc/config/default/nginx.conf 贴一下 nginx 的配置。

[LASockpuppet]

nginx 443 代理到 8080 就不用加端口吧

[aaabababa]

@YellowDog7

server {
listen 443;
server_name chat.test.net;
ssl_certificate /etc/letsencrypt/live/test.net/fullchain.pem;
ssl_certificate_key /etc/letsencrypt/live/test.net/privkey.pem;
ssl_session_timeout 5m;
ssl_protocols TLSv1 TLSv1.1 TLSv1.2 TLSv1.3;
ssl_ciphers ECDHE-RSA-AES128-GCM-SHA256:ECDHE:ECDH:AES:HIGH:!NULL:!aNULL:!MD5:!ADH:!RC4;
ssl_prefer_server_ciphers on;
set $oldclient 0;
root /www/test/chat;
index index.php index.html;
include /etc/nginx/ext/*.conf;
location / {
proxy_pass http://127.0.0.1:8080;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection 'upgrade';
proxy_set_header Host $host;
proxy_cache_bypass $http_upgrade;
}
}

[zhhbstudio]

这个我能猜，你的 node 的服务启动时有一个判断当前端口的动作，所以在请求时请求的是当前域名的 8080 端口

[aaabababa]

@zhhbstudio 要怎么改呢？

看了日志，是 sockjs-client 这个模块 sockjs.js 文件

try {
self.xhr.send(payload);
} catch (e) {
self.emit('finish', 0, '');
self._cleanup(false);
}

这段代码报的错，注释之后，就没有了。只是注释之后，没有新消息提醒的。。。

[zhhbstudio]

@aaabababa 你是要远程调试吗？这个应该是调试时用的到的（ npm run dev 调试模式）
不是调试模式的话你看看 package.json 里边的 script 下边都有啥脚本 一般前端项目是 build 然后静态文件直接给 nginx 用

[zhhbstudio]

你在 new SocketJS 时传入的参数是什么

[aaabababa]

@zhhbstudio

"scripts": {
"dev": "webpack-dev-server --inline --progress --config build/webpack.dev.conf.js",
"start": "npm run dev",
"build": "node build/build.js"
},



webpack.dev.conf.js


'use strict'
const utils = require('./utils')
const webpack = require('webpack')
const config = require('../config')
const merge = require('webpack-merge')
const path = require('path')
const baseWebpackConfig = require('./webpack.base.conf')
const CopyWebpackPlugin = require('copy-webpack-plugin')
const HtmlWebpackPlugin = require('html-webpack-plugin')
const FriendlyErrorsPlugin = require('friendly-errors-webpack-plugin')
const portfinder = require('portfinder')

const HOST = process.env.HOST
const PORT = process.env.PORT && Number(process.env.PORT)

const devWebpackConfig = merge(baseWebpackConfig, {
module: {
rules: utils.styleLoaders({ sourceMap: config.dev.cssSourceMap, usePostCSS: true })
},
// cheap-module-eval-source-map is faster for development
devtool: config.dev.devtool,

// these devServer options should be customized in /config/index.js
devServer: {
clientLogLevel: 'warning',
historyApiFallback: {
rewrites: [
{ from: /.*/, to: path.posix.join(config.dev.assetsPublicPath, 'index.html') },
],
},
hot: true,
contentBase: false, // since we use CopyWebpackPlugin.
compress: true,
host: HOST || config.dev.host,
port: PORT || config.dev.port,
disableHostCheck: true,
open: config.dev.autoOpenBrowser,
overlay: config.dev.errorOverlay
? { warnings: false, errors: true }
: false,
publicPath: config.dev.assetsPublicPath,
proxy: config.dev.proxyTable,
quiet: true, // necessary for FriendlyErrorsPlugin
watchOptions: {
poll: config.dev.poll,
}
},
plugins: [
new webpack.DefinePlugin({
'process.env': require('../config/dev.env')
}),
new webpack.HotModuleReplacementPlugin(),
new webpack.NamedModulesPlugin(), // HMR shows correct file names in console on update.
new webpack.NoEmitOnErrorsPlugin(),
// https://github.com/ampedandwired/html-webpack-plugin
new HtmlWebpackPlugin({
filename: 'index.html',
template: 'index.html',
inject: true
}),
// copy custom static assets
new CopyWebpackPlugin([
{
from: path.resolve(__dirname, '../static'),
to: config.dev.assetsSubDirectory,
ignore: ['.*']
}
])
]
})

module.exports = new Promise((resolve, reject) => {
portfinder.basePort = process.env.PORT || config.dev.port
portfinder.getPort((err, port) => {
if (err) {
reject(err)
} else {
// publish the new Port, necessary for e2e tests
process.env.PORT = port
// add port to devServer config
devWebpackConfig.devServer.port = port

// Add FriendlyErrorsPlugin
devWebpackConfig.plugins.push(new FriendlyErrorsPlugin({
compilationSuccessInfo: {
messages: [`Your application is running here: http://${devWebpackConfig.devServer.host}:${port}`],
},
onErrors: config.dev.notifyOnErrors
? utils.createNotifierCallback()
: undefined
}))

resolve(devWebpackConfig)
}
})
})




ort: PORT || config.dev.port,

也是 config 传过来的吧
new SocketJS 时传入的参数？
不太懂

[zhhbstudio]

有没有 .env 文件，有的话把 PORT=8080 改成 80 别用 nginx 转发了

[aaabababa]

@zhhbstudio

不只这一个项目呢，还需要 nginx 代理其他的。。。

[zhhbstudio]

把你项目情况详细介绍一下我复现一下试试？最好是直接贴个 package.json 的文件

[aaabababa]

@zhhbstudio
https://gitee.com/qice/qchat
https://gitee.com/qice/QchatServer

就这个，别人的源码，谢谢大佬

[Belmode]

这个问题我也遇到过类似的，但是不是太理解。

外部有个公网域名: test.com ， 配置第一层域名 nginx 跳板反代 /xxx 到 内网 172.x.x.x:8103,
配置第二层服务 nginx 前端, /xxx 到容器内 127.0.0.1:7103.

按理说，直接访问 http:test.com/xxx ，会访问容器中 http://127.0.0.1:7103/xxx ，但是实际上会发生一次 重!定!向!，
最终会访问到 http:test.com:7103/xxx.

@aaabababa 我感觉 OP 应该遇到类似的问题，因为发生过一次重定向。

[aaabababa]

@Belmode 是只要有重定向,nginx 都会有这个问题？

[zhhbstudio]

今天刚有时间看了一眼，你是想远程调试还是？不调试的话直接 npm run build ，然后目录下出现一个 dist 文件夹，直接把文件夹给 nginx 当静态网站部署就行了。

[aaabababa]

@zhhbstudio 原来可以这样玩的，nginx 可以直接解析访问 js 文件？ 没有报错了，感谢