Πώς να φιλοξενήσετε έναν διακομιστή Web Raspberry Pi στο Διαδίκτυο με το ngrok

3
Πώς να φιλοξενήσετε έναν διακομιστή Web Raspberry Pi στο Διαδίκτυο με το ngrok
Raspberry Pi ngrok

Στο Create a Web Server in Node without any Code, χρησιμοποιήσαμε το http-server Μονάδα npm για τη δημιουργία διακομιστή web και την προβολή αρχείων σε χρόνο ρεκόρ. Σήμερα θα μοιραστώ έναν τρόπο με τον οποίο μπορείτε να πάρετε τον διακομιστή web που δημιουργήσατε και να τον κάνετε διαθέσιμο πέρα ​​από το τοπικό σας δίκτυο και στο δημόσιο Διαδίκτυο. Αυτό είναι ωραίο κόλπο, αλλά σας συνιστώ να το χρησιμοποιείτε με προσοχή, καθώς αυτό θα ανοίξει μια τρύπα στο δρομολογητή/το τείχος προστασίας σας όταν κάνετε τον διακομιστή ιστού σας διαθέσιμο στον κόσμο. Ας αρχίσουμε!

Περιεχόμενα άρθρου

Δημιουργήστε απλό διακομιστή ιστού Node.js

Θα ξεκινήσουμε δημιουργώντας έναν απλό διακομιστή ιστού στο Node.js. Ανατρέξτε στην ενότητα Δημιουργία διακομιστή Web στο Node χωρίς κώδικα για μερικές περισσότερες λεπτομέρειες, αλλά εδώ είναι μια επισκόπηση υψηλού επιπέδου των βασικών βημάτων που απαιτούνται για τη δημιουργία και τη φιλοξενία ενός γρήγορου διακομιστή ιστού χρησιμοποιώντας το Node.js. Εναλλακτικά, μπορείτε να δημιουργήσετε έναν διακομιστή ιστού χρησιμοποιώντας NGINX ή άλλο διακομιστή ιστού της επιλογής σας, εάν θέλετε. Θέλουμε να θέσουμε σε λειτουργία έναν διακομιστή ιστού, ώστε να μπορέσουμε να προχωρήσουμε στο επόμενο βήμα και να εξυπηρετήσουμε περιεχόμενο HTTP από το Pi μας στο δημόσιο Διαδίκτυο.

  1. Εγκαταστήστε το Node.js στο Raspberry Pi ακολουθώντας τα βήματα στον Οδηγό για αρχάριους για την εγκατάσταση του Node.js σε ένα Raspberry Pi. Δείτε εδώ για τα συγκεκριμένα βήματα εγκατάστασης του Node.js.

  2. Εγκαταστήστε το http-server πακέτο npm παγκοσμίως, ώστε να είναι διαθέσιμο ως εντολή οπουδήποτε στο RasPi και όχι μόνο στον τρέχοντα κατάλογο:

    $ sudo npm install -g http-server
    
  3. Δημιουργήστε έναν Δημόσιο κατάλογο στη ρίζα του αρχικού καταλόγου σας και μεταβείτε σε αυτόν τον κατάλογο:

    $ mkdir ~/Public && cd ~/Public
    

    Αν προσπαθούμε να βελτιώσουμε το παιχνίδι μας στην αρένα της γραμμής εντολών, θα μπορούσαμε να είχαμε χρησιμοποιήσει και το bash $_ έκφραση που επεκτείνεται στο τελευταίο όρισμα της προηγούμενης εντολής. (Αυτό είναι /Public από το προηγούμενο mkdir εντολή σε αυτό το πλαίσιο.)

    $ mkdir ~/Public && cd $_
    
  4. Δημιουργήστε μια βασική ιστοσελίδα χρησιμοποιώντας ένα πρόγραμμα επεξεργασίας όπως το leafpad ή το nano ή επικολλήστε τα παρακάτω στο τερματικό για να παρακάμψετε το πρόγραμμα επεξεργασίας. Φροντίστε να πατήστε το πλήκτρο Enter μετά την επικόλληση της εντολής.

    $ cat << EOF > index.html
    <html>
    <head>
        <title>Welcome</title>
    </head>
    <body>
        Welcome to my website!
    </body>
    </html>
    EOF
    
  5. Εκκινήστε τον διακομιστή ιστού:

    $ http-server
    Starting up http-server, serving ./
    Available on:
      http://127.0.0.1:8080
      http://192.168.1.5:8080
    Hit CTRL-C to stop the server
    

    Πόσο ωραίο είναι αυτό; Μια απλή εντολή και είμαστε έτοιμοι να λειτουργήσουμε με έναν διακομιστή ιστού και εξυπηρετούμε το νέο μας αρχείο HTML.

  6. Εκκινήστε το πρόγραμμα περιήγησης ιστού που περιλαμβάνεται στο Raspbian και εισαγάγετε την ακόλουθη διεύθυνση URL στη γραμμή διευθύνσεων:

    http://localhost:8080
    

    Δουλεύει! Αυτό το πακέτο διακομιστή http του Node είναι καθαρά ιδιοφυές και είναι εξαιρετικά απλό στη χρήση του.

    Πρόγραμμα περιήγησης ιστού RasPi

