In dit artikel zal ik het hosten van een Node.js-app op de shared hosting-servers van Namecheap behandelen met behulp van cPanel. Ik zal in dit artikel niet ingaan op het instellen van de databaseserver of de React-frontend voor uw webapp. In plaats daarvan wil ik me concentreren op de uitdagingen waarmee u te maken kunt krijgen bij het uitvoeren van een Node-app in een gedeelde hostingomgeving.

== Stel niet uit, host vandaag nog! ==

Voordat u te ver gaat met het ontwikkelen van uw webapp, is het een goed idee om een ​​stabiele versie online te zetten. Dit kan in uw productieomgeving zijn, of in een testomgeving die vergelijkbaar is met uw productieomgeving. De meeste mensen wachten tot hun app bijna voltooid is voordat ze deze online hosten. Dit is wat ik deed bij het ontwikkelen van mijn eerste React- en Node-webapp. Op dat moment had ik echter veel uitdagingen om mijn Node API-server draaiende te krijgen en moest ik ook veel wijzigingen aanbrengen in mijn React-app. Daarom raad ik aan om in een vroeg stadium een ​​versie online te zetten, zodat je aanpassingen kunt maken voordat je te veel code schrijft.

== Een shared hosting-service gebruiken ==

De gedeelde hostingservers van Namecheap gebruiken cPanel als de configuratiescherminterface om de Apache-server te beheren. Deze instructies zouden ook iedereen moeten helpen die een gedeelde hostingservice met cPanel gebruikt, zoals A2 Hosting en GoDaddy.

Ik heb ook mijn Namecheap-server ingesteld met een SSL-certificaat en cPanel leidt standaard al het HTTP-verkeer om naar HTTPS. Dus al het verkeer naar mijn server is veilig.

U zult veel handleidingen vinden waarin u wordt uitgelegd hoe u een Node-app kunt hosten op een VPS-hostingservice (Virtual Private Server), zoals DigitalOcean. Als je helemaal opnieuw begint, zal hosting met behulp van een dergelijke service je meer controle geven. Maar het is meestal duurder dan shared hosting. En in mijn geval had ik al betaald voor een gedeelde hostingservice van Namecheap.

Enkele voordelen van het gebruik van cPanel en shared hosting:

- Beheerd met een eenvoudige webbeheerconsole

- Eenvoudig te configureren

- Goedkoop, vooral als u al een site / domein host

- Kan eenvoudig dynamische websites opzetten met behulp van andere technologieën zoals PHP, enz., als u verschillende technologieën verkent

Enkele nadelen:

- Minder controle omdat u geen toegang heeft tot het onderliggende besturingssysteem

- Niet schaalbaar
== Waar gaat alles heen? ==

Eerst moet u een map maken voor alle bronbestanden voor uw Node-apps. Ik heb een map gemaakt met de naam âÃÂÃÂnodejsâÃÂàin de map /home/username en in deze map maak ik vervolgens een submap voor elke app. Upload nu al uw bronbestanden naar deze submap. Zorg ervoor dat u ook het bestand package.json opneemt. U uploadt de map âÃÂÃÂnode_modulesâÃÂà niet, want die wordt gemaakt met de pakketbeheerder later.

Onthoud dat we alleen de Node API-server hosten in ons voorbeeld van de webapp-architectuur. We zullen de React-app niet hosten met Node (meer over dit onderwerp in het volgende artikel).

httpsdavenewman.tech/wp-content/uploads/2020/06/Diagram-5_1.jpg Mapindeling toont de Node-bronbestanden onder de map /home/username/nodejs/mynodeapi en er is een .htaccess-bestand in de map /home/username/public_html/myapi

== Het probleem âÃÂàNode-app heeft geen toegang tot de poorten ==

De grootste uitdaging was om mijn Node API-app aan de praat te krijgen. Het probleem was dat de voorbeeldcode in de ondersteuningsdocumentatie van Namecheap gewoon niet werkte! Het probeert een httpserver te maken om te luisteren op poort 80 en een http **s**server op poort 443. Ik kreeg echter altijd een EACCESS-foutmelding waarin stond dat ik geen toestemming had om die poorten te gebruiken.

