Kaip naudoti „Laravel“ su „Socket.IO“

Tinklo lizdai yra kieti. Jie yra tikrai naudingi, jei norite realiuoju laiku parodyti savo vartotojų veiklą (arba galbūt kai kuriuos eilės darbus).

Dabar, jei bijote žodžio „ Websockets “, nebūkite . Aš išdėstysiu instrukcijas, kaip galite jį naudoti, ir prireikus atsakysiu į jūsų klausimus.

Turėjau šį iššūkį ten, kur man to reikėjo, kad būtų parodytas sąrašas žmonių, kurie šiuo metu „ Laravel“ žiūri konkretų URL . Taigi pradėjau galvoti. Dalis manęs norėjo greitai įsilaužti (laimei, tai nėra stipriausia mano pusė). Nors kitas norėjo sukurti ką nors puikaus, daugkartinio naudojimo ir ilgalaikio.

„Kodėl nenaudojate tiesiog„ Pusher “?

Čia yra dalykas.

„Laravel“ yra įjungtas „Pusher“. Nors „ Pusher“ atrodo kaip greitas „ Plug and Play “ sprendimas (koks jis yra), jis turi apribojimų. Peržiūrėkite //pusher.com/pricing

Ir dauguma pamokų apgauna jus su „Websockets“ diegimo pavadinimu, nors iš tikrųjų jie tiesiog nori jums suteikti „Pusher“. (Ir mano mėgstamiausia dalis yra ta, kai jie sako, kad galite lengvai pereiti prie socket.io)

„Mes norime turėti neribotą skaičių ryšių“

Mes nenorime jaudintis dėl apribojimų.

Pradėkime.

Aš naudoju valkatą / sodybą.

Tam reikės perskaityti apie renginių transliaciją.

Čia reikia atkreipti dėmesį į tai (todėl neturiu pakartoti dalykų):

1. „ Broadcast“ sąsaja renginiams

2. Įgalinkite transliavimo maršrutus ir naudodami maršrutus / kanalus.php vartotojams autentifikuoti

3. Viešasis kanalas - visi gali klausytis

4. Privatus kanalas - prieš prisijungdami prie kanalo, turite įgalioti vartotojus

5. Dalyvavimo kanalas - kaip privatus, bet jūs galite perduoti daug papildomų metaduomenų tame kanale ir gauti sąrašą žmonių, kurie prisijungė prie kanalo.

Sukurkite savo įvykį

php artisan make:event MessagePushed

Jūs netgi galite sekti konkretų pavyzdį „Event Broadcasting“ dokumentuose. (Ko turėtume iš tikrųjų).

Įdiekite „Redis“

Prieš tai aš turėjau eilių nustatymą su „Supervisor“ / „Redis“ / „Horizon“. „Horizon“ yra puikus ir informacijos apie tai galite rasti čia //laravel.com/docs/5.6/horizon

Kai jūsų eilės veiks, tame „MessagePushed“ įvykyje reikės naudoti eiles.

Pastaba : kad visa tai veiktų, būtinai redaguokite .env failą:

BROADCAST_DRIVER=redis
QUEUE_DRIVER=redis
(this is from the horizon setup actually, but we will need that for later)
REDIS_HOST=127.0.0.1
REDIS_PASSWORD=null
REDIS_PORT=6379

Įdiekite „Laravel Echo Server“

Taigi šioje dalyje mes įdiegiame „socket.io“ serverį, kuris yra sujungtas „laravel-echo“ serveryje. Apie tai rasite čia: //github.com/tlaverdure/laravel-echo-server

Pastaba : Patikrinkite reikalavimus viršuje!

Vykdykite šiuos veiksmus (kaip nurodyta dokumente)

npm install -g laravel-echo-server

Tada paleiskite „init“, kad jūsų „laravel-echo-server.json“ failas būtų sugeneruotas programos šaknyje (kurį turėsime sukonfigūruoti).

laravel-echo-server init

Sugeneravus failą „laravel-echo-server.json“, jis turėtų atrodyti taip.

{
"authHost": "//local-website.app",
"authEndpoint": "/broadcasting/auth",
"clients": [
{
"appId": "my-app-id",
"key": "my-key-generated-with-init-command"
}
],
"database": "redis",
"databaseConfig": {
"redis": {},
"sqlite": {
"databasePath": "/database/laravel-echo-server.sqlite"
},
"port": "6379",
"host": "127.0.0.1"
},
"devMode": false,
"host": null,
"port": "6001",
"protocol": "http",
"socketio": {},
"sslCertPath": "",
"sslKeyPath": "",
"sslCertChainPath": "",
"sslPassphrase": ""
}

Pastaba : Jei norite tai perkelti į savo viešąjį serverį, būtinai pridėkite laravel-echo-server.json prie savo .gitignore. G enerate šį failą į serverį, nes kitaip jums reikės keisti savo authHost visą laiką.

