Sommario:
- Passaggio 1: imposta HDrive17 sulla tua rete locale
- Passaggio 2: applicazione del programma
- Passaggio 3: Script della pagina web
- Passaggio 4: archiviare la pagina Web direttamente nell'HDrive
- Passaggio 5: accesso all'app
Video: Controlla semplicemente il motore con il cellulare: 5 passaggi
2024 Autore: John Day | [email protected]. Ultima modifica: 2024-01-30 10:02
Questo How-To mostra come controllare un Servo IoT intelligente "HDrive17" dal tuo telefono cellulare semplicemente usando HTML e JavaScript. La pagina Web che include questo script è memorizzata sul motore stesso e può essere collegata a una WebApp sul tuo telefono cellulare.
Passaggio 1: imposta HDrive17 sulla tua rete locale
Collega l'HDrive17 (puoi ottenerli da www.henschel-robotics.ch) alla tua rete locale collegando il cavo Ethernet dal motore al tuo router WiFi. Assicurati di aver configurato prima un indirizzo IP valido sull'HDrive per la tua rete. L'intera applicazione mostrata nel video è tutta in un file HTML sul mio computer locale. Per prima cosa puoi testare questo sito web nel tuo browser locale e controllare l'HDrive dal tuo PC.
Se vuoi usare il tuo cellulare per controllare l'HDrive devi pubblicare questo sito web locale sulla tua rete WiFi. Quindi apri semplicemente questo sito Web, servito dal tuo PC, sul tuo cellulare. Per condividere un sito del genere nella tua rete potresti utilizzare WebMatrix Tool o IIS di Microsoft, tieni a mente di fare alcune configurazioni di netsh e firewall che il tuo cellulare ha accesso alla pagina.
È anche possibile memorizzare la pagina web direttamente sul motore stesso, quindi nessun PC è più obbligatorio.
Passaggio 2: applicazione del programma
Corpo della pagina web:
Stiamo usando lo script roundslider per visualizzare il simpatico indicatore, quindi dobbiamo aggiungere l'elemento slider nel corpo del documento HTML.
Passaggio 3: Script della pagina web
Il codice seguente sta inviando la nuova posizione di destinazione all'HDrive. Inizia con l'inclusione dello script JQuery e RoundSlider. Il roundslider sta attivando un evento di trascinamento che sta chiamando la funzione "sendDataToHdrive". Questa funzione invia quindi un nuovo comando di azionamento al motore.
per favore dai un'occhiata a questa riga:
var blob = new Blob(['
Invia un comando di azionamento all'HDrive con la posizione di destinazione, la max. velocità di 2000 RPM, tha max. corrente di 2A in modalità 129 (controllo di posizione). puoi scaricare l'intero progetto qui: Slider_demo.rar
Passaggio 4: archiviare la pagina Web direttamente nell'HDrive
Per ospitare l'applicazione web sul tuo drive dobbiamo caricare i file sul motore. Il motore è in grado di caricare 4 file, 2 HTML e 2 file Script (.js). Ogni file viene rinominato dopo il caricamento. Il primo file HTML viene rinominato in app1.html, quindi app2.html i file di script vengono rinominati in s1.js e s2.js. Pertanto dobbiamo modificare i collegamenti ai file nel nostro file HTML. Il JQuery… diventa "s2.js". Inoltre ho copiato il css roundslider nel file HTML.
Per prima cosa accedi alla Web GUI dal tuo HDrive e accedi alla sezione "App"
Passaggio 5: accesso all'app
Dopo aver caricato questi file puoi accedere alla pagina all'indirizzo https://192.168.1.102/app1.html da qualsiasi dispositivo nella stessa rete, il tuo PC non è più obbligatorio, i file sono ospitati direttamente dall'HDrive.
Scarica tutti i file qui.
Consigliato:
Controlla il layout del tuo modello di treno con il tuo cellulare!: 11 passaggi (con immagini)
Controlla il layout del tuo modello di treno con il tuo telefono cellulare!: Il controllo di un layout di modello di treno con un acceleratore cablato e controller di affluenza potrebbe essere un buon inizio per i principianti, ma pongono un problema di non portabilità. Inoltre, i controller wireless disponibili sul mercato possono controllare solo alcune locomotive
Controlla il tuo computer con un motore passo-passo!: 9 passaggi (con immagini)
Controlla il tuo computer con un motore passo-passo!: In uno dei miei precedenti Instructables, ti ho mostrato come puoi usare un motore passo-passo come encoder rotativo. In questo Instructable, impariamo come possiamo usarlo per controllare il nostro computer. Quindi, senza ulteriori indugi, iniziamo
Motore passo-passo controllato da motore passo-passo - Motore passo-passo come encoder rotativo: 11 passaggi (con immagini)
Motore passo-passo controllato da motore passo-passo | Motore passo-passo come encoder rotativo: hai un paio di motori passo-passo in giro e vuoi fare qualcosa? In questo Instructable, utilizziamo un motore passo-passo come encoder rotativo per controllare la posizione di un altro motore passo-passo utilizzando un microcontrollore Arduino. Quindi, senza ulteriori indugi, ge
Alimenta un telefono cellulare/cellulare con batteria esterna o rete.: 3 passaggi
Alimentare un telefono cellulare/cellulare con batteria esterna o rete.: Introduzione. Questa idea funzionerà solo con telefoni o tablet se la batteria è rimovibile. Ovviamente è importante osservare la polarità. Si prega di fare attenzione a non danneggiare il dispositivo per negligenza. Se non sei sicuro della tua capacità di farlo, il
CalClock: visualizza semplicemente il tuo programma: 4 passaggi (con immagini)
CalClock: vedi semplicemente il tuo programma: la peggiore perdita di concentrazione è essere interrotta solo per imparare che non c'è bisogno di un'interruzione. Trovo che questo accada spesso in relazione al mio programma. Lavorerò su un problema e ho il sentore di pensare: "C'è s