Κάντε τον διακομιστή Web RasPi διαθέσιμο στο Διαδίκτυο με το ngrok

Τώρα που έχουμε έναν διακομιστή web που εκτελείται στη θύρα 8080, ας τον κάνουμε διαθέσιμο στο Διαδίκτυο με τη βοήθεια του ngrok, ενός εργαλείου για την έκθεση τοπικών διακομιστών πίσω ΝΑΤ και τείχη προστασίας στο δημόσιο διαδίκτυο μέσω ασφαλών τούνελ.

Ενώ μπορούσαμε να κατεβάσουμε το δυαδικό αρχείο grok από το ιστοσελίδα grokθα χρησιμοποιήσουμε ένα πακέτο Node.js npm για να απλοποιήσουμε τη διαδικασία εγκατάστασης.

  1. Ανοίξτε ένα νέο παράθυρο τερματικού, καθώς το προηγούμενο παράθυρο τερματικού εκτελεί ήδη τον διακομιστή web μας.

  2. Εγκαταστήστε το ngrok πακέτο ως ένα παγκοσμίως διαθέσιμο εκτελέσιμο αρχείο. Πρέπει να εγκαταστήσουμε με το --unsafe-perm επισημάνετε για να επιτρέψετε στο υποκείμενο πακέτο ngrok να εκτελεί το σενάριο postinstall του ως root για λήψη και αποθήκευση του δυαδικού ngrok στον καθολικό φάκελο node_modules.

    $ sudo npm install --unsafe-perm -g ngrok
    
  3. Εκκινήστε το ngrok για τη διοχέτευση της κυκλοφορίας http από τον έξω κόσμο στον διακομιστή ιστού μας που εκτελείται στη θύρα localhost 8080 του RasPi μας.

    $ ngrok http 8080
    ngrok by @inconshreveable                                                     (Ctrl+C to quit)
    
    Session Status                online
    Account                       thisDaveJ (Plan: Free)
    Version                       2.2.8
    Region                        United States (us)
    Web Interface                 http://127.0.0.1:4040
    Forwarding                    http://3c0a6e01.ngrok.io -> localhost:8080
    Forwarding                    https://3c0a6e01.ngrok.io -> localhost:8080
    
    Connections                   ttl     opn     rt1     rt5     p50     p90
                                  0       0       0.00    0.00    0.00    0.00
    

    Είμαστε σε λειτουργία! Τώρα μπορείτε να χρησιμοποιήσετε τη διεύθυνση „Προώθηση“ που αναφέρεται για να πλοηγηθείτε στον διακομιστή ιστού RasPi που εκτελείται στη θύρα localhost 8080 από το δημόσιο Διαδίκτυο.

  4. Για δοκιμή, ξεκινήστε ένα πρόγραμμα περιήγησης ιστού στο τηλέφωνό σας (υποθέτοντας ότι δεν είναι συνδεδεμένο στο τοπικό σας δίκτυο Wi-Fi) για να αποδείξετε ότι μπορείτε να αποκτήσετε πρόσβαση στον διακομιστή ιστού RasPi. Με βάση το περιβάλλον μου εδώ, θα εισαγάγω μία από τις ακόλουθες διευθύνσεις URL στη γραμμή διευθύνσεων:

    http://3c0a6e01.ngrok.io
    
    https://3c0a6e01.ngrok.io  
    

    Μπαμ! ο ngrok Το εργαλείο μας έδωσε τη δυνατότητα να κάνουμε το RasPi που κρύβεται πίσω από το τείχος προστασίας NAT διαθέσιμο στο δημόσιο Διαδίκτυο.

    Σημείωση
    Ως συμβουλή μπόνους, το ngrok παρέχει μια διεπαφή ιστού που μπορείτε να εκκινήσετε στη διεύθυνση http://127.0.0.1:4040 μέσα από το RasPi σας για να επιθεωρήσετε τις κεφαλίδες αιτημάτων και άλλες πτυχές της κυκλοφορίας που εξυπηρετούνται μέσω της σήραγγας ngrok.

  5. Εισαγω Ctrl+C για να τερματίσετε τη σύνδεση της σήραγγας ngrok.

