laravel+react实战打造企业级高并发分布式电商小程序(一)-- 基础建设

laravel+react实战打造企业级高并发分布式电商小程序(一)

整体使用laravel7+react打造整个电商小程序。里面会涉及到高并发的知识,mysql的分库分表,主从读写分离的配置,redis集群的使用,缓存系统的使用,队列系统的使用等。

先初始化一个laravel的项目。然后配置好.env文件。

基础建设

我们使用前后端分离就要考虑跨域问题和安全问题。跨域使用cors解决,laravel7里面内置了cors的解决方案,我们只要修改config/cors.php配置文件就好了。

把里面的值更改一下。修改这个值的原因是因为我们会使用jwt传一个token的请求头过来进行验证。这个时候还是报跨域的错误,所以将supports_credentials值修改为true,如果不报错就不需要修改了。


'supports_credentials' => true,

把这个参数的值修改为true。

安全问题使用jwt的解决方案,安装jwt的包。

composer require lcobucci/jwt

在routes/api.php路由文件中增加下面的路由


//获取jwt token
Route::post('/require_token', 'JWT\RequireTokenController@requireToken');

在config下面新建jwt.php文件,里面内容如下


<?php

return [
    'JWT_SECRET' => env('JWT_SECRET','DvYUz+woS7vVJe6ldY+PqWoUbhIyY9rShzM0NAfzxdU='),
    'JWT_EXP_TIME' => env('JWT_EXP_TIME','36000'),
];

.env中增加下面的内容


# jwt
JWT_SECRET=DvYUz+woS7vVJe6ldY+PqWoUbhIyY9rShzM0NAfzxdU=   
JWT_EXP_TIME=36000  //过期时间

app/http/middleware中创建中间件jwtCheck.php,内容如下


<?php

namespace App\Http\Middleware;

use App\Models\Sys\ErrorModel;
use Closure;
use \Lcobucci\JWT\Parser;
use \Lcobucci\JWT\Signer\Hmac\Sha256;

class jwtCheck
{
    /**
     * Handle an incoming request.
     *
     * @param  \Illuminate\Http\Request  $request
     * @param  \Closure  $next
     * @return mixed
     */
    public function handle($request, Closure $next)
    {

        $parser = new Parser;
        $signer = new Sha256;
        $secret = config('jwt.JWT_SECRET');

        if($request->hasHeader('Authorization')){
            $token = $request->header('Authorization');
            //解析token
            $parse = $parser->parse($token);
            //验证token合法性
            if (!$parse->verify($signer, $secret)) {
                return response()->json(['code'=>ErrorModel::JWT_ERROR, 'msg'=>'令牌错误!']);
            }

            //验证是否已经过期
            if ($parse->isExpired()) {
                return response()->json(['code'=>ErrorModel::JWT_ERROR, 'msg'=>'令牌过期!']);
            }
        }else{
            return response()->json(['code'=>ErrorModel::JWT_ERROR, 'msg'=>'令牌缺失!']);
        }
        //把token放到参数里面
        request()->offsetSet('token', $token);
        return $next($request);
    }
}

app/http下面的Kernel.php文件里面的$routeMiddleware变量里面增加下面内容,把中间件注册到系统中。

'jwtCheck' => \App\Http\Middleware\jwtCheck::class,

控制器

创建控制器

app/http/controller下面创建jwt文件夹,然后在jwt文件夹里面创建RequireTokenController.php文件。


<?php

namespace App\Http\Controllers\JWT;

use App\Http\Controllers\Controller;
use Illuminate\Http\Request;
use \Lcobucci\JWT\Builder;
use \Lcobucci\JWT\Signer\Hmac\Sha256;
use Illuminate\Support\Facades\Redis;

class RequireTokenController extends Controller
{
    public function requireToken(Builder $builder, Sha256 $signer) {

        $secret = config('jwt.JWT_SECRET');
        $time = time();
        $expTime = config('jwt.JWT_EXP_TIME');

        do {
            //设置header和payload,以下的字段都可以自定义
            $builder->setIssuer("cmp.wliot.com") //发布者
                    ->setAudience("cmp.wliot.com") //接收者
                    ->setId("abc", true) //对当前token设置的标识
                    ->setIssuedAt($time) //token创建时间
                    ->setExpiration($time + $expTime) //过期时间
                    // ->setNotBefore($time + 5) //当前时间在这个时间前,token不能使用
                    ->set('uid', 30061); //自定义数据

            //设置签名
            $builder->sign($signer, $secret);
            //获取加密后的token,转为字符串
            $token = (string)$builder->getToken();
        } while (Redis::exists($token));
        //存入redis
        // Redis::setex($token, $expTime, json_encode([]));

        return $this->success($token);
    }
}

在这里面使用到了$this->success()方法,这个方法来自controller类,我们需要编写这个方法。

app/http下面创建Utils文件夹,在里面创建Success.php文件。


<?php

namespace App\Http\Utils;

use App\Models\Sys\ErrorModel;

trait Success {

    function success($data = []) {
        $res = ['code'=>'0','msg'=>'请求成功!', 'data'=>$data];
        return response()->json($res);
    }
}

修改app/http/controllers/controller.php文件


use App\Http\Utils\Success;  //引入刚才的文件

class Controller extends BaseController {
    use AuthorizesRequests, DispatchesJobs, ValidatesRequests, Success;  //在这里添加Success 也就是刚才的文件。
}

在这里面使用到了redis,所以我们需要启动你本地的redis服务器。启动之后就可以访问我们上面填写的路由了,使用postman访问你的路由。

在这里插入图片描述

可以看到返回了正确的token。

在后面的访问请求中我们需要使用这个token。我们把它加入请求头。在请求头新建一个Authorization的key,他的值就是我们的token。

  • 2
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
React 17是最新发布的React版本,它带来了一些重要的改进和优化,提高了React应用的性能和可维护性。React Hooks是一种新的特性,它可以替代Class组件中的生命周期方法和状态管理方式,使代码更简洁、易读和可测试。TypeScript是一种静态类型检查的编程语言,结合ReactReact Hooks可以提供更好的类型安全和代码提示,减少潜在的bug。 在仿Jira企业级项目中,使用React 17、React Hooks和TypeScript的最佳实践可以如下: 1. 使用函数组件和React Hooks来构建UI组件,避免使用Class组件和生命周期方法。这样可以降低组件的复杂度,并且让代码更加易于维护和扩展。 2. 在使用React Hooks时,尽可能将逻辑分离成可复用的自定义Hooks,以提高代码的可维护性和重用性。 3. 使用TypeScript来为组件和函数添加类型声明,以提供更好的类型安全和代码提示。通过使用接口和类型别名,可以明确指定组件的props和状态的类型,并及时发现并修复类型错误。 4. 使用React Context和useContext Hook来实现全局状态管理。这对于企业级项目中的共享数据是非常有用的,可以避免通过Props层层传递数据。 5. 使用React Router来管理路由,以便实现页面间的导航和切换。 6. 使用Axios或其他合适的网络库来处理与服务器的数据通信。 7. 使用CSS模块化或CSS-in-JS技术来管理组件的样式,以确保样式的隔离性和可重用性。 8. 使用ESLint和Prettier等代码检查工具,确保代码的一致性和质量。 通过遵循以上最佳实践,可以使仿Jira企业级项目更加现代化、高效、可维护,帮助开发者更好地进行团队协作和项目开发。

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值