Stap 2: De Client van de Webserver
De web server-client is het deel dat met de webserver communiceert. Het is ook de interface waarmee we gaan werken. U kunt uitvoeren op de browser van uw computer, of uploaden als een web app.
Het index.html bestand downloaden vanaf hier[bewerken hier]
Ik schreef dit eenvoudige HTML-bestand in de Intel XDK IDE. Het is vergelijkbaar met telefoon kloof, waar u gebruik van HTML5/Javascript om hybrid apps te draaien op de meeste platformen van smartphone app kunt ontwerpen. Maar hier niet ik het opbouwen van een standalone app. Meer info over XDK hier. Ook is er een IOT-smaak, voor degenen onder u willen gebruik maken van Node.JS enz.
U kunt uw favoriete tekst-editor voor het bewerken van de HTML-script. Ik verkies xdi omdat ik een beginner ben en tips geeft bij het schrijven van codes.
OPMERKING
Of u esp verbonden met uw netwerk of als een toegangspunt, moet de web server-client worden uitgevoerd op computer/smartphone verbonden met hetzelfde netwerk als ESP.
De code uitgelegd
We moeten eerst het IP-adres van de webserver naar de invoertekst tijdelijke aanduiding invoegen. Het onderzoektijdvak kan worden verkregen van seriële monitor wanneer esp wordt code uitgevoerd van schets of kunt u het vinden van uw router. Als u esp8266 als toegangspunt uitvoert, is de ip 192.168.4.1. Wanneer ik verbinding maak met mijn thuisnetwerk, is ip van esp 192.168.1.100. Dus moet ik invoeren:
WS://192.168.1.100:81/
of als ik access Start aanwijst, ws://192.168.4.1:81/
de 81 is de poort waarnaar de server naar luistert.
Er zijn twee knoppen: LED knipperen en Reset LED. Blink leidde stuurt "LED" wanneer gedrukt en led stuurt RESET reset". Deze tekenreeksen worden geïnterpreteerd door code we in schets schreven en knippert leidde 13 of reset alle LED pin dienovereenkomstig waarden.
Er zijn 3 schuifregelaars, elk met de minimumwaarde 0 en max 255. Elke schuifregelaar R, G, B respectievelijk stuurt waarden x, y, z die is ontvangen door de webserver esp en draait dan rode, groene of blauwe LED waarde dienovereenkomstig.
Als u de client vanaf een smartphone gebruikt, kunt u ook proberen te waarde van pin wijzigen met behulp van telefoon versnellingsmeter. Dit kan echter niet werken op alle smartphone browsers.
Deze functie ter illustratie van het gebruik van sensoren in smartphones al inbegrepen
In mijn vorige project beschreef ik al het gebruik van GPS om waarde te sturen van smartphone tot hier in het bijzonder
Sensoren
U kunt uw eigen code schrijven om te gebruiken van de sensoren van de smartphone.
Hier heb ik de DeviceOrientationEvent gebruikt. U kunt navigator.geolocation gebruiken voor GPS waarden.
Voor meer info Lees hier https://developer.mozilla.org/en-US/docs/Web/API/D...
De knoppen naast de naam van elke as, wanneer geklikt begint luisteren als u wilt wijzigen in apparaat oriëntatie.
Het keuzerondje ernaast stuurt waarde naar de esp8266.
Webapp
U kunt ook uploaden van de html van de index als een web app en de sjabloon openen vanaf een smartphone verbonden met hetzelfde netwerk als de esp8266.
Hier is een voorbeeld. http://rahul2704.github.io
Voor instructies op hoe te te troep zulks opwaarts, hoofd omhoog hier, zijn zeer eenvoudig