Rumah >hujung hadapan web >tutorial js >Menambah GenAI pada Aplikasi Sudut Menggunakan AWS Bedrock

Menambah GenAI pada Aplikasi Sudut Menggunakan AWS Bedrock

PHPz
PHPzasal
2024-08-09 02:32:22816semak imbas

Adding GenAI to Angular Application Using AWS Bedrock

Mengintegrasikan AI ke dalam aplikasi web telah menjadi semakin berleluasa. AWS Bedrock menawarkan platform yang berkuasa untuk mengakses dan memanfaatkan model asas (FM) untuk membina aplikasi AI generatif. Artikel ini akan membimbing anda melalui memasukkan keupayaan AI ke dalam aplikasi Angular anda menggunakan AWS Bedrock.

Prasyarat

  • Pemahaman asas Sudut dan TypeScript.
  • Akaun AWS dengan kebenaran yang diperlukan.
  • Node.js dan npm (atau benang) dipasang.
  • Projek Sudut disediakan.

Panduan Langkah demi Langkah

Artikel ini akan membimbing anda melalui memasukkan keupayaan AI ke dalam aplikasi Angular anda menggunakan AWS Bedrock.

1. Menyediakan AWS Bedrock

  • Buat akaun AWS: Jika anda tidak mempunyai akaun, buat akaun AWS.
  • Sediakan peranan IAM: Cipta peranan IAM dengan kebenaran yang diperlukan untuk mengakses AWS Bedrock dan perkhidmatan lain yang diperlukan.
  • Pilih model asas: AWS Bedrock menawarkan pelbagai model asas daripada pembekal yang berbeza. Pilih model yang paling sesuai dengan keperluan aplikasi anda.

2. Mencipta Fungsi AWS Lambda

  • Buat fungsi Lambda baharu: Gunakan Konsol Pengurusan AWS atau AWS CLI untuk mencipta fungsi Lambda baharu.
  • Pilih masa jalan Node.js: Pilih Node.js sebagai masa jalan untuk fungsi anda.
  • Tulis kod fungsi Lambda: Kod ini akan berinteraksi dengan AWS Bedrock API untuk menghantar gesaan dan menerima respons.
const AWS = require('aws-sdk');

const bedrockClient = new AWS.Bedrock({ region: 'us-east-1' }); // Replace with your region

exports.handler = async (event) => {
  const prompt = event.prompt;

  const params = {
    modelId: 'YOUR_MODEL_ID', // Replace with your model ID
    inputText: prompt
  };

  try {
    const response = await bedrockClient.generateText(params).promise();
    return response.text;
  } catch (error) {
    console.error(error);
    throw error;
  }
};
  • Konfigurasikan fungsi: Tetapkan peranan IAM dan pembolehubah persekitaran yang sesuai.

3. Mencipta Perkhidmatan Sudut

Jana perkhidmatan Sudut baharu: Gunakan CLI Sudut untuk mencipta perkhidmatan baharu untuk mengendalikan interaksi dengan fungsi Lambda.

ng generate service bedrock
  • Suntikan HttpClient: Suntikan HttpClient untuk membuat permintaan HTTP ke fungsi Lambda.
  • Buat kaedah untuk memanggil fungsi Lambda: Kaedah ini akan menghantar gesaan kepada fungsi Lambda dan mengembalikan respons.
import { Injectable } from '@angular/core';
import { HttpClient } from '@angular/common/http';

@Injectable({
  providedIn: 'root'
})
export class BedrockService {
  constructor(private http: HttpClient) {}

  generateText(prompt: string) {
    return this.http.post<string>('https://your-lambda-function-endpoint', { prompt });
  }
}

4. Mengintegrasikan AI ke dalam Komponen Sudut Anda

  • Import perkhidmatan Batuan Dasar: Import perkhidmatan Batuan Dasar ke dalam komponen anda.
  • Buat borang atau medan input: Benarkan pengguna memasukkan teks sebagai gesaan.
  • Panggil perkhidmatan Batuan Dasar: Apabila pengguna menyerahkan gesaan, hubungi perkhidmatan Batuan Dasar untuk menjana teks.
  • Paparkan teks yang dijana: Paparkan teks yang dijana dalam paparan komponen anda.
import { Component } from '@angular/core';
import { BedrockService } from './bedrock.service';

@Component({
  selector: 'app-my-component',
  templateUrl: './my-component.component.html',
  styleUrls: ['./my-component.component.css']
})
export class MyComponent {
  prompt: string = '';
  generatedText: string = '';

  constructor(private bedrockService: BedrockService) {}

  generate() {
    this.bedrockService.generateText(this.prompt)
      .subscribe(text => {
        this.generatedText = text;
      });
  }
}

Kesimpulan:

Dengan mengikuti langkah-langkah ini, anda boleh berjaya menyepadukan keupayaan AI ke dalam aplikasi Angular anda menggunakan AWS Bedrock. Penyepaduan ini boleh meningkatkan pengalaman pengguna, mengautomasikan tugasan dan membuka kunci kemungkinan baharu untuk aplikasi anda.

Nota: Gantikan ruang letak seperti YOUR_MODEL_ID dan https://your-lambda-function-endpoint dengan nilai sebenar.

Atas ialah kandungan terperinci Menambah GenAI pada Aplikasi Sudut Menggunakan AWS Bedrock. Untuk maklumat lanjut, sila ikut artikel berkaitan lain di laman web China PHP!

Kenyataan:
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn