ในบทความนี้ ผมจะกล่าวถึงการโฮสต์แอป 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