== De oplossing âÃÂàNode heeft geen toegang tot de poort nodig! ==

Uiteindelijk vond ik de oplossing door een opmerking van gebruiker SibProgrammer te lezen in een thread over Plesk, een ander hostingcontrolepaneel. cPanel gebruikt de Phusion Passenger-applicatieserver om Node-apps te hosten, net als Plesk. Samengevat:

Wanneer u een verzoek vanuit uw browser verzendt, gaat het naar de Apache-server, vervolgens naar Phusion Passenger en vervolgens naar uw Node-app. Uw Node-app hoeft de poort niet te bezitten, aangezien deze verder stroomopwaarts wordt afgehandeld door de applicatieservers Apache en Phusion Passenger.

Dit vereenvoudigt de code voor het maken van de httpserver in uw www.js (of app.js) bestand:

 * www.js * Testen van het maken van de http-server voor Namecheap. * Dave */ const http = vereisen('http http.createServer(function(request, response) { response.writeHead(200, {'Content-Type': 'text/html response.endh1>Hallo wereldh1 listen(process.env .PORT); console.log('App is actief

Een paar dingen om op te merken:
- Luister op process.env.PORT (in plaats van handmatig 80 of 443 in te stellen). Bij het testen merkte ik dat process.env.PORT ongedefinieerd is! Maar interessant genoeg doet dat er in dit geval niet toe.

- Gebruik een http-server, zelfs als u SSL hebt ingesteld. cPanel heeft Apache geconfigureerd om al het HTTP-verkeer om te leiden naar HTTPS en bijgevolg te reageren op alle verzoeken via HTTPS. U hoeft uw Node-app niet handmatig te configureren om een ​​https-server in te stellen en uw SSL-certificaten in te lezen.

== Laatste stappen voor Node API-server ==

Nu zou het relatief eenvoudige proces moeten zijn om de instructies te volgen om uw node-app in te stellen.

httpsdavenewman.tech/wp-content/uploads/2020/06/Diagram-5_2.jpg Screenshot van cPanelâÃÂÃÂs Node.js configuratiepagina

- Kies de juiste versie van Node.js en toepassingsmodus (productie wordt aanbevolen).

- De âÃÂÃÂApplicatie rootâÃÂàzal de map zijn waar je je bronbestanden eerder hebt geüpload nodejs/mynodeapiâÃÂàin het bovenstaande voorbeeld).

- De âÃÂÃÂApplicatie-URLâÃÂàis de URL die wordt gebruikt om toegang te krijgen tot uw API in het voorbeeld). De naam die u in dit vak opgeeft, wordt gebruikt om een ​​submap te maken in uw map /home/username/public_html. Het hoeft niet dezelfde naam te hebben als de map âÃÂÃÂApplicatiehoofdmap (maar zal vaak zijn).

- Het opstartbestand van de toepassing wordt www.js of app.js, afhankelijk van hoe u uw Node-app hebt gemaakt.

- Het is aan jou hoe je het passagierslogbestand wilt configureren.

- Zodra je de app hebt gemaakt, zie je de knop om NPM Install uit te voeren. ¢. Voer dit uit en het zal de map âÃÂÃÂnode_modulesâÃÂàmaken met alle afhankelijke modules die uw app nodig heeft.

Zodra u uw Node-app hebt ingesteld en gestart, wordt de submap in uw map /home/public_html gemaakt. U moet nu naar die map gaan en het .htaccess-bestand bewerken en de volgende regel toevoegen:

RewriteEngine uit

Dit voorkomt dat de Apache-server verzoeken herschrijft (of omleidt) die intact naar uw API-server moeten gaan.

En dat is het! Nu zou uw Node API-app actief moeten zijn en reageren op uw API-oproepen.

== Dus wat is het volgende? ==
Nu we de Node API-server hebben opgezet, kunnen we onze React-frontend in onze ontwikkelomgeving wijzigen om naar deze API-server te verwijzen. Of we kunnen Postman gebruiken om onze API-aanroepen te testen.

In het volgende artikel zullen we kijken naar het hosten van de React-app op Namecheap en cPanel.