แอปตอบโต้ของฉันใช้งานได้หากตั้งค่า nginx reverse-proxy ดังนี้:
เซิร์ฟเวอร์ {
ฟัง 80;
ชื่อเซิร์ฟเวอร์ my_public_vps_addr;
ที่ตั้ง / {
proxy_pass http://127.0.0.1:3000/;
}
}
ฉันสามารถโหลดหน้าเว็บได้อย่างถูกต้องที่ http://my_public_vps_addr/
แต่ฉันต้องการเข้าถึงไซต์ผ่าน http://my_public_vps_addr/ecapp/
ดังนั้นฉันจึงกำหนดค่า nginx:
เซิร์ฟเวอร์ {
ฟัง 80;
ชื่อเซิร์ฟเวอร์ my_public_vps_addr;
ตำแหน่ง /ecapp/ {
proxy_pass http://127.0.0.1:3000/;
}
}
ตอนนี้ถ้าฉันโหลดหน้าเว็บที่ http://my_public_vps_addr/ecapp/ และตรวจสอบคอนโซล ฉันจะได้รับ:
รับ http://my_public_vps_addr/static/js/bundle.js
[ไม่พบ HTTP/1.1 404 147ms]
รับ http://my_public_vps_addr/static/js/0.chunk.js
[ไม่พบ HTTP/1.1 404 433ms]
รับ http://my_public_vps_addr/static/js/main.chunk.js
[ไม่พบ HTTP/1.1 404 424ms]
ฉันได้ระบุสาเหตุที่เป็นไปได้ ควรดึงเนื้อหาจาก http://my_public_vps_addr/ecapp/static/js/bundle.js ฯลฯ แทน http://my_public_vps_addr/static/js/bundle.js.
เพื่อแก้ไขข้อผิดพลาดนี้ ฉันจะแสดงซอร์สโค้ดที่เกี่ยวข้อง:
server.js
const ด่วน = ต้องการ ('ด่วน');
การบีบอัด const = ต้องการ ('การบีบอัด');
เส้นทาง const = ต้องการ ('เส้นทาง');
แอพ const = ด่วน ();
app.use(บีบอัด());
app.use(express.static(path.join(__dirname, 'build')));
app.get('*', function(req, res) {
res.sendFile (path.join (__dirname, 'build', 'index.html'));
});
const PORT = process.env.PORT || 3000;
app.listen(PORT, () => {
console.log(`แอปทำงานบนพอร์ต ${PORT}`);
});
ฉันพยายามแล้ว app.use('/ecapp/static', express.static(path.join(__dirname, 'build'))); แต่ไม่มีโชค
Routes.js
เส้นทาง const = () => {
กลับ (
<เบราว์เซอร์เราเตอร์>
<สวิตช์>
<Route path="/" ส่วนประกอบที่แน่นอน={Home} />
...
</สวิตซ์>
</เบราว์เซอร์เราเตอร์>
);
};
ฉันพยายามแล้ว <BrowserRouter basename='/ecapp'></BrowserRouter> แต่ไม่มีโชค
ฉันคิดว่าแอปจะโหลดอย่างถูกต้องที่ http://my_public_vps_addr/ecapp/ หากฉันสามารถกำหนดค่าหน้าเพื่อค้นหาเนื้อหาที่ http://my_public_vps_addr/ecapp/static/*. ฉันต้องการความช่วยเหลือในการทำสิ่งนี้
ฉันคิดออกแล้วฉันจึงโพสต์วิธีแก้ปัญหาที่นี่
ในการโฮสต์ไซต์ create-react-app ที่ http://my_public_vps_addr:port/sub_path
<Router basename=â/sub_pathâ></Router>sudo ค้นหา - พิมพ์ d -exec chmod 755 {} \;
ข) sudo ค้นหา -ประเภท f -exec chmod 644 {} \; เซิร์ฟเวอร์ {
ฟังพอร์ต;
ฟัง [::]:พอร์ต;
รูท /var/www/sub_path/html;
ดัชนี index.html index.htm index.nginx-debian.html;
ชื่อเซิร์ฟเวอร์ my_public_vps_addr:พอร์ต;
ตำแหน่ง /sub_path {
try_files $uri $uri/ /index.html =404
}
}
ฉันเปลี่ยนเป็น:
ตำแหน่ง /ecapp/ {
sub_filter '<script src="/static' '<script src="/ecapp/static';
sub_filter_once ปิด;
proxy_set_header ยอมรับการเข้ารหัส "";
proxy_pass http://127.0.0.1:3000;
}
และตอนนี้ ดูแหล่งที่มา:http://my_public_vps_ip_addr/ecapp/ เป็น:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8" />
<link rel="shortcut icon" href="/favicon.ico" />
<meta name="viewport" content="width=device-width, initial-scale=1" />
<meta name="theme-color" content="#000000" />
<link rel="manifest" href="/manifest.json" />
<link
rel="stylesheet"
href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css"
integrity="sha384-ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T"
crossorigin="anonymous"
/>
<title>React App</title>
</head>
<body>
<noscript>You need to enable JavaScript to run this app.</noscript>
<div id="root"></div>
<!--
This HTML file is a template.
If you open it directly in the browser, you will see an empty page.
You can add webfonts, meta tags, or analytics to this file.
The build step will place the bundled scripts into the <body> tag.
To begin the development, run `npm start` or `yarn start`.
To create a production bundle, use `npm run build` or `yarn build`.
-->
<script src="/ecapp/static/js/bundle.js"></script><script src="/ecapp/static/js/0.chunk.js"></script><script src="/ecapp/static/js/main.chunk.js"></script></body>
</html>
แต่ตอนนี้กำลังโหลด http://my_public_vps_ip_addr/ecapp/ ให้:
สคริปต์จาก âhttp://my_public_vps_addr/ecapp/static/js/bundle.jsâ ถูกโหลดแม้ว่าประเภท MIME (âtext/htmlâ) จะไม่ใช่ประเภท MIME ของ JavaScript ที่ถูกต้องก็ตาม
...
Uncaught SyntaxError: นิพจน์ที่คาดหวัง ได้รับ '<'
http://my_public_vps_addr/ecapp/static/js/bundle.js ฯลฯ กลับไม่มีเนื้อหา
คนส่วนใหญ่ไม่เข้าใจว่าการถามคำถามมากมายจะปลดล็อกการเรียนรู้และปรับปรุงความสัมพันธ์ระหว่างบุคคล ตัวอย่างเช่น ในการศึกษาของ Alison แม้ว่าผู้คนจะจำได้อย่างแม่นยำว่ามีคำถามกี่ข้อที่ถูกถามในการสนทนา แต่พวกเขาไม่เข้าใจความเชื่อมโยงระหว่างคำถามและความชอบ จากการศึกษาทั้ง 4 เรื่องที่ผู้เข้าร่วมมีส่วนร่วมในการสนทนาด้วยตนเองหรืออ่านบันทึกการสนทนาของผู้อื่น ผู้คนมักไม่ตระหนักว่าการถามคำถามจะมีอิทธิพลหรือมีอิทธิพลต่อระดับมิตรภาพระหว่างผู้สนทนา
