arkcode/chat-laravel

适用于 Laravel 的实时聊天小部件,还包括多用户聊天、群组权限、客户支持聊天等。

1.0.2 2023-11-28 11:02 UTC

This package is auto-updated.

Last update: 2024-09-28 12:42:36 UTC


README

Laravel 安装

AddChat 可以通过 composer 安装。简单... 🍻

先决条件

  • Laravel 版本 5.5 / 5.6 / 5.7 / 5.8 / 6.x
  • 请确保在 全新现有 Laravel 应用程序上安装 AddChat 包。
  • 我们假设您已经设置了数据库。
  • 如果您正在运行小于 5.7 的 MySql 版本,请确保在 Laravel 的 config/database.php 中禁用严格模式 'strict' => false

安装

  1. 如果您正在现有 Laravel 应用程序上安装 AddChat 并且您已经有了 Auth 系统,则 跳过此步骤

    如果您在 全新 Laravel 应用程序 上安装,则运行

    对于 Laravel 5.5 到 5.8

    php artisan make:auth
    
    php artisan migrate

    对于 Laravel 6.x

    composer require laravel/ui --dev
    
    php artisan ui vue --auth
    
    npm install && npm run dev
    
    php artisan migrate
  2. 解压 addchat-laravel-pro.zip 文件,复制 addchat-laravel-pro 文件夹并将其放置在您的 Laravel 应用程序根目录中。

    • 在您的 Laravel 网站目录中,文件夹名称必须是 addchat-laravel-pro
  3. 打开您的 Laravel 应用程序 composer.json 文件,并在末尾粘贴以下代码(在最后一个大括号 } 之前)

    "repositories": [{
        "type": "path",
        "url": "addchat-laravel-pro/"
    }]
  4. 通过 Composer 安装 AddChat Laravel Pro

    composer require arkcode/chat-laravel
  5. 运行 AddChat 安装命令

    php artisan addchat:install
  6. 打开通用布局文件,通常是包含 HTML & BODY 标签的文件。

    • 复制 AddChat CSS 代码,并将其粘贴在 </head> 标签之前

      <!-- 1. Addchat css -->
      <link href="<?php echo asset('assets/addchat/css/addchat.min.css') ?>" rel="stylesheet">
    • 复制 AddChat 小部件代码,并将其粘贴在 <body> 标签之后

      <!-- 2. AddChat widget -->
      <div id="addchat_app" 
          data-baseurl="<?php echo url('') ?>"
          data-csrfname="<?php echo 'X-CSRF-Token' ?>"
          data-csrftoken="<?php echo csrf_token() ?>"
      ></div>
    • 复制 AddChat JS 代码,并将其粘贴在 </body> 标签之前

      <!-- 3. AddChat JS -->
      <!-- Modern browsers -->
      <script type="module" src="<?php echo asset('assets/addchat/js/addchat.min.js') ?>"></script>
      <!-- Fallback support for Older browsers -->
      <script nomodule src="<?php echo asset('assets/addchat/js/addchat-legacy.min.js') ?>"></script>
    • 请将 <php ?> 标签替换为 {{}} 括号。

    最终的布局将类似于这样

    <head>
    
        <!-- **** your site other content **** -->
    
        <!-- 1. Addchat css -->
        <link href="<?php echo asset('assets/addchat/css/addchat.min.css') ?>" rel="stylesheet">
    
    </head>
    <body>
    
        <!-- 2. AddChat widget -->
        <div id="addchat_app" 
            data-baseurl="<?php echo url('') ?>"
            data-csrfname="<?php echo 'X-CSRF-Token' ?>"
            data-csrftoken="<?php echo csrf_token() ?>"
        ></div>
    
    
        
        <!-- **** your site other content **** -->
    
    
    
        <!-- 3. AddChat JS -->
        <!-- 3. AddChat JS -->
        <!-- Modern browsers -->
        <script type="module" src="<?php echo asset('assets/addchat/js/addchat.min.js') ?>"></script>
        <!-- Fallback support for Older browsers -->
        <script nomodule src="<?php echo asset('assets/addchat/js/addchat-legacy.min.js') ?>"></script>
    
    </body>
  • addchat.min.js 用于现代浏览器和 addchat-legacy.min.js 用于旧浏览器。浏览器将根据 type="module"nomodule 自动切换它们,您不需要做任何事情。

设置完成