WebRTC Creeper Drone - webbläsare kontrolleras RC bil (2 / 19 steg)

Steg 2: Arkitektur och Design



Alla 3 enheter måste vara ansluten till samma WiFi-nätverk. Diagrammet ovan visar Android telefonen som används som en WiFi Hotspot, med de andra 2 enheter ansluter till den, men andra konfigurationer är möjliga.

En uppenbar förbättring till denna design skulle vara att möjliggöra kommunikation med Android-enhet via mobil anslutning i stället för WiFi, vilket utökar det surret utbud till någonstans med LTE täckning. Detta skulle sannolikt kräva ett tillägg av en vända server i designen.

Creeper Drone styrs från valfri WiFi ansluten enhet som kan köra Chrome eller en annan webbläsare för WebRTC.

En WebSocket används som en signalering kanal mellan webbläsaren och Android-telefon.
En enkel TCP/IP uttag används för att kommunicera med Raspberry Pi. Raspberry Pi använder GPIO-porten på kortet för att kommunicera med styrelsen kontrollen som hanterar maskinvarukraven för att köra servon och motorer.

Kommunikation med drone börjar genom att öppna webbläsaren och ansluta till http://[android-ip-address]:8000/. Detta orsakar den inbäddade webbservern (Netty) kör inne i Android App att tjäna en HTML-fil och några JavaScript-koden krävs för att hantera den webbläsare funktionaliteten. Detta inkluderar behandling av tangentbordshändelser att skicka kommandon för styrning av Drone, visningen av Creeper, WebRTC signalering genom WebSocket, visning av Media Stream från drone och hantering av Media dataströmmen drone.

När WebSocket handslag slutförd, WebRTC stacken på Android har initierats och en SDP erbjudande skickas via WebSocket till webbläsaren. Klientkoden körs i webbläsaren tar emot erbjudandet, initierar egna WebRTC stack och skicka en SDP svar. På denna punkt Android och webbläsaren utbyta ICE kandidater och upprätta en WebRTC session.

När en framgångsrik WebRTC session upprättas, du kan nu se och höra allt genom Creeper Drone. Med hjälp av tangentbordet kan användaren nu styra kameraposition och driva drone.

En kontroll kommando skickas genom WebSocket, erkänns som sådan av den CreeperAndroid app, och vidarebefordras till Raspberry Pi via en nätverksuttaget. RPi tar emot kommandot och skickar det till rätt PWM Generator modul (servon kräver en olika kontrollprogram från DC-motorer). Den valda PWM modulen använder pigpio biblioteket för att skicka PWM signaler via GPIO-porten. När det valda kommandot utfördes, ett statusmeddelande för lämpliga servomotor lämnas tillbaka genom nätverksuttaget, genom WebSocket och in i webbläsaren sidan användaren använder för att styra drone.

Se Steg
Relaterade Ämnen

ESP8266-1 aktiverade RC vände Wifi bil med webbläsare kontrolleras riktning.

Projektet är tänkt för att visa förmåga av grundläggande IoT enheter. Syftet var att kontrollera rörelse i en bil via webbläsare. Jag hade några alternativ för att uppnå detta - 1) över webben, direkt styra motorn på bilen av en WiFi-modul, 2) Konfig...

Webbläsare kontrolleras Bot

Vi skulle vilja införa i BrowserBot: ett projekt på Dexter industrier att förvandla Raspberry Pi till en robot."browserBot" är en webbläsare controller robot med BrickPi. Med detta projekt visar vi hur man styr en BrickPi robot direkt från webbl...

Skapa ett Program i Visual Basic: webbläsare

detta Instructable förklarar processen att skapa en enkel webbapplikation webbläsare i VB.NETDen är utformad som en uppföljning till mitt första VB.NET Instructable: skapa din första Program i Visual Basic. Det rekommenderas att du läst igenom det in...

Rotera riktiga objekt i din webbläsare - det enkla sättet!

Statiska bilder kan bara få oss så långt i att visa hur ett objekt ser ut; ibland snurrar det i 3D är det bästa sättet att visa den. Många online-handlare sy ihop 3D-bilder så att du kan "snurra" produkten runt i din webbläsare.Men vad händer om...

Säkra din webbläsare

Detta är de inställningar jag använder för att säkra min webbläsare.Min bank nyligen gjort några ändringar, och nu med dessa inställningar kan inte använda deras internet banking webbplats. Jag var tvungen att skapa ett separat konto på en annan dato...

(FÖRÅLDRAD) Hur du Flash Windows IoT Core på Raspberry Pi 2 och tillgång till det via webbläsare

