ฉันใช้ pm2 เพื่อเรียกใช้แอป MERN เป็นกระบวนการเมื่อฉันพิมพ์ ขด http://localhost:3000
ในคอนโซลผลลัพธ์นั้นมาจากแอพของฉัน แต่ nginx reverse proxy ไม่ทำงาน แอปทำงานบน vps และเชื่อมต่อกับชื่อโดเมน แต่ฉันได้รับ 'เปลี่ยนเส้นทางคุณหลายครั้งเกินไป' จากเบราว์เซอร์
server.js
พอร์ตการลงทุน = 3000
แอป const = ด่วน ()
เราเตอร์ const = express.Router()
const { ถาวร, ร้านค้า } = createPersistor ()
const serverRenderer = (req, res, ถัดไป) => {
app.get('/*', ฟังก์ชัน (req, res) {
res.sendFile (path.join (__dirname, '../build/index.html'), ฟังก์ชัน (ข้อผิดพลาด) {
ถ้า (ผิดพลาด) {
res.status(500).send(ผิดพลาด)
}
})
})
บริบท const = {}
fs.readFile(path.resolve('./build/index.html'), 'utf8', (ข้อผิดพลาด, ข้อมูล) => {
ถ้า (ผิดพลาด) {
คอนโซล ข้อผิดพลาด (ผิดพลาด)
ส่งคืน res.status(500).send('เกิดข้อผิดพลาด')
}
ส่งคืน res.send(
data.replace(
'<div id="root"></div>',
`<div id="รูท">
${ReactDOMServer.renderToString(
<ร้านค้าผู้ให้บริการ={ร้านค้า}>
<ตำแหน่ง StaticRouter={req.url} บริบท={บริบท}>
<โหลด PersistGate={null} ยืนยัน={persistor}>
<แอป />
</เพอร์ซิสต์เกท>
</StaticRouter>
</ผู้ให้บริการ>
)}
</div>`
)
)
})
}
router.use('^/$', serverRenderer)
เราเตอร์ ใช้ (
express.static(path.resolve(__dirname, '..', 'build'))
)
app.use (เราเตอร์)
app.listen(PORT, () => {
console.log(`SSR ทำงานบนพอร์ต ${PORT}`)
})
nginx/sites-available/default:
เซิร์ฟเวอร์ {
ฟัง 80 default_server;
ฟัง [::]:80 default_server;
server_name 198.51.100.255;
ส่งคืน 302 $scheme://mysite.com$request_uri;
ที่ตั้ง / {
# ความพยายามครั้งแรกในการให้บริการคำขอเป็นไฟล์ จากนั้น
# เป็นไดเร็กทอรี จากนั้นถอยกลับไปแสดง 404
try_files $uri $uri/ =404;
proxy_pass http://localhost:3000;
proxy_http_version 1.1;
proxy_set_header อัพเกรด $http_upgrade;
proxy_set_header การเชื่อมต่อ 'อัปเกรด';
proxy_set_header โฮสต์ $host;
proxy_cache_bypass $http_upgrade;
}
}
และไม่มีบันทึกข้อผิดพลาด
หมายเหตุ: ฉันยังไม่ได้กำหนดค่า SSL