Paleiskite „Laravel Echo“ serverį

Norėdami paleisti žiniatinklio lizdus, ​​turite jį paleisti.

laravel-echo-server start 

(šaknies viduje - kur yra jūsų laravel-echo-server.json)

Tai turėtų prasidėti sėkmingai. (Dabar mes norėsime tai pridėti prie jūsų serverio prižiūrėtojo, todėl jis paleidžiamas automatiškai ir paleidžiamas iš naujo, jei sugenda)

Viduje savo /etc/supervisor/conf.d/laravel-echo.conf (tiesiog sukurti šį failą viduje savo conf.d aplanke) uždėkite taip:

[program:laravel-echo]
directory=/var/www/my-website-folder
process_name=%(program_name)s_%(process_num)02d
command=laravel-echo-server start
autostart=true
autorestart=true
user=your-linux-user
numprocs=1
redirect_stderr=true
stdout_logfile=/var/www/my-website-folder/storage/logs/echo.log

Užsidėję savo „Laravel“ šaknyje, galite paleisti

pwd

norėdami gauti aukščiau esančio „katalogo“ ir priešdėlio „stdout_logfile“ kelią.

Jūsų vartotojas bus jūsų „Linux“ vartotojas (valkata, „Ubuntu“ ar kita)

Išsaugokite failą ir išeikite.

Jei naudojote „vim laravel-echo.conf“, tada, kai esate viduje, klaviatūroje paspauskite I (pvz., Stambulas), kad redaguotumėte failą naudodami VIM, tada įveskite ESC taip: wq! Norėdami uždaryti failą ir jį išsaugoti.

Tada turime paleisti šias komandas:

sudo supervisorctl stop all sudo supervisorctl reread
sudo supervisorctl reload

Po to patikrinkite, ar veikia laravelio aidas

sudo supervisorctl status

Įdiekite „Laravel Echo“ ir „Socket IO“ klientą

npm install --save laravel-echo
npm install --save socket.io-client

Tada savo bootstrap.js (aš naudoju „Vue js“) užregistruokite savo aidą

import Echo from "laravel-echo"window.io = require('socket.io-client');
// Have this in case you stop running your laravel echo server
if (typeof io !== 'undefined') { window.Echo = new Echo({ broadcaster: 'socket.io', host: window.location.hostname + ':6001', });}

Dabar dar kartą patikrinkite, kaip klausytis įvykių konkrečiuose kanaluose.

Vadovaudamiesi „Laravel Broadcasting“ dokumentais, kuriais dalijomės aukščiau, jei nustatysite „ broadcastOn“ () metodą, kad grąžintumėte naują „PresenceChannel“ (paaiškinsiu konkretų atvejį, kurį padariau, bet nedvejodami užduokite klausimus, jei jums reikia ką nors kito įgyvendinti. Manau, kad tai kad būtų sudėtingiau nei paprasčiausiai naudojant viešąjį kanalą, kad galėtume sumažinti mastą be jokių problemų), tada norime klausytis to kanalo „Javascript“ pusėje (priekyje).

Štai konkretus pavyzdys:

  1. Įstojau įvykį į dalyvavimo kanalą (turėjau reikalų su apklausomis)
public function broadcastOn()
{
return new PresenceChannel('survey.' . $this->survey->id);
}

2. Paspaudus įvykį, jis eis per kanalus.php. Ten mes norime sukurti šio vartotojo įgaliojimą. (Nepamirškite grąžinti masyvo, kad būtų suteikta dalyvavimo kanalo prieigos teisė, o ne loginis.)

Broadcast::channel('survey.{survey_id}', function ($user, $survey_id) {
return [
'id' => $user->id,
'image' => $user->image(),
'full_name' => $user->full_name
];
});

3. Tada savo „VueJs“ komponente, kurį įkeliu į puslapį, kurį noriu stebėti, apibrėžiu metodą, kuris bus inicijuojamas iš sukurto () metodo įkeliant:

listenForBroadcast(survey_id) {
Echo.join('survey.' + survey_id)
.here((users) => {
this.users_viewing = users;
this.$forceUpdate();
})
.joining((user) => {
if (this.checkIfUserAlreadyViewingSurvey(user)) {
this.users_viewing.push(user);
this.$forceUpdate();
}
})
.leaving((user) => {
this.removeViewingUser(user);
this.$forceUpdate();
});
},

Akivaizdu, kad čia ištraukiau kodą iš konteksto, bet turiu šį „user_viewing“ masyvą, kad išlaikyčiau dabartinius prie kanalo prisijungusius vartotojus.

Ir taip būtų iš tikrųjų.

Tikiuosi, kad galėjai sekti, nes stengiausi būti kuo išsamesnė.

Laimingo kodavimo!

Sekite mane „Twitter“

Pridėkite mane „LinkedIn“