A projekt
Az új projektedhez hozz létre egy mappát az előző fejezetben kitárgyalt "package.json" mellé.
Ebbe a mappába kell minden hozzá tartozó fájlt raknod - persze almappákat használhatsz benne.
Első sorban hozz létre egy "index.js" nevű fájlt. Ez lesz a szerver kódja, amit a Node futtat.
Tipp: Hogy ne kelljen mindig parancssorból elindítanod, csinálj egy "akármi.bat" (én server.bat-nak szoktam elnevezni) fájlt, amibe ennyit másolj bele:
node index.js pauseNyissuk meg az "index.js" fájlt, amibe pár alap sort kell gépelni. A videóban röviden elmondtam, hogy mi miért kell, de akit érdekel utánaolvashat (illetve valamennyire egyértelmű is):
const express = require("express");
const app = express();
var http = require('http').Server(app);
var io = require('socket.io')(http);
app.use(express.static(__dirname));
/* új változókat, funkciókat itt hozz létre */
io.on('connection', function(socket) {
/* ide jön a bejövő adatok vizsgálata */
});
http.listen(1337, function() {
console.log('A szerver fut az 1337-es porton.');
});
A bejövő adatok vizsgálata részbe pedig funkciókat tudsz pakolászni, amik egy jelzésre figyelnek.
socket.on('test', function(data) {
socket.emit('onlyForSender', data);
io.emit('allConnected', data);
});
Ha a kliens küld a szerver felé egy 'test' "üzenetet", akkor a szerver csak neki visszaküld egy 'onlyForSender' nevű üzenetet, mindenkinek pedig (beleértve a küldőt is) egy 'allConnected' üzenetet. Így tudsz funkciókat létrehozni, valamint választ küldeni a szerver részéről a csatlakozó feleknek.A kliens oldalon a "kötelező" dolog jóval rövidebb - be kell szúrni egy szkriptet a <body> után, lehetőleg minél közelebb:
<script src="/socket.io/socket.io.js"></script>Ezen kívül a szkript elejére valahova, (ahol kezded) kelleni fog egy rövidke
window.socket = io();sor, innentől pedig eléred a 'socket' paranccsal annak funkcióit. Példa az adat küldésére és fogadására:
socket.emit('test', 1);
// a küldött adat lehet szám, tömb, objektum, stb
socket.on('receive', function(data) {
/* és itt tevékenykedhetsz,
mi történjen a kapott data-val */
});
Röviden ennyi lenne, innentől a fantáziádra van bízva, mit hozol ki belőle.Ide kattintva egy Google Drive mappa jön be, ahonnan letölthetitek a sablont a kezdéshez (azzal a pár sorral), meg a videó végén lévő kész kódot is, kipróbálhatjátok.
Sok sikert, jó próbálkozást, alkotást!
// Előző "fejezet"
Nincsenek megjegyzések:
Megjegyzés küldése