Laravel5.6 + 阿里雲OSS 完成圖文分離架構

本案例採用 Laravel5.6 + 阿里雲OSS 完成圖片上傳功能,全是乾貨,按步驟操作即可完成。

在部署環境之前,我們需要去阿里雲平臺註冊一個賬號,個人賬號和公司賬號都可以,註冊完成後,複製access_key和access_secret配置在項目中就完成了項目的基本設置。

一. 新建項目,安裝Laravel5.6版本的框架代碼

1. 環境配置要求

Laravel 對系統有一些要求,您的服務器滿足下面的要求:

  • PHP >= 7.1.3
  • OpenSSL PHP
  • PHP PDO 擴展
  • PHP Mbstring 擴展
  • PHP Tokenizer 擴展
  • PHP XML 擴展
  • PHP Ctype 擴展
  • PHP JSON 擴展

備註:您需要達到以上的配置要求,這個就不具體詳細說明,具體看php語法

2. 安裝Laravel5.6框架

Laravel5.6 使用 Composer 來管理項目依賴。因此,在使用 Laravel5.6 之前,請確保你的機器已經安裝了 Composer。

<code>composer -v/<code>


Laravel5.6 + 阿里雲OSS 完成圖文分離架構


備註:composer具體安裝請參照上面鏈接,按文檔安裝即可下面我們具體安裝Larvael5.6框架,在控制窗口輸入一下內容(本人windows操作系統),等待安裝完成。

<code>composer create-project --prefer-dist laravel/laravel blog/<code>

安裝完成後執行以下代碼,為應用程序設置隨機字符串密鑰。

<code>php artisan key:generate/<code>

在瀏覽器中輸入:http://localhost/blog/public/index.php,看到如下界面就是訪問正常了。

Laravel5.6 + 阿里雲OSS 完成圖文分離架構

3. composer.json配置阿里雲組件包

在require中添加"jacobcyl/ali-oss-storage": "^2.1"

<code>“require”: {
      “php”: “^7.1.3”,
      “fideloper/proxy”: “^4.0”,
        "laravel/framework”: “5.8.*”,“laravel/tinker”: “^1.0”,“jacobcyl/ali-oss-storage”: “^2.1”},/<code>

然後執行命令:

<code>composer update
composer dumpautoload/<code>
Laravel5.6 + 阿里雲OSS 完成圖文分離架構

組件下載完成後,如下圖:

Laravel5.6 + 阿里雲OSS 完成圖文分離架構

4. 配置阿里雲access_key和access_secret配置(OSS自行開通)

這裡很關鍵:我的是單獨寫了一個文件進行配置

  • 第一步:在config/app.php的providers下添加:
<code>Jacobcyl\AliOSS\AliOssServiceProvider::class,/<code>
  • 第二步:在app/filesystems.php中的disks裡下添加
<code>'oss' => [
    'driver' => 'oss',
    'access_id' => env('OSS_ACCESS_ID', '填你自己的'),
    'access_key' => env('OSS_ACCESS_KEY', '填你自己的'),
    'bucket' => env('OSS_BUCKET', '填你自己的'),
    'endpoint' => env('OSS_ENDPOINT', 'oss-cn-hangzhou.aliyuncs.com'),
    'isCName' => false,
    'debug' => true,
],/<code>
  • 第三步:新建文件alioss.php文件
<code> env('OSS_ACCESS_ID', '填你自己的'),
    'OSS_ACCESS_KEY'=> env('OSS_ACCESS_KEY', '填你自己的'),
    'OSS_ENDPOINT' => env('OSS_ENDPOINT', 'oss-cn-hangzhou.aliyuncs.com'),
    'OSS_BUCKET' => env('OSS_BUCKET', '填你自己的'),
    'OSS_HOST' => 'https://填你自己的.oss-cn-hangzhou.aliyuncs.com',//前臺顯示域名
    'OSS_URL' => 'https://填你自己的.oss-cn-hangzhou.aliyuncs.com', // CDN域名,沒有CDN就和OSS_HOST一致即可
];/<code>

到此文件就已經加載完成。

二. 編寫接口控制器方法

新建控制器:UploadsController 繼承 Controller類,方便操作。

  • 第一步:編寫API路由
<code>Route::post('/index/image', '\App\Http\Controllers\Index\UploadsController@index');/<code>
  • 第二步:編寫控制器,上傳圖片(核心代碼)
<code>public function index(Request $request) {
      $disk = \Storage::disk('oss');
      if (!isset($request->image)) {
     		 return $this->array_format('圖片信息錯誤' . __LINE__, 414);
      }
      switch ($request->source) {
      		case 'file':
      		if (!($request->hasFile('image') && $request->file('image')->isValid())) {
     					 return $this->array_format('圖片信息錯誤' . __LINE__, 414);
      		}
            $file = $request->file('image');
            $image_str = @file_get_contents($file->getPathname());
            $base64_str = base64_encode($image_str);
            break;
        case 'url':
          $image_str = @file_get_contents($request->image);
          $base64_str = base64_encode($image_str);
          break;
        case 'base64':
          $base64_str = $request->image;
          break;
        default:
          return $this->array_format('圖片類型錯誤', 414);
          break;
      }

      //獲取圖片信息
      $image_info = $this->base64_image_format($base64_str);
      if (!$image_info) {
      		return $this->array_format('圖片信息錯誤' . __LINE__, 414);
      }
      if ($image_info['image_size'] > 10 * 1024 * 1024) {
      		return $this->array_format('圖片信息太大', 414);
      }

      $image_path = 'uploads/image/'. date('Ym');
      $image_name = $image_path . '/' . md5($image_info['image_str']) . '.' . $image_info['image_suffix'];
      //上傳圖片
      $temp = $disk->put($image_name, $image_info['image_str']);
      if (!$temp) {
      		return $this->array_format('上傳失敗', 414);
      }
      return $this->array_format('上傳成功', 200, [
          'image_name' => $image_name,
          'image_url' => $disk->url($image_name),
      ]);
}/<code>
  • 四. Postman工具接口測試
Laravel5.6 + 阿里雲OSS 完成圖文分離架構

公眾號(Laravel技術社區)回覆“阿里雲OSS”,下載案例源碼。


分享到:


相關文章: