ในบทความนี้ ผมจะกล่าวถึงการโฮสต์แอป Node.js บนเซิร์ฟเวอร์โฮสติ้งที่ใช้ร่วมกัน NamecheapâÃÂÃÂs โดยใช้ cPanel ฉันจะไม่พูดถึงการตั้งค่าเซิร์ฟเวอร์ฐานข้อมูลหรือส่วนหน้าของ React สำหรับเว็บแอปของคุณในบทความนี้ ฉันต้องการมุ่งเน้นไปที่ความท้าทายที่คุณอาจเผชิญจากการใช้งานแอปโหนดในสภาพแวดล้อมการโฮสต์ที่ใช้ร่วมกัน
== อย่ารอช้า จัดเลยวันนี้! ==
ก่อนที่คุณจะพัฒนาเว็บแอปของคุณไปไกลเกินไป คุณควรวางเวอร์ชันเสถียรไว้ออนไลน์ก่อน ซึ่งอาจอยู่ในสภาพแวดล้อมการผลิตของคุณ หรือในสภาพแวดล้อมการจัดเตรียมที่คล้ายกับสภาพแวดล้อมการผลิตของคุณ คนส่วนใหญ่จะรอจนกว่าแอปของพวกเขาจะเสร็จสมบูรณ์ก่อนที่จะโฮสต์แอปออนไลน์ âÃÂàและนี่คือสิ่งที่ฉันทำเมื่อพัฒนาเว็บแอป React และ Node แรกของฉัน อย่างไรก็ตาม ณ จุดนั้น ฉันมีความท้าทายมากมายในการทำให้เซิร์ฟเวอร์ Node API ของฉันทำงาน และฉันก็ต้องทำการเปลี่ยนแปลงมากมายกับแอป React ของฉัน นั่นคือเหตุผลที่ฉันแนะนำให้วางเวอร์ชันออนไลน์ตั้งแต่เนิ่นๆ เพื่อที่คุณจะได้ปรับเปลี่ยนได้ก่อนที่จะเขียนโค้ดมากเกินไป
== การใช้บริการโฮสติ้งที่ใช้ร่วมกัน ==
NamecheapâÃÂàเซิร์ฟเวอร์โฮสติ้งที่ใช้ร่วมกันใช้ cPanel เป็นอินเทอร์เฟซแผงควบคุมเพื่อจัดการเซิร์ฟเวอร์ Apache คำแนะนำเหล่านี้ควรช่วยเหลือทุกคนที่ใช้บริการโฮสติ้งร่วมกับ cPanel เช่น A2 Hosting และ GoDaddy
ฉันยังได้ตั้งค่าเซิร์ฟเวอร์ Namecheap ด้วยใบรับรอง SSL และ cPanel โดยค่าเริ่มต้นจะเปลี่ยนเส้นทางการรับส่งข้อมูล HTTP ทั้งหมดไปยัง HTTPS ดังนั้นการรับส่งข้อมูลทั้งหมดไปยังเซิร์ฟเวอร์ของฉันจึงปลอดภัย
คุณจะพบคำแนะนำมากมายเกี่ยวกับวิธีโฮสต์แอป Node บนบริการโฮสติ้ง VPS (Virtual Private Server) เช่น DigitalOcean หากคุณกำลังเริ่มต้นจากศูนย์ การโฮสต์โดยใช้บริการเช่นนั้นจะทำให้คุณควบคุมได้มากขึ้น แต่มักจะมีราคาแพงกว่าโฮสติ้งที่ใช้ร่วมกัน และในกรณีของฉัน ฉันได้ชำระค่าบริการโฮสติ้งที่ใช้ร่วมกันของ Namecheap แล้ว
ข้อดีบางประการของการใช้ cPanel และโฮสติ้งที่ใช้ร่วมกัน:
- จัดการด้วยคอนโซลการจัดการเว็บที่เรียบง่าย
- ง่ายต่อการกำหนดค่า
- ราคาถูก โดยเฉพาะอย่างยิ่งถ้าคุณกำลังโฮสต์ไซต์ / โดเมนอยู่แล้ว
- สามารถตั้งค่าเว็บไซต์ไดนามิกได้อย่างง่ายดายโดยใช้เทคโนโลยีอื่นๆ เช่น PHP เป็นต้น หากคุณกำลังสำรวจเทคโนโลยีต่างๆ
ข้อเสียบางประการ:
- âÃÂÃÂcontrolâÃÂàน้อยลง เนื่องจากคุณไม่มีสิทธิ์เข้าถึงระบบปฏิบัติการพื้นฐาน
- ไม่สามารถปรับขนาดได้
== ทุกอย่างหายไปไหน? ==
ก่อนอื่น คุณต้องสร้างโฟลเดอร์สำหรับไฟล์ต้นฉบับทั้งหมดสำหรับแอป Node ของคุณ ฉันสร้างโฟลเดอร์ชื่อ âÃÂÃÂnodejsâÃÂàในไดเร็กทอรี /home/ชื่อผู้ใช้ และภายในโฟลเดอร์นี้ ฉันสร้างโฟลเดอร์ย่อยสำหรับแต่ละแอป ตอนนี้อัปโหลดไฟล์ต้นฉบับทั้งหมดของคุณไปยังโฟลเดอร์ย่อยนี้ ตรวจสอบให้แน่ใจว่าคุณได้รวมไฟล์ package.json ไว้ด้วย คุณไม่ได้อัปโหลดโฟลเดอร์ âÃÂÃÂnode_modulesâÃÂàเนื่องจากจะถูกสร้างขึ้นด้วยตัวจัดการแพ็คเกจ ภายหลัง.
โปรดจำไว้ว่าเราเพิ่งโฮสต์เซิร์ฟเวอร์ Node API ในตัวอย่างสถาปัตยกรรมเว็บแอปของเรา เราจะไม่โฮสต์แอป React โดยใช้ Node (เพิ่มเติมเกี่ยวกับหัวข้อนี้ในบทความถัดไป)
httpsdavenewman.tech/wp-content/uploads/2020/06/Diagram-5_1.jpg โครงร่างโฟลเดอร์แสดงไฟล์ต้นฉบับของโหนดภายใต้โฟลเดอร์ /home/username/nodejs/mynodeapi และมี .htaccess ในโฟลเดอร์ /home/username/public_html/myapi
== ปัญหา âÃÂàแอปโหนดไม่สามารถเข้าถึงพอร์ต ==
ความท้าทายที่ใหญ่ที่สุดในการทำให้แอป Node API ของฉันทำงาน ปัญหาคือโค้ดตัวอย่างที่ระบุในเอกสารสนับสนุน NamecheapâÃÂÃÂs ใช้งานไม่ได้! พยายามสร้าง httpsserver เพื่อฟังบนพอร์ต 80 และเซิร์ฟเวอร์ http **s** บนพอร์ต 443 อย่างไรก็ตาม ฉันได้รับข้อผิดพลาด EACCESS เสมอโดยแจ้งว่าฉันไม่ได้รับอนุญาต เพื่อใช้พอร์ตเหล่านั้น
== โซลูชัน âÃÂàโหนดไม่ âÃÂàไม่จำเป็นต้องเข้าถึงพอร์ต! ==
ในที่สุดฉันก็พบวิธีแก้ปัญหาโดยการอ่านความคิดเห็นของผู้ใช้ SibProgrammer ในเธรดเกี่ยวกับ Plesk ซึ่งเป็นแผงควบคุมโฮสติ้งอื่น cPanel ใช้เซิร์ฟเวอร์แอปพลิเคชัน Phusion Passenger เพื่อโฮสต์แอป Node เช่นเดียวกับ Plesk สรุป:
เมื่อคุณส่งคำขอจากเบราว์เซอร์ของคุณ คำขอจะส่งไปยังเซิร์ฟเวอร์ Apache จากนั้นไปที่ Phusion Passenger และจากนั้นไปยังแอปโหนดของคุณ แอป Node ของคุณไม่จำเป็นต้องเป็นเจ้าของพอร์ต เนื่องจากเซิร์ฟเวอร์แอปพลิเคชัน Apache และ Phusion Passenger จะจัดการอัปสตรีมเพิ่มเติม
ซึ่งจะทำให้โค้ดสำหรับสร้าง httpsserver ในไฟล์ www.js (หรือ app.js) ของคุณง่ายขึ้น:
* www.js * ทดสอบการสร้างเซิร์ฟเวอร์ http สำหรับ Namecheap * Dave */ const http = required('http http.createServer(function(request, response) { response.writeHead(200, {'Content-Type': 'text/html response.endh1>Hello Worldh1 ฟัง (process.env .PORT); console.log('แอปกำลังทำงาน
สิ่งที่ควรทราบ:
- ฟังใน process.env.PORT (แทนการตั้งค่าด้วยตนเอง 80 หรือ 443) เมื่อทดสอบฉันสังเกตเห็นว่าไม่ได้กำหนด process.env.PORT! แต่น่าสนใจว่าไม่สำคัญในกรณีนี้
- ใช้เซิร์ฟเวอร์ http แม้ว่าคุณจะตั้งค่า SSL แล้วก็ตาม cPanel ได้กำหนดค่า Apache ให้เปลี่ยนเส้นทางการรับส่งข้อมูล HTTP ทั้งหมดไปยัง HTTPS และส่งผลให้ตอบสนองคำขอทั้งหมดด้วย HTTPS คุณไม่จำเป็นต้องกำหนดค่าแอปโหนดด้วยตนเองเพื่อตั้งค่าเซิร์ฟเวอร์ https และอ่านในใบรับรอง SSL ของคุณ
== ขั้นตอนสุดท้ายสำหรับเซิร์ฟเวอร์ Node API ==
ตอนนี้ควรเป็นกระบวนการที่ค่อนข้างง่ายในการทำตามคำแนะนำเพื่อตั้งค่าแอปโหนดของคุณ
httpsdavenewman.tech/wp-content/uploads/2020/06/Diagram-5_2.jpg ภาพหน้าจอของหน้าการกำหนดค่า cPanelâÃÂÃÂs Node.js
- เลือกเวอร์ชันที่เหมาะสมของ Node.js และโหมดแอปพลิเคชัน (แนะนำให้ใช้งานจริง)
- âÃÂÃÂApplication rootâÃÂàจะเป็นโฟลเดอร์ที่คุณอัปโหลดไฟล์ต้นฉบับของคุณก่อนหน้านี้ (âÃÂànodejs/mynodeapiâÃÂàในตัวอย่างด้านบน)
- âÃÂÃÂApplication URLâÃÂàจะเป็น URL ที่ใช้ในการเข้าถึง API ของคุณ (âÃÂÃÂmyapià ¢ÃÂàในตัวอย่าง) ชื่อที่คุณระบุในช่องนี้จะใช้เพื่อสร้างโฟลเดอร์ย่อยในโฟลเดอร์ /home/username/public_html ของคุณ ไม่จำเป็นต้องเป็นชื่อเดียวกันกับโฟลเดอร์ âÃÂÃÂApplication rootâÃÂà(แต่ มักจะเป็น)
- ไฟล์เริ่มต้นของแอปพลิเคชัน âÃÂàจะเป็น www.js หรือ app.js ขึ้นอยู่กับว่าคุณสร้างแอปโหนดของคุณอย่างไร
- ขึ้นอยู่กับคุณว่าคุณต้องการกำหนดค่าไฟล์บันทึกของ Passenger อย่างไร
- เมื่อคุณสร้างแอปแล้ว âÃÂàจะเห็นปุ่มเพื่อ âÃÂÃÂRun NPM Installà ¢ÃÂÃÂ. เรียกใช้สิ่งนี้และจะสร้างโฟลเดอร์ âÃÂÃÂnode_modulesâÃÂàพร้อมด้วยโมดูลที่ต้องพึ่งพาทั้งหมดที่แอปของคุณต้องการ
เมื่อคุณตั้งค่าแอปโหนดและเริ่มต้นใช้งานแล้ว แอปจะสร้างโฟลเดอร์ย่อยในโฟลเดอร์ /home/public_html ของคุณ ตอนนี้ คุณจะต้องไปที่โฟลเดอร์นั้นและแก้ไขไฟล์ .htaccess และเพิ่มในบรรทัดต่อไปนี้:
RewriteEngine ปิดอยู่
วิธีนี้จะป้องกันไม่ให้เซิร์ฟเวอร์ Apache เขียนซ้ำ (หรือเปลี่ยนเส้นทาง) คำขอใดๆ ที่จำเป็นต้องไปยังเซิร์ฟเวอร์ API ของคุณ
และนั่นคือทั้งหมด! ตอนนี้แอป Node API ของคุณควรพร้อมใช้งานและตอบสนองต่อการเรียก API ของคุณแล้ว
== แล้วอะไรต่อไปล่ะ? ==
ตอนนี้เราได้ตั้งค่าเซิร์ฟเวอร์ Node API แล้ว เราสามารถเปลี่ยนส่วนหน้า React ของเราในสภาพแวดล้อมการพัฒนาให้ชี้ไปที่เซิร์ฟเวอร์ API นี้ได้ หรือเราสามารถใช้บุรุษไปรษณีย์เพื่อทดสอบการเรียก API ของเรา
ในบทความถัดไป เราจะดูที่การโฮสต์แอป React บน Namecheap และ cPanel