1. Bu codelab hakkında
Last Updated: 2024-10-11
Yazan: Laurie White
Görüntü üretme
Dürüst olmak gerekirse, büyük dil modelleri (LLM) tarafından görüntü oluşturma eğlenceli olabilir. Elbette, istemden görsel oluşturmak için özelleştirilmiş reklamlardan ilgi çekici sunumlara kadar birçok iş uygulaması vardır. (Google Cloud web sitesinde, reklam öğesi aracılarını kullanan şirketlerin birçok özel kullanımı açıklanmaktadır.) Yine de "tarlada mutlu yeşil köpekler" resmi istediğinizde ne gibi sonuçlarla karşılaşacağınızı görmek oldukça eğlenceli olabilir.
Resim oluşturma ile profesyonel veya eğlence amaçlı (veya her ikisi için de) ilgileniyorsanız resim oluşturma programını kullanma ve bir web uygulamasına dağıtma arasında bazı zorluklar vardır. Bu laboratuvar, bu zorlukları aşmanıza yardımcı olacaktır.
Ne oluşturacaksınız?
Bu codelab'de, metin istemi alan ve bu istem kullanılarak oluşturulan bir resmin yer aldığı bir 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 bir not defterinden web uygulamasına taşımayla ilgili zorluklar
- Görüntü oluşturmak için Imagen'i kullanan bir Cloud Run uygulaması dağıtma
- Imagen'den HTML'ye resim ekleme
Bu codelab, Imagen ve dağıtıma odaklanmaktadır. Alakalı olmayan kavramlar ve kod blokları işaretlenmiştir ve yalnızca kopyalayıp yapıştırmanız için kullanımınıza sunulmuştur.
İhtiyacınız olanlar
- Chrome tarayıcının yeni bir sürümü.
- Cloud Run hakkında bilgi sahibi olmanız gerekir. Bu bilgileri 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 Düzenleyici hakkında daha fazla bilgiyi bu Codelab'de bulabilirsiniz.
- Faturalandırma özelliği etkinleştirilmiş bir Google Cloud projesi. Bu kılavuzda, nasıl proje oluşturacağınız gösterilmektedir. Ücretsiz katman ve ücretsiz deneme sunan çok sayıda ürün mevcuttur.
Bu codelab'in tüm kodunu https://github.com/Annie29/imagen-deployment adresinde bulabilirsiniz .
2. API'leri etkinleştir
Bu Codelab için kullanılacak bir proje seçin. İşiniz bittiğinde tüm çalışmalarınızı kaldırmayı kolaylaştı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'i 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ı olacaktır. Neyse ki basit Imagen kodu çalıştıran çeşitli not defterleri var. Bu not defterlerinden 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.
- Orijinal kopyayı kapatın (Yanlış kopyada çalışmamak için).
- Sağ üstteki Bağlan düğmesini tıklayarak bir çalışma zamanına bağlanmanız gerekir.
- Not defterindeki hücrelerin her birinde çalışmaya başlayın.
- Bir hücreyi çalıştırmak için hücrenin solundaki [] simgesini 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 kilitlendiğine 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'ın bunları sizin için koda eklemesini sağlayabilirsiniz.
- "Resim oluştur"a geldiğinizde Imagen'in neler yapabileceğini görebilirsiniz. İsteminizi değiştirip hücreyi yeniden çalıştırarak elde edebileceğiniz resim çeşitliliğini görebilirsiniz.
- Bu noktada, Imagen'in bir not defterinden nasıl resim oluşturabileceği hakkında iyi bir fikriniz olmalıdır. Resim parametreleri hakkında daha fazla bilgi edinmek için bu not defterini şimdi veya uygun bir zamanda tamamlayabilirsiniz.
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'u kullanacağız.
Python Flask uygulamaları aşağıdaki gibi bir klasörde kurulur:
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 içeren dosyalardır. main.py
, web sunucusu uygulamasının kendisidir ve requirements.txt
, main.py
'un kullandığı tüm standart olmayan kitaplıkların bir listesidir.
Uygulamada iki sayfa bulunur: İlk sayfa istem almak için, ikinci sayfa ise resmi görüntülemek ve kullanıcının başka bir istem girmesine izin vermek için kullanılır.
Öncelikle proje çerçevesini oluşturun.
Dosya yapısını oluşturma
Bu kod laboratuvarında, 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şıyarak daha fazla çalışma alanı elde edebilirsiniz:
Cloud Shell'deki ana dizininizde imageapp
klasörünü oluşturun, bu klasöre geçin ve templates
klasörlerini oluşturun. Bunu komut satırından veya Cloud Shell düzenleyicisinden yapabilirsiniz.
Şablonları oluşturma
Uygulamada iki sayfa bulunur: İlk sayfa (home.html
olarak adlandıracağız), istem almak için kullanılır. İkinci sayfa (display.html
olarak adlandıracağız) ise resmi görüntüler ve kullanıcının başka bir istem girmesine olanak tanır.
Cloud Shell düzenleyiciyi 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ı (home.html
) oluşturun. 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
olduğunu 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
öğesini ekleyin.
main.py
dosyası, web isteklerini sunacak kodu içerir. İşlememiz gereken yalnızca iki istek vardır: ana sayfa için bir GET
isteği ve oluşturmak istediğimiz resmi açıklayan formu gönderen bir POST
isteği.
Tercih ettiğiniz Cloud Shell düzenleyiciyi veya 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, uygulamanın neredeyse tamamı bu. display_image
dosyasında Python koduyla doldurulması gereken üç yorum var.
Eksik kısımları doldurmaya başlayalım. Flask, istemi almayı kolaylaştırır. Yorumdan sonra aşağıdaki 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
değerini (bir resmi gösteren geçerli bir URL) ayarlayabilirsiniz.
Örneğin: image_url="<your url here>"
Programı Cloud Shell'den yerel olarak çalıştırabilir (python main.py
komutunu kullanarak) ve ekranınızın sağ üst kısmındaki 8080 bağlantı noktasında önizle'yi kullanarak önizleyebilirsiniz.
Şu anda programın işleyiş şekliyle, resmi her zaman belirttiğiniz URL'de görürsünüz. Şimdi devam edip bu değerin uygulamadan nasıl alınacağını görelim. image_url
için statik bir değer veren satırı kaldırdığınızdan emin olun.
6. Resmi oluşturma
Google Cloud'da Vertex AI'da üretken yapay zeka için bir Python API'si vardır. Bunu kullanmak için programımızın üst kısmına, diğer içe aktarmalarla birlikte içe aktarma satırı eklememiz gerekir:
from vertexai.vision_models import ImageGenerationModel
vertexai
dosyasını requirements.txt
dosyasına ekleyin.
ImageGenerationModel'in belgelerinde nasıl kullanılacağı gösterilir. Bir model oluşturup istemle bu modelden resim oluşturacağız. İkinci adım için main.py
dosyasına kod ekleyin. Bu kod, resmi oluşturup response
dosyasında depolar:
# Code to generate the image
model = ImageGenerationModel.from_pretrained("imagegeneration@006")
response = model.generate_images(prompt=prompt)[0]
generate_images
parametresine gönderilen parametrelere bağlı olarak tek seferde en fazla 4 resim oluşturulabilir. Bu nedenle, döndürülen değer, bu durumda olduğu gibi yalnızca bir resim döndürülse bile GeneratedImage
öğelerinin bir listesi olur.
Şimdi resmi bir WWW sayfasında göstermemiz gerekiyor. GeneratedImage
, görüntüyü show
yöntemiyle döndürme özelliğine sahiptir ancak bu özellik yalnızca dizüstü bilgisayar ortamında çalışır. Ancak resmi kaydetme yöntemi vardır. Şablonu oluşturduğumuzda resmi kaydeder ve kaydedilen resmin URL'sini göndeririz.
Bu işlem biraz karmaşıktır ve birçok farklı şekilde yapılabilir. Adım adım, daha basit yaklaşımlardan birine göz atalım. (Görsel öğrenmeyi tercih ediyorsanız aşağıdaki adımları gösteren bir resim de verilmiştir.)
Öncelikle resmi kaydetmemiz gerekiyor. Peki, bu dosyanın adı ne olacak? Program aynı anda birçok kişi tarafından kullanılabileceğinden statik bir ad kullanırken sorun yaşanabilir. Her kullanıcı için ayrı resim adları oluşturabiliriz (UUID gibi bir şeyle). Ancak daha basit bir yöntem, Python'un tempfile
kitaplığını kullanmaktır. Bu kitaplık, benzersiz bir ada sahip geçici bir dosya oluşturur. Aşağıdaki kod, bir geçici dosya oluşturur, adını alır ve resim oluşturma adımını yanıtını geçici dosyaya yazar. Önce bir URL almamız gerektiğinden, 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
Kayıtlı dosyayı işlemenin birkaç yolu vardır ancak en basit ve en güvenli yöntemlerden biri veri URL'si kullanmaktır.
Veri URL'leri, yalnızca yolunu değil, asıl verileri URL'de göndermenize 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çmamız ve 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 oluşturmaz. Ardından, base64
kitaplığını kullanarak bu değeri, veri URL'sinde gönderebileceğimiz bir dize olarak kodlarız.
Üçüncü adımı (URL oluşturma) gerçekleştirmek için kullanacağımız nihai kod şu şekilde 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}"
Bu adımların tümünü aşağıdaki resimde görebilirsiniz:
Programınızın başında tempfile ve base64 dosyalarını içe aktarmanız gerekir.
import tempfile
import base64
main.py
ile klasörde olduğunuzdan emin olarak ve aşağıdaki 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 önizle'yi kullanarak önizleyebilirsiniz.
7. Sık karşılaşılan bir hata
Bir noktada, programı çalıştırırken (test ederken veya dağıttıktan sonra) aşağıdaki gibi bir mesaj aldığınızı fark edebilirsiniz:
Bunun nedeni büyük olasılıkla 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 yavru kediler" resimleri bulabilirsiniz.)
Bu hatayı gidermek için resmi oluşturmaya çalışırken ortaya çıkan istisnayı yakalayacak kod ekleyeceğiz. Varsa home.html
şablonunu bir mesaj gösterilecek şekilde tekrar oluşturuyoruz.
Öncelikle, home.html şablonuna bir hata oluştuğunda gösterilecek ilk formdan sonra 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 kodunu çağırı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 sorumlu yapay zeka özelliklerinden yalnızca biri. Resimlerdeki çocukların ve çocukların bulunduğu durumların korunmasını sağlayan çeşitli özellikler ve genel filtreler vardır. Bu konular hakkında daha fazla bilgiyi burada bulabilirsiniz.
8. Uygulamayı web'e dağıtma
Cloud Shell'deki imageapp
klasöründeki komutu kullanarak uygulamayı 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
Başvurunuzu nerede bulabileceğinizi 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 depolamak için ücretlendirilebilirsiniz. Ücret ödememek için deponuzu veya Cloud projenizi silebilirsiniz. Cloud projenizi sildiğinizde, söz konusu projede kullanılan tüm kaynakların faturalandırması durdurulur.
Kapsayıcı resim 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ı başarıyla oluşturdunuz. Bu özelliği başvurunuzda nasıl kullanabilirsiniz?
Sırada ne var?
Bu codelab'lerden bazılarına göz atın...
- Üretken yapay zeka: Anahtar kelimelerden resim oluşturma
- Spanner ve Vertex AI Imagen API ile Üretken Yapay Zeka'ya veri aktarma