Socket.IO - Laravel JWT

Socket.IO - Laravel JWT 首页 / Socket.io入门教程 / Socket.IO - Laravel JWT

今天,将向您展示如何在Laravel 5.3中使用JWT和Socket io对用户节点js进行身份验证。这非常重要,因为如果您与用户一起使用聊天应用程序或Messenger系统等,则必须使用JWT令牌,因为这是一种非常安全的方法。

步骤1:安装Laravel 5应用

在此步骤中,如果您没有Laravel 5应用程序设置,那么我们必须获得新的Laravel 5应用程序。

composer create-project --prefer-dist laravel/laravel blog

创建好后进入Laravel根目录并运行以下命令,这些命令将创建auth和表迁移。

php artisan make:auth

php artisan migrate

步骤2:JWT包安装

JWT代表Json Web令牌。 JWT将帮助创建身份验证并连接前端和后端功能。通过JWT我们可以创建登录和注册API。因此,首先我们必须在laravel 5中安装“ tymon / jwt-auth”软件包。

我们还安装了Barryvdh/Laravel-Cors包,用于处理跨域问题。

所以,运行以下命令并安装。

composer require barryvdh/laravel-cors tymon/jwt-auth

安装此包后,现在打开Config/app.php文件并添加service provider。

config/app.php

'providers' => [

....

Tymon\JWTAuth\Providers\JWTAuthServiceProvider::class,

Barryvdh\Cors\ServiceProvider::class,

]

....

在此之后,我们必须通过以下命令发布配置:

php artisan vendor:publish --provider="Tymon\JWTAuth\Providers\JWTAuthServiceProvider"

php artisan vendor:publish --provider="Barryvdh\Cors\ServiceProvider"

好的,现在我们必须像下面这样将CORS中间件添加到`app / Http / Kernel.php`全局文件中:

app/Http/Kernel.php

....

protected $middlewareGroups = [

'web' => [

.......

\Barryvdh\Cors\HandleCors::class

],

'api' => [

'throttle:60,1'

'bindings'

],

];

....

好的,现在我们必须使用JWT Secret创建更安全的JWT令牌,因此我们可以在“ .env”文件中设置JWT密钥,因此打开env文件并放入下面的行:

.env

JWT_SECRET=B1Bbr8EnAdJASz3l7Wl0U69f4UHsdtDX

步骤3:创建令牌路由

在这一步中,我们需要创建生成JWT令牌的路径。所以打开你的routes web.php 文件并添加以下路由。

Route::get('token', '[email protected]');

步骤4:创建控制器

在这一步中,现在我们应该在此路径app/Http/Controllers / TokenController.php中创建新的控制器作为TokenController。该控制器将向我们返回一个令牌,因此将以下内容放入控制器文件中:

app/Http/Controllers/TokenController.php

namespace App\Http\Controllers;

use Illuminate\Http\Request;

use App\Http\Requests;

use Illuminate\Support\Facades\Auth;

use Tymon\JWTAuth\Facades\JWTAuth;

class TokenController extends Controller

{

public function token(Request $request \Tymon\JWTAuth\JWTAuth $auth)

{

Auth::loginUsingId($request->id);

$user = Auth::user();

$claims = ['userid' => $user->id 'email' => $user->email];

$token = $auth->fromUser($user $claims);

return response()->json(['token' => $token]);

}

}

步骤5:安装NodeJS

在此步骤中,如果您尚未安装,我们将安装nodejs。因此,请确保可以检查nodejs是否未安装,然后您可以轻松启动以下命令并安装nodejs。

sudo apt-get update

sudo apt-get install nodejs

步骤6:安装npm

我们必须需要安装NPM,因为我们将使用NPM命令安装更多Socket.io,Sockio-JWT和Express Package。

sudo apt-get install npm

步骤7:安装NodeJS其他包

在此步骤中,我们必须要求安装以下几个包:

1)Express

2)Socket.io

3)Dotenv

4)Socketio-jwt

运行下面命令并在nodejs软件包上方安装:

npm install express socket.io socketio-jwt dotenv --save

步骤8:NodeJS文件(服务器端)

现在我们必须创建nodejs文件,所以首先走上Laravel根目录并创建 nodejs 。在该文件夹中,创建 server.js 文件。

nodejs/server.js

