如何用Serverless給網站圖片加水印

這篇文章主要介紹“如何用Serverless給網站圖片加水印”，在日常操作中，相信很多人在如何用Serverless給網站圖片加水印問題上存在疑惑，小編查閱了各式資料，整理出簡單好用的操作方法，希望對大家解答”如何用Serverless給網站圖片加水印”的疑惑有所幫助！接下來，請跟著小編一起來學習吧！

傳統的加水印的方法，通常是在流程內進行。即：

這種做法雖然可行，但是無疑會增加單次請求，服務端的壓力，如果是高并發的情況下，或者多人上傳多張大圖的時候，那么可能就會造成自身服務器資源效果過大。

如果在加水印過程中失敗，就有可能導致圖像存儲失敗，致使數據丟失，并不理智。所以后來有人做了如下改進：

這樣做法的好處就是 —— 我們可以快速將圖片存儲，存儲之后通過一個單獨處理的線程，對任務列表進行處理，這樣一方面是可以保證我們馬上把用戶上傳的圖片存儲，并且可以顯示，同時也可以在后臺進行水印處理，待處理之后，再將圖片覆蓋或者單獨存儲，用戶如果需要讀取圖片時，可以自動變為已經水印后的圖片。

這種做法相對于前者來說可能稍微復雜一些，但是實際上卻是在數據上更加穩定，服務端壓力更小，更加可控的一種操作。但是，這整個流程還是要在自己的服務器上做完，現在已經有很多人將圖片等資源存儲到騰訊云的 對象存儲（COS）中，那么可不可以通過某些 COS 觸發器與云函數 SCF 結合，實現一個不在自己服務器加水印的流程呢？

本文將以騰訊云函數 SCF 的函數模板（Python 語言）為例，進行一個簡單的分享。

▎實驗

新建函數

在無服務器云函數中，選擇模板函數：

通過搜索「圖像」關鍵詞，選中圖像壓縮，并且確定建立。保存之后，點擊函數代碼，進行代碼編寫。

COS 觸發器

有些人可能對 COS 觸發器還不是很了解，此時可以點擊配置，來熟悉 COS 觸發器樣式：

可以看到如下：

{
   "Records":[
      {
        "event": {
          "eventVersion":"1.0",
          "eventSource":"qcs::cos",
          "eventName":"cos: ObjectCreated: *",
          "eventTime":1501054710,
          "eventQueue":"qcs:0:cos:gz:1251111111:cos",
          "requestParameters":{
            "requestSourceIP": "111.111.111.111",
            "requestHeaders":{
              "Authorization": "上傳的鑒權信息"
            }
          }
         },
         "cos":{
            "cosSchemaVersion":"1.0",
            "cosNotificationId":"設置的或返回的 ID",
            "cosBucket":{
               "name":"bucketname",
               "appid":"appId",
               "region":"gz"
            },
            "cosObject":{
               "key":"/appid/bucketname/DSC_0002.JPG",
               "size":2598526,
               "meta":{
                 "Content-Type": "text/plain",
                 "x-cos-meta-test": "自定義的 meta",
                 "x-image-test": "自定義的 meta"
               },
               "url": "訪問文件的源站url"
            }
         }
      }
   ]
}

這里面可以看到整個一個數據結構，需要注意 Records 是一個數組格式，其次就是：

"cosBucket":{"name":"bucketname","appid":"appId","region":"gz"}

這里面是由該 bucket 觸發

"cosObject":{"key":"/appid/bucketname/DSC_0002.JPG","size":2598526,"meta":{"Content-Type":"text/plain","x-cos-meta-test":"自定義的 meta","x-image-test":"自定義的 meta"},"url":"訪問文件的源站 url"}

這里面的 key 是在上述 bucket 中新建的文件名字。

所以，我們可以按照我們的實際情況，將上面的內容簡單修改一下，成為我們格式，以便測試（在生產中，這個是自動生成的觸發格式，并不需要我們修改，我們修改只是為了測試.

{
   "Records":[
      {
        "event": {
          "eventVersion":"1.0",
          "eventSource":"qcs::cos",
          "eventName":"cos: ObjectCreated: *",
          "eventTime":1501054710,
          "eventQueue":"qcs:0:cos:gz:1251111111:cos",
          "requestParameters":{
            "requestSourceIP": "111.111.111.111",
            "requestHeaders":{
              "Authorization": "上傳的鑒權信息"
            }
          }
         },
         "cos":{
            "cosSchemaVersion":"1.0",
            "cosNotificationId":"設置的或返回的 ID",
            "cosBucket":{
               "name":"mytestcos",
               "appid":"appId",
               "region":"gz"
            },
            "cosObject":{
               "key":"test.png",
               "size":2598526,
               "meta":{
                 "Content-Type": "text/plain",
                 "x-cos-meta-test": "自定義的 meta",
                 "x-image-test": "自定義的 meta"
               },
               "url": "訪問文件的源站url"
            }
         }
      }
   ]
}

這里主要修改了我的 cosBucket-name: mytestcos，以及 key: test.png

代碼修改

之所以使用現有的模板，是因為該模板的有 PIL 和 qcloud_cos_v5 等相關 package，而這兩個 package 正是我們即將需要的，這樣就可以省去我們打包函數的流程，只需要進行簡單修改即可實現。

添加水印：

def add_word(pic_path, save_path):
    # 打開圖片
    im = Image.open(pic_path).convert('RGBA')
    # 新建一個空白圖片,尺寸與打開圖片一樣
    txt = Image.new('RGBA', im.size, (0, 0, 0, 0))
    # 設置字體
    fnt = ImageFont.truetype("/tmp/font.ttf", 40)
    # 操作新建的空白圖片>>將新建的圖片添入畫板
    d = ImageDraw.Draw(txt)
    # 在新建的圖片上添加字體
    d.text((txt.size[0] - 220, txt.size[1] - 80), "By Dfounder", font=fnt,  fill=(255, 255, 255, 255))
    # 合并兩個圖片
    out = Image.alpha_composite(im, txt)
    # 保存圖像
    out.save(save_path)

在添加水印的時候，我們設置的是文字水印，所以需要設置字體和字號：

fnt = ImageFont.truetype("/tmp/font.ttf",40)

此時，我們需要在執行之前，先將字體文件傳入到 /tmp/ 文件夾下：

response = client.get_object(Bucket="mytestcos-12567****", Key="font.ttf", ) response['Body'].get_stream_to_file('/tmp/font.ttf')

以我的 cos 為例：

然后，接下來就是對觸發的 event 進行解析，包括獲得新建的圖像名稱，從 COS 拉取，放到本地，然后進行水印等，再上傳回新的 COS 中：

for record in event['Records']:
        try:
            bucket = record['cos']['cosBucket']['name'] + '-' + str(appid)
            key = record['cos']['cosObject']['key']
            key = key.replace('/' + str(appid) + '/' + record['cos']['cosBucket']['name'] + '/', '', 1)
            download_path = '/tmp/{}'.format(key)
            upload_path = '/tmp/new_pic-{}'.format(key)

            # 下載圖片
            try:
                response = client.get_object(Bucket=bucket, Key=key, )
                response['Body'].get_stream_to_file(download_path)
            except CosServiceError as e:
                print(e.get_error_code())
                print(e.get_error_msg())
                print(e.get_resource_location())

            # 圖像增加水印
            add_word(download_path, upload_path)


            # 圖像上傳
            response = client.put_object_from_local_file(
                Bucket=to_bucket,
                LocalFilePath=upload_path.decode('utf-8'),
                Key=("upload-" + key).decode('utf-8')
            )

        except Exception as e:
            print(e)

此處說明一下，為什么要有兩個存儲桶？