Εγκαταστήστε το ngrok-notify για να μπορέσουμε να στείλουμε τη διεύθυνση URL της σήραγγας μέσω email

Θα θέλαμε να είμαστε σε θέση να κάνουμε επανεκκίνηση του RasPi και να εκκινήσουμε αυτόματα τον διακομιστή web και τη σήραγγα ngrok, ώστε να μπορούμε να επισκεφτούμε τον διακομιστή ιστού μας μέσω του Διαδικτύου. Το πρόβλημα είναι ότι αυτή τη στιγμή πρέπει να εκκινήσουμε το ngrok με μη αυτόματο τρόπο και να διαβάσουμε τη διεύθυνση URL „προώθησης“ του ngrok tunnel που αλλάζει κάθε φορά που εκκινούμε το ngrok. Πώς θα λύσουμε αυτό το δίλημμα;

Ευτυχώς για εσάς και για μένα, έχω αναπτύξει ένα πακέτο npm που ονομάζεται ngrok-ειδοποιώ για να μας βοηθήσει να ξεπεράσουμε αυτά τα εμπόδια. 😄

  1. Εγκαταστήστε το ngrok-notify πακέτο ως ένα παγκοσμίως διαθέσιμο εκτελέσιμο αρχείο. Για άλλη μια φορά, πρέπει να εγκαταστήσουμε με το --unsafe-perm επισημάνετε για να επιτρέψετε στο υποκείμενο πακέτο ngrok να εκτελεί το σενάριο postinstall του ως root για λήψη και αποθήκευση του δυαδικού ngrok στον καθολικό φάκελο node_modules.

    $ sudo npm install --unsafe-perm -g ngrok-notify
    

    Σημείωση
    Μια εγκατάσταση npm του ngrok-notify θα εγκαταστήσει επίσης το ngrok, επομένως δεν είναι απαραίτητο να εγκαταστήσετε το ngrok ξεχωριστά.

  2. Δημιουργήστε έναν κατάλογο ngrok στη ρίζα του αρχικού καταλόγου σας και μεταβείτε σε αυτόν τον κατάλογο:

    $ mkdir ~/ngrok && cd $_
    
  3. Τροποποιήστε τον λογαριασμό σας στο Gmail (ή δημιουργήστε έναν ξεχωριστό λογαριασμό Gmail για την αποστολή μηνυμάτων) και ρυθμίστε το για λιγότερο ασφαλείς εφαρμογές. Αυτό είναι απαραίτητο ώστε η υποκείμενη λειτουργική μονάδα npm που χρησιμοποιείται από το ngrok-notify για την αποστολή email (Nodemailer) να μπορεί να στείλει email χρησιμοποιώντας το Gmail. Δείτε επίσης τις σημειώσεις του Nodemailer για χρησιμοποιώντας το Gmail.

  4. Αντιγράψτε τα αρχεία διαμόρφωσης εκκίνησης σε αυτόν τον κατάλογο:

    $ ngrok-notify init
    Added file: .env
    Added file: config.yml
    
    Please update config.yml and .env with your info so you can send an email through GMail.
    

    Όπως φαίνεται στην έξοδο εντολών, το init Η εντολή προσθέτει μερικά αρχεία διαμόρφωσης που χρησιμοποιούνται από ngrok-notify που μπορούμε να τροποποιήσουμε για τις ανάγκες μας.

  5. Επεξεργαστείτε το config.yml αρχείο και προσθέστε παραλήπτες email και το όνομα χρήστη σας στο Gmail. (Υποστηρίζουμε μόνο το Gmail και όχι άλλους παρόχους email, καθώς το Gmail είναι πανταχού παρόν και είναι σχετικά εύκολο στη διαμόρφωση.) Οι γραμμές που ξεκινούν με „# αντιμετωπίζονται ως σχόλια και αγνοούνται. Ακολουθεί το αρχείο που δημιουργείται από προεπιλογή:

    ngrok:
      # Optional parameters
      #subdomain: alex # reserved tunnel name https://alex.ngrok.io
      #region: us # one of ngrok regions (us, eu, au, ap), defaults to us
    
    email:
      recipients:
      - [email protected]
      #- [email protected]
    
      subject: ngrok URL for {proto} on port {port}
    
      message: "The ngrok URL for {proto} on port {port} is: {url}"
    
    # Gmail credentials
      user: [email protected]
      # This password is used if you don't set one in the .env file. The .env location is recommended.
      password: mySecretPasswordHere
    

    Ως δευτερεύουσα σημείωση, λάβετε υπόψη ότι μπορούμε επίσης να χρησιμοποιήσουμε email για την αποστολή μηνυμάτων SMS (κειμένου). Για παράδειγμα, για να στείλετε ένα μήνυμα κειμένου στο 610-555-1234, μπορείτε απλώς να στείλετε ένα μήνυμα ηλεκτρονικού ταχυδρομείου στο [email protected], με την προϋπόθεση ότι ο αριθμός κινητού τηλεφώνου είναι συνδρομητής της T-Mobile. Βλέπω αυτή η σελίδα για μια λίστα με διευθύνσεις email SMS που χρησιμοποιούνται από πολλούς παρόχους.

  6. Επεξεργαστείτε το .env αρχείο και πληκτρολογήστε τον κωδικό πρόσβασής σας στο Gmail:

    GMAIL_PASSWORD=myRealPasswordHere
    
    ### Optional sections below ###
    
    ##auth = "user:pwd" # http basic authentication for tunnel
    #NGROK_AUTH=
    
    ## authtoken from ngrok.com
    #NGROK_AUTHTOKEN=
    
  7. Εκτόξευση ngrok-notify για να δημιουργήσετε μια σήραγγα ngrok http για να εκθέσετε τη θύρα 8080 που εκτελείται στον τοπικό κεντρικό υπολογιστή στον κόσμο. (Βεβαιωθείτε ότι εκκινείτε αυτήν την εντολή από τον κατάλογο που περιέχει το ngrok-notify αρχεία διαμόρφωσης που μόλις τροποποιήσατε παραπάνω.)

    $ ngrok-notify http 8080
    

    Θα δημιουργηθεί μια σήραγγα ngrok στο Διαδίκτυο και η διεύθυνση URL ngrok θα εκτυπωθεί στην κονσόλα. Επιπλέον, το ngrok-notify θα σας στείλει ένα email με τη διεύθυνση URL ngrok. Πολύ φοβερό!

    Εδώ είναι το email που έλαβα: ngrok-notify email

  8. Αναθεωρήστε το ngrok-notify βοηθητικές πληροφορίες για την κατανόηση των πρόσθετων διαθέσιμων δυνατοτήτων:

    $ ngrok-notify --help
    
    Create ngrok tunnel to expose localhost to the web and notify with ngrok URL
    
    Usage: ngrok-notify PROTO PORT [-n]
           ngrok-notify init [-f]
    
    Positional arguments:
      PROTO           Protocol to use in the ngrok tunnel {http,tcp,tls}
      PORT            Port number of the localhost service to expose (e.g. 8080)
      init            Copy starter config files into directory for customizing
    Optional arguments:
      -n, --noemail   Do not send an email providing the URL of the ngrok tunnel
      -h, --help      Show help
      -v, --version   Display version information
      -f, --force     Overwrite config files in directory if they exist.
    Notes
      Email messages are sent using the settings in the config.yml file and the
      Gmail password stored in the .env file.
    
    Examples
      Create ngrok tunnel to expose localhost web server running on port 8080.
      Email is sent with the ngrok URL since "--noemail" is not included.
      $ ngrok-notify http 8080
    
      Create ngrok tunnel to expose localhost web server running on port 8080,
      but don't send email.
      $ ngrok-notify http 8080 -n
    