"Internet of Things (IoT) sammanför devises, sensorer, moln, data och din fantasi" - Microsoft.Idag ska jag visa dig hur du flash Windows IoT Core Raspberry Pi 2 också hur få tillgång till det via webbläsaren.Steg 1: krav Du kommer du behöver:1...

Vad varje Chrome webbläsare behöver

Detta är vissa tillägg och program som varje chrome användarna behöver .Steg 1: AdBlockNu om du inte vet om ad-block, vet jag inte var fan du har varit. Som namnet antyder, det helt enkelt tar bort annonser från en webbsida, och om du någonsin behöve...

Blinka en LED från en webbläsare med hjälp av visuell programmering

Lär dig att blinka och leds från en webbläsare. Du behöver:* en Raspberry Pi* en skärbräda* hoppare ledningar* LED...

C# webbläsare med Twist!

Detta är en webbläsare som körs på skrivbordet och är en webbläsare som kommer att ersätta Google Chrome och Firefox!(det mer än sannolikt brukar men det kommer att bli din egen och du kan berätta för människor du gjorde det)Vridningen är valfritt om...

Anpassade webbläsare Startsida

Skapa en anpassad web browser Startsida lägger en massa bekvämlighet till en spindelväv beter session. Detta Instructable visar hur du installerar en anpassad startsida som jag gjort och går över några lätt tweaks som kan du anpassa det ytterligare....

Redigera en webbsida på Internet från din webbläsare

här är en rolig Javascript hacka som låter dig redigera en webbsida på internet direkt från din webbläsare. Det gör inte permanenta ändringar på sidan. Så detta är inte riktiga "hacka". Men det är fortfarande ett bra sätt att lura vänner.Det är...

Hur man gör en ätligt webbläsare Cookie

detta är världens första ätbara webbläsare cookie. Gör en av dessa för din favorit datornörd. De vet exakt vad de ska göra med den. Bara skriva ut nedanstående mall och har din lokala livsmedelsbutik skriver ut det på en cookie. De skriver ut det på...

Hur man skapar en webbläsare i C# Visual Studio

Hej, i denna tutorial ska jag visa dig "Hur man skapar en webbläsare i C# Visual Studio"Här använder jag visual studio 2010 och windows 8 pro 64-bitars.Källkoden är tillgänglig för nedladdning.Steg 1: Öppna VS och skapa ett nytt projektSteg 2: V...

Göra en webbläsare i visual basic

Im ska lära dig hur man gör en webbläsare i Visual Basic 2005.Steg 1: Start Öppna Visual Basic och börja ett nytt Windows-program.Steg 2: Lägga till verktyg Lägga till a:TextrutaWebbläsare5 knappari den ordningen.Steg 3: Ordna bitar rätt Ordna dem so...

Hur öppna mp3, mp4, ppt, doc och pdf-filer med en webbläsare

Den webbläsare du använder kan göra mycket mer än bara öppna webbplatser. Google Chrome och dess derivat faktiskt stöder en mängd olika mediaformat och office-dokument. Några av dem stöds som standard medan andra kräver vissa ytterligare installation...

Köra Android apps i en webbläsare

Tack vare oberoende utvecklare, kan någon port deras favorit Android apps till en dator. Allt du behöver är ett enkelt program som låter dig starta Android apps i en webbläsare.Steg 1: preparat För att lansera Android apps på din dator, behöver du fl...

Att göra en webbläsare i Visual Studio

Detta instructable visar dig hur man gör en webbläsare i Visual Studio 2013.Steg 1: MallenÖppna ett nytt projekt i Visual Studio och välj "Windows Forms-program".Steg 2: Att få vad du behöverNästa, gå till verktygslådan och få en textbox, 5 knap...

Hur man använder ånga och RealPlayer som en webbläsare

När jag tänker på RealPlayer, tänker jag på en mediaspelare. När jag tänker på Steam tror jag ett spel online shop. Men visste du, du kan faktiskt använda dem som en webbläsare, jag vet inte varför du skulle vilja men ja. Funktionaliteten är där. (Ja...

Ställa in och redigera en Windows 8-liknande hemsida för en webbläsare (föråldrad)

(Redigera 10/3/2012: denna handledning är föråldrad, besök http://eight.kx.cz/index.htm för de uppdaterade filerna och handledning)Nu, jag såg detta på lifehacker (http://lifehac.kr/mJY5GF ) häromdagen och tänkte jag skulle lägga upp en mer detaljera...