var express = require('express');

var app = express();

var server = require('http').createServer(app);

var io = require('socket.io')(server);

var socketioJwt = require('socketio-jwt');

var myEnv = require('dotenv').config({path:'../.env'});

/*

接受连接并授权令牌代码

*/

io.on('connection' socketioJwt.authorize({

secret: myEnv.JWT_SECRET

timeout: 15000

}));

/*

认证后,通过socket发回userid + email

*/

io.on('authenticated' function (socket) {

console.log(socket.decoded_token);

socket.emit('user-id' socket.decoded_token.userid);

socket.emit('user-email' socket.decoded_token.email);

socket.on('public-my-message' function (data) {

socket.emit('receive-my-message' data.msg);

});

});

/*

在 3000 端口启动 NodeJS 服务器

*/

server.listen(3000);

步骤9:js文件(客户端)

好的,在最后一步中,我们必须创建myauth.html文件。在此文件中,我为Ajax编写代码,并从Laravel获取令牌,然后在nodejs服务器上发出令牌。

myauth.html

<!doctype html>

<html lang="en">

<head>

<script src="//code.jquery.com/jquery-1.10.2.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/socket.io/1.4.8/socket.io.js"></script>

</head>

<body>

<h1>Socket Connection Status: <span id="connection"></span></h1>

<h1>Login User Id: <span id="userid"></span></h1>

<h1>Login User Email: <span id="email"></span></h1>

<h1>Public Message: <span id="receive-my-message"></span></h1>

<script type="text/javascript">

$(document).ready(function () {

socketIOConnectionUpdate('Requesting JWT Token from Laravel');

$.ajax({

url: 'http://localhost:8000/token?id=1'

})

.fail(function (jqXHR textStatus errorThrown) {

socketIOConnectionUpdate('Something is wrong on ajax: ' + textStatus);

})

.done(function (result textStatus jqXHR) {

/*

与 localhost 3000 建立连接

*/

var socket = io.connect('http://localhost:3000');

/*

与套接字 io 连接

*/

socket.on('connect' function () {

socketIOConnectionUpdate('Connected to SocketIO, Authenticating')

socket.emit('authenticate' {token: result.token});

socket.emit('public-my-message' {'msg': 'Hi, Every One.'});

});

/*

如果令牌认证成功,那么这里将收到消息

*/

socket.on('authenticated' function () {

socketIOConnectionUpdate('Authenticated');

});

/*

如果令牌未经授权,那么这里将收到消息

*/

socket.on('unauthorized' function (data) {

socketIOConnectionUpdate('Unauthorized, error msg: ' + data.message);

});

/*

如果断开 socketio 那么这里会得到消息

*/

socket.on('disconnect' function () {

socketIOConnectionUpdate('Disconnected');

});

/*

通过服务器端发出获取用户 ID

*/

socket.on('user-id' function (data) {

$('#userid').html(data);

});

/*

通过服务器端发出获取电子邮件

*/

socket.on('user-email' function (data) {

$('#email').html(data);

});

/*

通过服务器端发出接收我的消息

*/

socket.on('receive-my-message' function (data) {

$('#receive-my-message').html(data);

});

});

});

/*

打印连接消息的功能

*/

function socketIOConnectionUpdate(str) {

$('#connection').html(str);

}

</script>

</body>

</html>

好的,终于可以运行了,但是请确保以下几点:

1)您必须在用户表中拥有一个id = 1的用户

2)通过以下命令运行Laravel应用程序:

php artisan serve

3)运行以下命令的nodejs文件:

nodejs server

或者

node server

4)运行myauth.html文件。

祝学习愉快!(内容编辑有误?请选中要编辑内容 -> 右键 -> 修改 -> 提交!)

技术教程推荐

深入浅出gRPC -〔李林锋〕

许式伟的架构课 -〔许式伟〕

Netty源码剖析与实战 -〔傅健〕

深入浅出云计算 -〔何恺铎〕

互联网人的英语私教课 -〔陈亦峰〕

乔新亮的CTO成长复盘 -〔乔新亮〕

Python自动化办公实战课 -〔尹会生〕

中间件核心技术与实战 -〔丁威〕

快速上手C++数据结构与算法 -〔王健伟〕

好记忆不如烂笔头。留下您的足迹吧 :)