Διαμορφώστε τον διακομιστή web και τη σήραγγα ngrok για αυτόματη εκκίνηση χρησιμοποιώντας το pm2

Είμαστε στην τελική ευθεία! Σε αυτήν την ενότητα, θα χρησιμοποιήσουμε το φοβερό pm2 εργαλείο για να διατηρήσουμε τον διακομιστή ιστού και τη σήραγγα ngrok ζωντανά για πάντα. Κάθε φορά που επανεκκινούμε το RasPi, το pm2 θα εκκινεί και τον διακομιστή web και τη σήραγγα ngrok χρησιμοποιώντας ngrok-notify και θα λαμβάνουμε ένα email με τη νέα διεύθυνση URL της σήραγγας ngrok κάθε φορά που αλλάζει. Το PM2 έχει πολλά άλλα εκπληκτικά χαρακτηριστικά, συμπεριλαμβανομένης της εξισορρόπησης φορτίου, αλλά θα παραμείνουμε εστιασμένοι στην περίπτωση άμεσης χρήσης μας σε αυτό το σεμινάριο.

  1. Εγκαταστήστε την πιο πρόσφατη σταθερή έκδοση του pm2 ως παγκόσμιο εκτελέσιμο:

    $ sudo npm install -g [email protected]
    
  2. Πλοηγηθείτε στον κατάλογο που περιέχει το περιεχόμενό μας στον ιστό που θέλουμε να προβάλουμε στο Διαδίκτυο:

    $ cd ~/Public
    
  3. Εάν εξακολουθείτε να τρέχετε http-server σε άλλο τερματικό, μεταβείτε σε αυτό το παράθυρο τερματικού και καλέστε Ctrl+C τώρα για να σκοτώσει τη διαδικασία.

  4. Αρχή http-server με pm2:

    $ pm2 start http-server
    

    Εκτελώντας την παραπάνω εντολή θα ξεκινήσει το http-server και προσθέστε τη διαδικασία στη λίστα διαδικασιών του pm2 για διαχείριση και διατήρηση για πάντα ζωντανή.

  5. Μεταβείτε στον κατάλογο που περιέχει το ngrok-notify αρχεία ρυθμίσεων:

    $ cd ~/ngrok
    
  6. Αρχή ngrok-notify με pm2:

    $ pm2 start ngrok-notify -- http 8080
    

    Λάβετε υπόψη ότι πρέπει να συμπεριλάβουμε το „–“ για να μπορέσουμε να μεταβιβάσουμε επιπλέον ορίσματα pm2.

  7. Καταχωρίστε τις τρέχουσες διαδικασίες που διαχειρίζονται pm2. Θα πρέπει να δείτε μια διαδικασία για το http-server και ngrok-notify.

    $ pm2 list
    ┌──────────────┬────┬─────────┬──────┬──────┬────────┬─────────┬────────┬──────┬───────────┬──────┬──────────┐
    │ App name     │ id │ version │ mode │ pid  │ status │ restart │ uptime │ cpu  │ mem       │ user │ watching │
    ├──────────────┼────┼─────────┼──────┼──────┼────────┼─────────┼────────┼──────┼───────────┼──────┼──────────┤
    │ http-server  │ 0  │ N/A     │ fork │ 2002 │ online │ 0       │ 26s    │ 0.1% │ 33.9 MB   │ pi   │ disabled │
    │ ngrok-notify │ 1  │ N/A     │ fork │ 2008 │ online │ 0       │ 26s    │ 1.6% │ 37.7 MB   │ pi   │ disabled │
    └──────────────┴────┴─────────┴──────┴──────┴────────┴─────────┴────────┴──────┴───────────┴──────┴──────────┘
    Use `pm2 show <id|name>` to get more details about an app
    
  8. Εάν κάνατε λάθος και πρέπει να σκοτώσετε και να δημιουργήσετε ξανά μια διαδικασία, χρησιμοποιήστε το pm2 delete εντολή. Για παράδειγμα, για να σκοτώσετε την πρώτη διαδικασία:

    $ pm2 delete 0
    

    … και μετά εκδώστε άλλο pm2 start εντολή.

  9. Δημιουργήστε ένα σενάριο εκκίνησης συστήματος, ώστε το pm2 να ξεκινήσει κατά την επανεκκίνηση του συστήματος.

    $ pm2 startup
    [PM2] Init System found: systemd
    [PM2] To setup the Startup Script, copy/paste the following command:
    sudo env PATH=$PATH:/usr/bin /usr/lib/node_modules/pm2/bin/pm2 startup systemd -u pi --hp /home/pi
    

    Σύμφωνα με τις οδηγίες, αντιγράψτε και επικολλήστε την εντολή που δόθηκε για να δημιουργήσετε ένα σενάριο εκκίνησης. Οι οδηγίες για το σύστημά μου φαίνονται παραπάνω ως παράδειγμα.

    Παρακαλούμε να σημειώσετε ότι pm2 startup δημιουργεί απλώς ένα σενάριο εκκίνησης και χρειάζεται μόνο μια κλήση. Η λίστα των εφαρμογών σε pm2 list μπορεί να τροποποιηθεί ανά πάσα στιγμή χρησιμοποιώντας pm2 delete για την αφαίρεση διεργασιών και pm2 start για να προσθέσετε διαδικασίες. Οι διαδικασίες που αναφέρονται στο pm2 list θα γίνει επανεκκίνηση κάθε φορά που κάνετε επανεκκίνηση του υπολογιστή σας ή εάν πεθάνουν απροσδόκητα ενώ το μηχάνημά σας είναι σε λειτουργία.

  10. Επανεκκινήστε το μηχάνημά σας.

    Το PM2 θα πρέπει να ξεκινά αυτόματα και τα δύο http-server και ngrok-notify διαδικασίες. Θα πρέπει επίσης να λάβετε ένα email με τη νέα διεύθυνση URL της σήραγγας ngrok.

  11. Εάν δεν θέλετε πλέον το PM2 να ξεκινά αυτόματα κατά την εκκίνηση του συστήματος, εκτελέστε την ακόλουθη εντολή:

    $ pm2 unstartup
    

    Αντιγράψτε και επικολλήστε την εντολή που παρέχεται για να αποτρέψετε την αυτόματη εκκίνηση του pm2 στις επόμενες εκκινήσεις του συστήματος.

