解決:打開阿里雲圖片顯示下載,而不是直接預覽的問題

第一種方式:

修改:OssClient.php文件中的 DEFAULT_CONTENT_TYPE的值爲image/jpeg。

解釋:CONTENT_TYPE在php SDK中設置的值是application/octet-stream : 二進制流數據(如常見的文件下載)。現在我們修改成 image/jpeg :jpg圖片格式。所以打開後就能直接預覽了。

在這裏插入圖片描述

常見的Http請求中Content-Type:

常見的媒體格式類型如下:
    text/html : HTML格式
    text/plain :純文本格式     
    text/xml :  XML格式
    image/gif :gif圖片格式   
    image/jpeg :jpg圖片格式
    image/png:png圖片格式
以application開頭的媒體格式類型:

   application/xhtml+xml :XHTML格式
   application/xml     : XML數據格式
   application/atom+xml  :Atom XML聚合格式   
   application/json    : JSON數據格式
   application/pdf       :pdf格式 
   application/msword  : Word文檔格式
   application/octet-stream : 二進制流數據(如常見的文件下載)
   application/x-www-form-urlencoded : <form encType=””>
   中默認的encType,form表單數據被編碼爲key/value格式發送到服務器(表單默認的提交數據的格式)
    multipart/form-data : 需要在表單中進行文件上傳時,就需要使用該格式

我們來看阿里雲的核心上傳代碼:

/**
     * Uploads a local file
     *
     * @param string $bucket bucket name
     * @param string $object object name
     * @param string $file local file path
     * @param array $options
     * @return null
     * @throws OssException
     */
    public function uploadFile($bucket, $object, $file, $options = NULL)
    {
        $this->precheckCommon($bucket, $object, $options);
        OssUtil::throwOssExceptionWithMessageIfEmpty($file, "file path is invalid");
        $file = OssUtil::encodePath($file);
        if (!file_exists($file)) {
            throw new OssException($file . " file does not exist");
        }
        $options[self::OSS_FILE_UPLOAD] = $file;
        $file_size = filesize($options[self::OSS_FILE_UPLOAD]);
        $is_check_md5 = $this->isCheckMD5($options);
        if ($is_check_md5) {
            $content_md5 = base64_encode(md5_file($options[self::OSS_FILE_UPLOAD], true));
            $options[self::OSS_CONTENT_MD5] = $content_md5;
        }
        if (!isset($options[self::OSS_CONTENT_TYPE])) {
            $options[self::OSS_CONTENT_TYPE] = $this->getMimeType($object, $file);
        }
        $options[self::OSS_METHOD] = self::OSS_HTTP_PUT;
        $options[self::OSS_BUCKET] = $bucket;
        $options[self::OSS_OBJECT] = $object;
        $options[self::OSS_CONTENT_LENGTH] = $file_size;
        $response = $this->auth($options);
        $result = new PutSetDeleteResult($response);
        return $result->getData();
    }

注意第二個參數¥object,和這行

 if (!isset($options[self::OSS_CONTENT_TYPE])) {
            $options[self::OSS_CONTENT_TYPE] = $this->getMimeType($object, $file);
        }

如果沒有設置Content-Type,那麼就走這裏,來看getMimeType($object, $file),

  private function getMimeType($object, $file = null)
    {
        if (!is_null($file)) {
            $type = MimeTypes::getMimetype($file);
            if (!is_null($type)) {
                return $type;
            }
        }

        $type = MimeTypes::getMimetype($object);
        if (!is_null($type)) {
            return $type;
        }

        return self::DEFAULT_CONTENT_TYPE;
    }

這裏很明顯了,最後返回了什麼,系統默認設置,也就是最初定義的常量的地方。
通過了解,我們明白了阿里雲設置的默認圖片上傳格式是下載格式。

第二種方式:

我們將上傳的方式修改一下,設置一下上傳的Content-Type。
例如:

 /**
     * 阿里雲圖片上傳
     * @param $local_path   本地文件或臨時文件路徑
     * @return |null
     */
    public function uploadAliyun($local_path)
    {
        require "../vendor/aliyun-oss-php-sdk-master/autoload.php";
        $accessKeyId = config('ALIYUN.accessKeyId');
        $accessKeySecret = config('ALIYUN.accessKeySecret');
        $endpoint = config('ALIYUN.endpoint');
        $bucket = config('ALIYUN.bucket');

        $aliyun_file = md5($local_path.time().rand(1,100000)).'.'.pathinfo($local_path,PATHINFO_EXTENSION);
        try {
            $ossClient = new \OSS\OssClient($accessKeyId, $accessKeySecret, $endpoint);
            $result = $ossClient->uploadFile($bucket, $aliyun_file, $local_path,['Content-Type'=>'image/jpg']);
            return $result['info']['url'];
        } catch (\Exception $e) {
            echo $e->getMessage();
            return null;
        }

    }

將函數$ossClient->uploadFile()第四個參數設定成image/jpg即可。這種方式避免了修改源代碼,不使用默認值從而達到預覽圖片的效果。

發表評論
所有評論
還沒有人評論,想成為第一個評論的人麼? 請在上方評論欄輸入並且點擊發布.
相關文章