Imagen'i Cloud Run'a dağıtma

1. Bu codelab hakkında

Last Updated: 2024-10-11

Yazan: Laurie White

Görüntü üretme

Dürüst olalım: Büyük dil modelleri (LLM) tarafından görüntü üretmek eğlenceli olabilir. Elbette, istemden görüntü oluşturma konusunda özelleştirilmiş reklamcılıktan ilgi çekici sunumlara kadar birçok işletme uygulaması vardır. (Google Cloud web sitesinde, Creative Agents'ı kullanan şirketlerin birçok özel kullanım alanı vardır.) Bununla birlikte, "bir tarlada mutlu yeşil köpekler" resmi istediğinizde ne gibi sonuçlar elde ettiğinizi görmek oldukça eğlenceli olabilir.

İster profesyonel ister eğlence amaçlı (veya her ikisi için de) görüntü üretimiyle ilgileniyor olun, görüntü üretme programı kullanmak ile bu programı bir web uygulamasına dağıtmak arasında bazı zorluklar vardır. Bu laboratuvar, bu zorlukların üstesinden gelmenize yardımcı olacaktır.

Ne oluşturacaksınız?

Bu codelab'de, metin istemi alıp bu istem kullanılarak oluşturulan bir görüntünün yer aldığı web sayfası döndüren bir uygulama oluşturacaksınız.

Neler öğreneceksiniz?

Bu laboratuvarda şunları öğreneceksiniz:

Not defteri ortamlarında metin istemlerinden resim oluşturmak için Google Imagen'i kullanma
Imagen kodunu not defterinden web uygulamasına taşıma zorlukları
Imagen'i kullanarak resim oluşturan bir Cloud Run uygulamasını dağıtma
Imagen'dan alınan bir resmi HTML'ye ekleme

Bu codelab, Imagen ve dağıtımına odaklanmaktadır. Alakalı olmayan kavramlar ve kod blokları işaretlenmiştir ve yalnızca kopyalayıp yapıştırmanız için paylaşılmıştır.

İhtiyacınız olanlar

Chrome tarayıcının yeni bir sürümü
Cloud Run hakkında bilgi sahibi olmanız gerekir. Bu bilgiyi buradaki oldukça kısa codelab'den edinebilirsiniz.
Cloud Shell veya Cloud Shell Düzenleyici'de dosya düzenleme konusunda bilgi sahibi olmanız gerekir. Cloud Shell ve Cloud Shell Editor hakkında daha fazla bilgiyi bu Codelab'den edinebilirsiniz.
Faturalandırmanın etkin olduğu bir Google Cloud projesi. Bu kılavuzda nasıl proje oluşturacağınız gösterilmektedir. Ücretsiz katmanlar ve ücretsiz denemeler sunan çok sayıda ürün vardır.

Bu codelab'in tam kodu https://github.com/Annie29/imagen-deployment adresinde mevcuttur .

2. API'leri etkinleştir

Bu Codelab'de kullanılacak bir proje seçin. Çalışmanız bittiğinde tüm işlerinizi kolayca kaldırmak için yeni bir proje oluşturabilirsiniz.

Imagen'i kullanmaya başlamadan önce bazı API'leri etkinleştirmeniz gerekir.

Google Cloud Console'a gidin.
Vertex AI kontrol paneline gidin.
"Önerilen Tüm API'leri Etkinleştir"i seçin.

3. Google Imagen'i keşfetme (isteğe bağlı)

Imagen'ı biliyorsanız bu bölümü atlayabilirsiniz.

Imagen'i kullanan bir web uygulaması oluşturmaya çalışmadan önce Imagen'in neler yapabileceğini görmek faydalıdır. Neyse ki basit Imagen kodu çalıştıran bir dizi not defteri var. Bu nedenle, bunlardan biriyle başlayalım.

https://github.com/GoogleCloudPlatform/generative-ai/blob/main/vision/getting-started/image_generation.ipynb adresindeki not defterine gidin .
Not defterini Google'ın not defteri sunucusunda açmak için Colab'da aç'ı seçin.
Bu not defterinin kendi kopyanızı oluşturmak için "Dosya -> Drive'a bir kopya kaydet"i seçin veya sayfanın üst kısmındaki "Drive'a kopyala"yı tıklayın.
Yanlış kopyada çalışmamak için orijinal kopyayı kapatın.
Sağ üstteki Bağlan düğmesini tıklayarak bir çalışma zamanına bağlanmanız gerekir.
Not defterindeki hücrelerin her birini incelemeye başlayın.
Bir hücreyi çalıştırmak için hücrenin solundaki [] veya oku tıklayabilir ya da Çalışma Zamanı menüsündeki Seçimi Çalıştır seçeneğini (veya kısayolunu) kullanabilirsiniz:
Mevcut çalışma zamanını yeniden başlattığınızda sisteminizin çöktüğüne dair bir mesaj alırsınız. Paniğe kapılmayın. Normal bir durumdur.
Not defteri ortamınızın kimliğini doğrulamanız gerekir.
Proje kimliğinizi (ad değil) ve konumunuzu (konum ayarlamadıysanız us-central1 çalışır) kodun sağındaki kutulara girebilir ve Colab'in bunları sizin için koda eklemesini sağlayabilirsiniz.
"Resim oluşturma" bölümüne geldiğinizde Imagen'in neler yapabileceğini görme fırsatı bulacaksınız. İstemleri değiştirmekten ve hücreyi yeniden çalıştırarak elde edebileceğiniz resim çeşitliliğini görmekten çekinmeyin.
Bu noktada, Imagen'in not defterinden nasıl resim oluşturabileceği hakkında iyi bir fikriniz olmalıdır. Görüntü parametreleri hakkında daha fazla bilgi edinmek için bu not defterini hemen veya uygun bir zamanda doldurabilirsiniz.

4. Resim göstermek için web uygulaması oluşturmaya başlama

Uygulamamızı oluşturmak için Cloud Run'da Flask çerçevesini kullanarak Python'ı kullanacağız.

Python Flask uygulamaları, klasörde aşağıdaki gibi ayarlanır:

app-folder
    templates
        template.html
        (etc.)
        anothertemplate.html
    main.py
    requirements.txt

Şablonlar, genellikle programın oluşturulan metni ekleyeceği adlandırılmış yer tutucular içeren HTML dosyalarıdır. main.py, web sunucusu uygulamasının kendisidir ve requirements.txt, main.py tarafından kullanılan tüm standart olmayan kitaplıkların listesidir.

Uygulama iki sayfadan oluşacak. Birinci sayfada istem alınacak, ikinci sayfada ise resim gösterilecek ve kullanıcının başka bir istem girmesine izin verilecek.

Öncelikle proje çerçevesini oluşturun.

Dosya yapısını oluşturma

Bu codelab'de projenizin imageapp klasöründe olduğu varsayılır. Farklı bir ad kullanıyorsanız komutları uygun şekilde güncellediğinizden emin olun.

Ekranın sağ üst kısmındaki istem simgesini seçerek Cloud Shell'e girin.

Kabuk penceresinin üst kısmındaki oku kullanarak kabuğu yeni bir sekmeye taşırsanız daha fazla çalışma alanı elde edebilirsiniz:

Cloud Shell'deki ana dizininizden imageapp klasörünü oluşturun, bu klasöre geçin ve templates klasörlerini oluşturun. Bu işlemi komut satırından veya Cloud Shell düzenleyicisinden yapabilirsiniz.

Şablonları oluşturma

Uygulama iki sayfadan oluşacak. Birinci sayfada (home.html olarak adlandıracağız) istem alınacak, ikinci sayfada (display.html olarak adlandıracağız) ise resim gösterilecek ve kullanıcının başka bir istem girmesine izin verilecek.

Cloud Shell Düzenleyici'yi veya tercih ettiğiniz Linux düzenleyiciyi kullanarak iki şablon oluşturun. imageapp/templates klasöründe, kullanıcının göreceği ilk sayfayı oluşturun home.html. Kullanıcının girdiği açıklamayı döndürmek için prompt değişkenini kullanır.

templates/home.html

<!DOCTYPE html>
<html>
   <head>
       <title>Let's draw a picture</title>
   </head>
   <body>
       <h1>Let's draw a picture</h1>
       <form  action="/" method="post" >
           <input type="text" id="prompt" name="prompt">
           <input type="submit" value="Send">
       </form>
   </body>
</html>

Ardından, resmi gösterecek display.html öğesini oluşturun. Resmin konumunun image_url olacağını unutmayın.

templates/display.html

<!DOCTYPE html>
<html>
   <head>
       <title>Let's draw a picture</title>
   </head>
   <body>
       <h1>Let's draw a picture</h1>

       <div>
           <form  action="/" method="post" >
               <input type="text" id="prompt" name="prompt">
               <input type="submit" value="Send">
           </form>

           <p></p>
       </div>

       <div id="picture">
           <img id="pict" name="pict" alt="The created image" src="{{image_uri}}" style="width:100%;">
       </div>

   </body>
</html>

5. Kodu başlatma

Programınızın ihtiyaç duyduğu tüm kitaplıkların kullanılabilir olduğundan emin olmak için requirements.txt dosyasını oluşturmanız gerekir. Şimdilik requirements.txt dosyasına yalnızca flask ayarını ekleyin.

main.py dosyası, web isteklerine hizmet edecek kodu içerir. Yalnızca iki isteği işlememiz gerekir: ana sayfa için bir GET isteği ve oluşturulmasını istediğimiz resmi açıklayan formu gönderen bir POST isteği.

Cloud Shell düzenleyiciyi veya tercih ettiğiniz Linux düzenleyiciyi kullanarak imageapp klasöründe main.py dosyasını oluşturun. Aşağıdaki iskeletle başlayacağız:

main.py

import flask

app = flask.Flask(__name__)

@app.route("/", methods=["GET"])
def home_page():
    return flask.render_template("home.html")

@app.route("/", methods=["POST"])
def display_image():
    # Code to get the prompt (called prompt) from the submitted form
    # Code to generate the image
    # Code to create a URL for the image (called image_url)

    return flask.render_template("display.html", prompt=prompt, image_url=image_url)

# Initialize the web server app when the code locally (Cloud Run handles it in that environment)
if __name__ == "__main__":
    app.run(debug=True, host="0.0.0.0", port=8080)

Aslında bu, uygulamanın neredeyse tamamı. display_image içinde Python koduyla doldurulması gereken üç yorum var.

Eksik kısımları doldurmaya başlayalım. Flask, istemi almayı kolaylaştırır. Yorumun ardından aşağıdaki örnekte gösterildiği gibi bir satır ekleyin:

# Code to get the prompt (called prompt) from the submitted form
prompt = flask.request.form["prompt"]

Uygulamayı hemen test etmek istiyorsanız display_image içindeki return ifadesinden önce bir satır ekleyerek image_url'ye (bir resme yönlendiren geçerli bir URL) değer atayabilirsiniz.

Örneğin: image_url="<your url here>"

Programı Cloud Shell'den (python main.py komutunu kullanarak) yerel olarak çalıştırabilir ve ekranınızın sağ üst kısmındaki 8080 bağlantı noktasında önizleme seçeneğini kullanarak önizleyebilirsiniz.

Programın mevcut sürümünde, sağladığınız URL'deki resmi her zaman görürsünüz. Devam edelim ve bu değeri uygulamadan nasıl alacağımızı görelim. image_url değerini statik olarak veren satırı kaldırmayı unutmayın.

6. Görüntü oluşturma

Google Cloud'da Vertex AI'da üretken yapay zeka için Python API'si bulunur. Kullanmak için programımızın üst kısmına yakın bir yere, diğer içe aktarma işlemlerinin yanına bu kitaplığı içe aktaran bir satır eklememiz gerekir:

from vertexai.vision_models import ImageGenerationModel

ve vertexai dosyasını requirements.txt dosyasına ekleyin.

ImageGenerationModel'in belgelerinde nasıl kullanılacağı açıklanır. Bir model oluşturup isteme göre bu modelden resim üretiriz. İkinci adım için main.py'ya kod ekleyin. Bu adımda resim oluşturulur ve response'de depolanır:

# Code to generate the image
model = ImageGenerationModel.from_pretrained("imagegeneration@006")
response = model.generate_images(prompt=prompt)[0]

generate_images'ya gönderilen parametrelere bağlı olarak aynı anda en fazla 4 resim oluşturulabilir. Bu nedenle, döndürülen değer, bu örnekte olduğu gibi yalnızca bir resim döndürülse bile GeneratedImage listesi olur.

Şimdi de resmi bir WWW sayfasında göstermemiz gerekiyor. GeneratedImage, görüntüyü show için bir yönteme sahiptir ancak bu yöntem yalnızca not defteri ortamında çalışır. Ancak resmi kaydetmenin bir yolu vardır. Resmi kaydederiz ve şablonu oluşturduğumuzda kaydedilen resmin URL'sini göndeririz.

Bu biraz karmaşık bir işlemdir ve bunu yapmanın birçok yolu vardır. Şimdi daha basit yaklaşımlardan birine adım adım göz atalım. (Görsel öğrenmeyi tercih ediyorsanız aşağıdaki adımların resmini de inceleyebilirsiniz.)

Öncelikle resmi kaydetmemiz gerekir. Peki bu yeni özellik ne olarak adlandırılacak? Program aynı anda birçok kişi tarafından kullanılabileceğinden statik ad kullanmak sorunlara yol açabilir. Her kullanıcı için ayrı resim adları oluşturabilsek de (ör. UUID ile), daha basit bir yöntem olarak Python'ın tempfile kitaplığını kullanabiliriz. Bu kitaplık, benzersiz bir ada sahip geçici bir dosya oluşturur. Aşağıdaki kod, geçici bir dosya oluşturur, dosyanın adını alır ve görüntü üretme adımının yanıtını geçici dosyaya yazar. Önce bir URL almamız gerektiğinden bu kodu henüz kodumuza girmeyeceğiz.

with tempfile.NamedTemporaryFile("wb") as f:
    filename = f.name
    response.save(filename, include_generation_parameters=False)
    # process the saved file here, before it goes away

Kaydedilen dosyayı işlemenin çeşitli yolları vardır ancak en basit ve güvenli yöntemlerden biri veri URL'si kullanmaktır.

Veri URL'leri, yalnızca bir yol değil, gerçek verilerin URL'de gönderilmesine olanak tanır. Veri URL'sinin söz dizimi:

data:[image/png][;base64],<data>

Resmin base64 kodlamasını almak için tempfile tarafından kaydedilen dosyayı açıp bir değişkene okumamız gerekir. Evet, bu büyük bir dize olacaktır ancak modern tarayıcılar ve sunucular için sorun teşkil etmez. Ardından, bunu veri URL'sinde gönderebileceğimiz bir dizeye kodlamak için base64 kitaplığını kullanırız.

Üçüncü adımı (URL oluşturma) gerçekleştirmek için son kodumuz şu olacaktır:

# Code to create a URL for the image (called image_url)
with tempfile.NamedTemporaryFile("wb") as f:
    filename = f.name
    response.save(filename, include_generation_parameters=False)
    # process the saved file here, before it goes away
    with open(filename, "rb") as image_file:
        binary_image = image_file.read()
        base64_image = base64.b64encode(binary_image).decode("utf-8")
        image_url = f"data:image/png;base64,{base64_image}"

Tüm bu adımları aşağıdaki resimde görebilirsiniz:

Programınızın başında tempfile ve base64'ü içe aktarmanız gerekir.

import tempfile
import base64

main.py içeren klasörde olduğunuzdan emin olarak ve şu komutu çalıştırarak programınızı Cloud Shell'den çalıştırmayı deneyin:

python main.py

Ardından, ekranınızın sağ üst kısmındaki 8080 bağlantı noktasında önizleme seçeneğini kullanarak önizleyebilirsiniz.

7. Sık karşılaşılan bir hata

Bir noktada, programı çalıştırırken (test sırasında veya dağıttıktan sonra) aşağıdaki gibi bir mesaj aldığınızı fark edebilirsiniz:

Bu durumun en olası nedeni, Google'ın Sorumlu Yapay Zeka Uygulamaları'nı ihlal eden bir istemdir . "Renkli toplarla oynayan yavru kediler" gibi basit bir istem bu soruna neden olabilir. (Ancak endişelenmeyin, "renkli oyuncaklarla oynayan kedi yavruları" resimleri alabilirsiniz.)

Bu hatayı gidermek için, resmi oluşturmaya çalıştığımızda oluşan istisnayı yakalayacak kodu ekleyeceğiz. Varsa home.html şablonunu mesaj göstererek tekrar oluştururuz.

Öncelikle, hata varsa görüntülenecek ilk formdan sonra home.html şablonuna bir div ekleyelim:

<!DOCTYPE html>
<html>
   <head>
       <title>Let's draw a picture</title>
   </head>
   <body>
       <h1>Let's draw a picture</h1>
       <form  action="/" method="post" >
           <input type="text" id="prompt" name="prompt">
           <input type="submit" value="Send">
       </form>
       {% if mistake %}
       <div id="warning">
       The prompt contains sensitive words that violate
       <a href=\"https://ai.google/responsibility/responsible-ai-practices\">
           Google's Responsible AI practices</a>.
       Try rephrasing the prompt."</div>

       {% endif %}

   </body>
</html>

Ardından, display_image içinde generate_images kodu çağrılırken olası bir istisnayı yakalamak için main.py içine kod ekleyin. Bir istisna varsa kod, home.html şablonunu bir mesajla oluşturur.

# Code to generate the image
   model = ImageGenerationModel.from_pretrained("imagegeneration@006")
   try:
       response = model.generate_images(prompt=prompt)[0]   
   except:
       #  This is probably due to a questionable prompt
       return flask.render_template("home.html", warning=True)

Bu, Imagen'in tek Sorumlu Yapay Zeka özelliği değildir. İnsanların ve çocukların oluşturulmasını koruyan ve resimlerde genel filtreler uygulayan çeşitli özellikler vardır. Bu konu hakkında daha fazla bilgiyi burada bulabilirsiniz.

8. Uygulamayı web'e dağıtma

Uygulamayı, Cloud Shell'deki imageapp klasöründeki komutu kullanarak web'e dağıtabilirsiniz. Komutta gerçek proje kimliğinizi kullandığınızdan emin olun.

gcloud run deploy imageapp \
  --source . \
  --region us-central1 \
  --allow-unauthenticated \
  --project your-project-id

Uygulamanızı nerede bulacağınızı belirten aşağıdaki gibi bir yanıt görürsünüz:

Service [imageapp] revision [imageapp-00001-t48] has been deployed and is serving 100 percent of traffic.
Service URL: https://imageapp-708208532564.us-central1.run.app```

9. Temizleme

Cloud Run, hizmet kullanılmadığında ücret almaz ancak container görüntüsünü Artifact Registry'de depoladığınız için ücretlendirilebilirsiniz. Ücretlendirilmemek için deponuzu veya Cloud projenizi silebilirsiniz. Cloud projenizi sildiğinizde, bu projede kullanılan tüm kaynaklar için faturalandırma durdurulur.

Kapsayıcı resmi deponuzu silmek için:

gcloud artifacts repositories delete cloud-run-source-deploy \
  --location $REGION

Cloud Run hizmetinizi silmek için:

gcloud run services delete imageapp \
  --platform managed \
  --region $REGION

Google Cloud projenizi silmek için:

Mevcut proje kimliğinizi alın:

PROJECT_ID=$(gcloud config get-value core/project)

Silmek istediğiniz projenin bu olduğundan emin olun:

echo $PROJECT_ID

Projeyi silme:

gcloud projects delete $PROJECT_ID

10. Tebrikler

Tebrikler! Imagen tarafından oluşturulan resimleri gösterecek bir web uygulamasını başarıyla oluşturdunuz. Bunu uygulamanızda nasıl kullanabilirsiniz?

Yapabilecekleriniz

Şu codelab'lere göz atın: