nginx: ส่งคำขอทั้งหมดไปที่หน้า html เดียว

ใช้ nginx ฉันต้องการรักษา URL แต่จริง ๆ แล้วโหลดหน้าเดียวกันไม่ว่าอะไรก็ตาม ฉันจะใช้ URL ด้วยHistory.getState()เพื่อกำหนดเส้นทางคำขอในแอปพลิเคชันจาวาสคริปต์ของฉัน ดูเหมือนว่ามันควรจะเป็นเรื่องง่ายที่จะทำ?

location / {
    rewrite (.*) base.html break;
}

ใช้งานได้ แต่เปลี่ยนเส้นทาง URL หรือไม่ ฉันยังต้องการ URL ฉันต้องการใช้หน้าเดิมเสมอ

ฉันคิดว่านี่จะทำเพื่อคุณ:

location / {
    try_files /base.html =404;
}

การใช้try_filesไม่ได้ผลกับฉัน - มันทำให้เกิดข้อผิดพลาดในการเขียนซ้ำหรือเปลี่ยนเส้นทางภายในในบันทึกของฉัน

เอกสาร Nginx มีรายละเอียดเพิ่มเติมบางอย่าง:

http://nginx.org/en/docs/http/ngx_http_core_module.html#try_files

ดังนั้นฉันจึงลงเอยด้วยการใช้สิ่งต่อไปนี้:

root /var/www/mysite;

location / {
    try_files $uri /base.html;
}

location = /base.html {
    expires 30s;
}

การเขียนครั้งแรกของคุณควรจะได้ผล ฉันไม่แน่ใจว่าทำไมมันถึงต้องเปลี่ยนเส้นทาง แต่ฉันคิดว่าสิ่งที่คุณต้องการเป็นเพียงแค่

rewrite ^ /base.html break;

คุณควรจะวางไว้ในที่ตั้งหรือในเซิร์ฟเวอร์โดยตรง

สิ่งนี้ใช้ได้กับฉัน:

location / {
    alias /path/to/my/indexfile/;
    try_files $uri /index.html;
}

สิ่งนี้ทำให้ฉันสามารถสร้าง URL ทั้งหมดสำหรับแอปพลิเคชันหน้าเดียวแบบจาวาสคริปต์ ไฟล์ทั้งหมดที่คงที่เช่น CSS แบบอักษรและจาวาสคริปต์ที่สร้างขึ้นโดยจะพบว่าพวกเขาอยู่ในไดเรกทอรีเดียวกันกับ npm run build index.html

หากไฟล์คงที่อยู่ในไดเรกทอรีอื่นด้วยเหตุผลบางประการคุณต้องมีสิ่งต่อไปนี้:

# Static pages generated by "npm run build"
location ~ ^/css/|^/fonts/|^/semantic/|^/static/ {
    alias /path/to/my/staticfiles/;
}

สิ่งนี้ใช้ได้กับฉัน:

location / {
    try_files $uri $uri/ /base.html;
}

วิธีที่ถูกต้องจะเป็น:

location / {
    rewrite (.*) base.html last;
}

การใช้lastจะทำให้ nginx ค้นหาlocationบล็อกที่เหมาะสมใหม่ตามผลลัพธ์ของการเขียนใหม่

try_files ยังเป็นวิธีที่ถูกต้องสมบูรณ์ในการแก้ไขปัญหานี้