Το PM2 είναι ένα καταπληκτικό εργαλείο! Μπορείτε να επισκεφθείτε το Αρχική σελίδα PM2 να μάθω περισσότερα. Επίσης, έχουν αυτό εύχρηστο σεντόνι επισημαίνοντας πρόσθετη λειτουργικότητα που είναι διαθέσιμη.

συμπέρασμα

Καταφέραμε πολλά σε σύντομο χρονικό διάστημα! Για έλεγχο, εμείς:

  • Δημιουργήσαμε έναν διακομιστή ιστού στο Raspberry Pi χρησιμοποιώντας τον Κόμβο http-server εκτελέσιμο.
  • Φιλοξενήσαμε αυτόν τον διακομιστή ιστού στο Διαδίκτυο για να τον επισκεφτούν άτομα εκτός του NAT/τείχους προστασίας χρησιμοποιώντας το ngrok.
  • Προστέθηκε η δυνατότητα να λαμβάνετε ένα email που περιέχει τη διεύθυνση URL της σήραγγας ngrok χρησιμοποιώντας ngrok-ειδοποιώ.
  • Διαμόρφωσε το Raspberry Pi για αυτόματη εκκίνηση του διακομιστή ιστού, του ngrok tunnel και αποστολής email χρησιμοποιώντας pm2.

Ελπίζω να μάθατε νέα πράγματα σήμερα και να διασκεδάσατε επίσης!

Ακολουθήστε το @thisDaveJ (Dave Johnson) στο Twitter για να μείνετε ενημερωμένοι με τα πιο πρόσφατα σεμινάρια και άρθρα τεχνολογίας.

Πρόσθετα άρθρα

Οδηγός χρήσης του Redis με το Node.js
Πώς να ρυθμίσετε ένα τείχος προστασίας για το Redis χρησιμοποιώντας το ufw
Οδηγός για την εγκατάσταση του Node.js σε ένα Raspberry Pi
Πώς να μετρήσετε μοναδικά στοιχεία σε συστοιχίες JavaScript

Τελευταία ενημέρωση 29 Ιανουαρίου 2019

Schreibe einen Kommentar