因為我們要把一個存儲桶作為觸發 SCF 函數的「工具」，如果我們將水印結果再次寫回這個存儲桶，在不進行額外判斷和處理的前提下，那么這個水印后的圖片會再次水印，反反復復造成惡劣的循環，所以此處建立兩個存儲桶，可以降低難度，也可以保護性能，減少 BUG 誕生。

完整代碼如下：

# -*- coding: utf-8 -*-

from PIL import Image, ImageFont, ImageDraw
from qcloud_cos_v5 import CosConfig
from qcloud_cos_v5 import CosS3Client
from qcloud_cos_v5 import CosServiceError
from qcloud_cos_v5 import CosClientError

appid = **  # 請替換為您的 APPID
secret_id = ***'  # 請替換為您的 SecretId
secret_key = **'  # 請替換為您的 SecretKey
region = u'ap-chengdu'  # 請替換為您bucket 所在的地域
token = ''
to_bucket = 'tobucket-12567***'  # 請替換為您用于存放壓縮后圖片的bucket

config = CosConfig(Secret_id=secret_id, Secret_key=secret_key, Region=region, Token=token)
client = CosS3Client(config)

response = client.get_object(Bucket="mytestcos-12567***", Key="font.ttf", )
response['Body'].get_stream_to_file('/tmp/font.ttf')

def add_word(pic_path, save_path):
    # 打開圖片
    im = Image.open(pic_path).convert('RGBA')
    # 新建一個空白圖片,尺寸與打開圖片一樣
    txt = Image.new('RGBA', im.size, (0, 0, 0, 0))
    # 設置字體
    fnt = ImageFont.truetype("/tmp/font.ttf", 40)
    # 操作新建的空白圖片>>將新建的圖片添入畫板
    d = ImageDraw.Draw(txt)
    # 在新建的圖片上添加字體
    d.text((txt.size[0] - 220, txt.size[1] - 80), "By Dfounder", font=fnt,  fill=(255, 255, 255, 255))
    # 合并兩個圖片
    out = Image.alpha_composite(im, txt)
    # 保存圖像
    out.save(save_path)

def main_handler(event, context):
    for record in event['Records']:
        try:
            bucket = record['cos']['cosBucket']['name'] + '-' + str(appid)
            key = record['cos']['cosObject']['key']
            key = key.replace('/' + str(appid) + '/' + record['cos']['cosBucket']['name'] + '/', '', 1)
            download_path = '/tmp/{}'.format(key)
            upload_path = '/tmp/new_pic-{}'.format(key)

            # 下載圖片
            try:
                response = client.get_object(Bucket=bucket, Key=key, )
                response['Body'].get_stream_to_file(download_path)
            except CosServiceError as e:
                print(e.get_error_code())
                print(e.get_error_msg())
                print(e.get_resource_location())

            # 圖像增加水印
            add_word(download_path, upload_path)


            # 圖像上傳
            response = client.put_object_from_local_file(
                Bucket=to_bucket,
                LocalFilePath=upload_path.decode('utf-8'),
                Key=("upload-" + key).decode('utf-8')
            )

        except Exception as e:
            print(e)

這里面需要注意這幾個參數：appid、secret_id、secret_key、to_bucket

這幾個參數的來源如下：

而 secretid，secretkey 則需要在這里獲取：

測試

之前我已經上傳了一個測試圖片在這個 bucket 中，名字是：test.png

圖片是這樣子：

然后我們進行一下測試：

可以看到，已經測試成功，接下來我們可以去我們的目標 bucket 中看看：

可以看到成功生成了一個圖片：

可以看到圖片的右下角，有我們代碼中添加的水印：

到此，關于“如何用Serverless給網站圖片加水印”的學習就結束了，希望能夠解決大家的疑惑。理論與實踐的搭配能更好的幫助大家學習，快去試試吧！若想繼續學習更多相關知識，請繼續關注億速云網站，小編會繼續努力為大家帶來更多實用的文章！