برنامه نویسی

ساختن ویرایشگر تصویر با هوش مصنوعی با API Gemini Google

مقدمه

هوش مصنوعی در حال تغییر ویرایش تصویر است و به کاربران اجازه می دهد تصاویر را بر اساس ارسال های متن تقویت و اصلاح کنند. در این وبلاگ ، ما بررسی خواهیم کرد که چگونه من ساختم ویرایشگر تصویر جمینی، الف node.js برنامه ای که اعمال می شود API جمینی گوگل برای ویرایش تصاویر با هوش مصنوعی.

این پروژه به کاربران امکان می دهد یک تصویر را بارگذاری کنند ، اصلاحات را توصیف کنند و یک نسخه AI-Enhed دریافت کنند.

بررسی اجمالی پروژه

در ویرایشگر تصویر جمینی یک API REST است که پشتیبانی می کند:

بارگذاری تصاویر و اعمال اصلاحات

ادغام API Google Gemini برای ویرایش هوش مصنوعی.

اقدام بارگذاری پرونده مولربشر

Express.js باکتری با نقاط پایانی API با استفاده آسان.

پشته فنی

  • node.js – زمان اجرا پس زمینه
  • express.js – چارچوب وب
  • Google Generative AI SDK – اصلاح تصویر
  • پروانه – رسیدگی به بارگذاری پرونده
  • دوتنوف – متغیرهای محیط

شروع

1. مخزن را کلون کنید

git clone https://github.com/manthanank/gemini-image-editor.git
cd gemini-image-editor
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

2. وابستگی ها را نصب کنید

npm install
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

3. متغیرهای محیط را پیکربندی کنید

ایجاد a .env پرونده خود را اضافه کنید کلید API Google Gemini:

GEMINI_API_KEY=your_google_gemini_api_key
PORT=5000
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

4. سرور را شروع کنید

npm start
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

سرور شما در http: // localhost: 5000 🚀 اجرا می شود


نقاط پایانی API

یک تصویر را اصلاح کنید

📌 نقطه پایانی: POST /api/image/modify

📌 بدنه درخواست:

  • prompt (رشته): دستورالعمل های اصلاح
  • image (پرونده): تصویر برای اصلاح

📌 پاسخ:

{
  "message": "Image modified successfully",
  "imagePath": "uploads/modified_1710342456.png"
}
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

ساختار پروژه

gemini-image-editor/
├── controllers/       # Business logic
├── middleware/        # Multer file upload
├── routes/            # API endpoints
├── services/          # Google Gemini AI logic
├── uploads/           # Stores images
├── server.js          # Entry point
├── package.json       # Dependencies
└── .env               # Environment variables
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید


اجرای اصلی

1. تنظیم سرور اکسپرس

در server.js پرونده برنامه را آغاز می کند و تضمین می کند uploads/ دایرکتوری وجود دارد:

const app = require("./app");
const { port } = require("./config/env");
const fs = require("fs");

// Ensure uploads directory exists
if (!fs.existsSync("uploads")) {
  fs.mkdirSync("uploads");
}

app.listen(port, () => {
  console.log(`Server running on http://localhost:${port}`);
});
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

2. رسیدگی به بارگذاری و اصلاح تصویر

در imageController.js پرونده درخواست ها را مدیریت می کند:

const { modifyImage } = require("../services/geminiService");

async function modifyImageController(req, res) {
  const { prompt } = req.body;
  const imageFile = req.file;

  if (!prompt || !imageFile) {
    return res.status(400).json({ error: "Prompt and image are required" });
  }

  try {
    const modifiedImagePath = await modifyImage(prompt, imageFile.path);
    res.status(200).json({ message: "Image modified successfully", imagePath: modifiedImagePath });
  } catch (error) {
    res.status(500).json({ error: error.message });
  }
}

module.exports = { modifyImageController };
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

3. Multer Middleware برای بارگذاری پرونده ها

در uploadMiddleware.js پرونده تنظیم می شود پروانه برای ذخیره تصاویر در uploads/:

const multer = require("multer");
const path = require("path");

const storage = multer.diskStorage({
  destination: (req, file, cb) => {
    cb(null, "uploads/");
  },
  filename: (req, file, cb) => {
    cb(null, Date.now() + path.extname(file.originalname));
  },
});

const upload = multer({ storage });

module.exports = upload;
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید

4. ادغام API Google Gemini

در geminiService.js پرونده به جمینی متصل می شود و تصویر را اصلاح می کند:

const { GoogleGenerativeAI } = require("@google/generative-ai");
const fs = require("fs");
const { geminiApiKey } = require("../config/env");

const genAI = new GoogleGenerativeAI(geminiApiKey);

async function modifyImage(prompt, imagePath) {
  const imageData = fs.readFileSync(imagePath);
  const base64Image = imageData.toString("base64");

  const contents = [
    { text: prompt },
    {
      inlineData: {
        mimeType: "image/png",
        data: base64Image,
      },
    },
  ];

  const model = genAI.getGenerativeModel({
    model: "gemini-2.0-flash-exp-image-generation",
    generationConfig: {
      responseModalities: ["Text", "Image"],
    },
  });

  try {
    const response = await model.generateContent(contents);
    for (const part of response.response.candidates[0].content.parts) {
      if (part.inlineData) {
        const imageData = part.inlineData.data;
        const buffer = Buffer.from(imageData, "base64");
        const outputPath = `uploads/modified_${Date.now()}.png`;
        fs.writeFileSync(outputPath, buffer);
        return outputPath;
      }
    }
  } catch (error) {
    console.error("Error modifying image:", error);
    throw new Error("Failed to modify image");
  }
}

module.exports = { modifyImage };
حالت تمام صفحه را وارد کنید

از حالت تمام صفحه خارج شوید


پایان

با Node.js ، Express ، Multer و Google Gemini API، ما یک ساخته شده ایم ویرایشگر تصویر AI که به کاربران امکان می دهد تصاویر را بارگذاری کنید ، با استفاده از متن متن ، اصلاحات را اعمال کنید و نسخه های پیشرفته ای را دریافت کنیدبشر 🚀

🔹 پیشرفت های بالقوه:

🔹 اضافه کردن UI Frontend با زاویه دار برای یک تجربه کاربر تعاملی.

🔹 پشتیبانی انباره ابری برای مدیریت بهتر تصویر.

multile چند اجازه دهید اصلاحات در یک درخواستبشر

👉 آماده کشف ویرایش تصویر با هوش مصنوعی هستید؟ مخزن GitHub را امتحان کنید!

نوشته های مشابه

دیدگاهتان را بنویسید

نشانی ایمیل شما منتشر نخواهد شد. بخش‌های موردنیاز علامت‌گذاری شده‌اند *

دکمه بازگشت به بالا