Generative AI has transformed how developers build intelligent applications. From content generation and code suggestions to chatbots and personalized recommendations, generative AI enables web applications to provide dynamic and context-aware responses.

In this article, we will explore how to integrate generative AI in ASP.NET Core web applications, focusing on architecture, AI integration, security, and best practices.

1. Understanding Generative AI

Generative AI refers to models capable of producing new content such as text, images, or audio based on input data or prompts. Examples include:

Benefits for web applications:

2. Architecture Overview

A typical ASP.NET Core web app with generative AI looks like this:

Angular / Blazor / React Frontend
        |
        | HTTP / WebSocket
        v
ASP.NET Core Web API
        |
        | AI Service (External API / Internal Model)
        v
Generative AI Model (OpenAI, Azure OpenAI, ML.NET, HuggingFace)

3. Selecting a Generative AI Model

  1. External API Providers

  1. Internal Models

Recommendation: Use external APIs for production-ready capabilities unless data privacy requires on-premise deployment.

4. ASP.NET Core Backend Integration

4.1 Installing Dependencies

Use HttpClientFactory for robust API calls:

builder.Services.AddHttpClient<IAiService, OpenAiService>();

4.2 AI Service Interface

public interface IAiService
{
    Task<string> GenerateTextAsync(string prompt);
}

4.3 AI Service Implementation (OpenAI Example)

public class OpenAiService : IAiService
{
    private readonly HttpClient _httpClient;
    private readonly IConfiguration _config;

    public OpenAiService(HttpClient httpClient, IConfiguration config)
    {
        _httpClient = httpClient;
        _config = config;
    }

    public async Task<string> GenerateTextAsync(string prompt)
    {
        var request = new
        {
            model = "gpt-4",
            prompt = prompt,
            max_tokens = 200
        };

        var response = await _httpClient.PostAsJsonAsync("https://api.openai.com/v1/completions", request);
        response.EnsureSuccessStatusCode();

        var content = await response.Content.ReadFromJsonAsync<JsonElement>();
        return content.GetProperty("choices")[0].GetProperty("text").GetString();
    }
}

4.4 API Endpoint for Frontend

[ApiController]
[Route("api/[controller]")]
public class AiController : ControllerBase
{
    private readonly IAiService _aiService;

    public AiController(IAiService aiService)
    {
        _aiService = aiService;
    }

    [HttpPost("generate")]
    public async Task<IActionResult> Generate([FromBody] AiRequest request)
    {
        if (string.IsNullOrWhiteSpace(request.Prompt))
            return BadRequest("Prompt cannot be empty.");

        var result = await _aiService.GenerateTextAsync(request.Prompt);
        return Ok(new { text = result });
    }
}

AiRequest DTO:

public class AiRequest
{
    public string Prompt { get; set; }
}

5. Angular Frontend Implementation

5.1 Form to Collect User Input

<form [formGroup]="aiForm" (ngSubmit)="submitPrompt()">
  <textarea formControlName="prompt" placeholder="Enter prompt"></textarea>
  <button type="submit">Generate</button>
</form>

<div *ngIf="generatedText">
  <h3>Generated Output:</h3>
  <p>{{generatedText}}</p>
</div>

5.2 Calling API

submitPrompt() {
  const prompt = this.aiForm.value.prompt;
  this.http.post<{text: string}>('/api/ai/generate', { prompt })
    .subscribe(res => this.generatedText = res.text);
}

6. Handling Long-Running AI Tasks

7. Security Considerations

  1. Validate user input – prevent malicious or inappropriate prompts

  2. API Key Protection – never expose AI API keys in frontend

  3. Rate Limiting – avoid abuse or excessive costs

  4. Data Privacy – avoid sending sensitive data to external APIs unless encrypted

8. Performance and Cost Optimization

9. Real-world Use Cases

  1. Chatbots – AI responses in customer support portals

  2. Content Generation – auto-generating articles, blogs, or product descriptions

  3. Code Assistance – generating boilerplate code or SQL queries

  4. Summarization – summarizing long text documents

  5. Interactive UI Suggestions – autocomplete, recommendation, or dynamic prompts

10. Best Practices

11. Summary

Integrating generative AI into ASP.NET Core web applications provides powerful, intelligent features. Key steps include:

  1. Choose an AI model (external API or internal)

  2. Implement a backend service to manage AI requests

  3. Securely integrate AI in the frontend

  4. Handle long-running tasks and background processing

  5. Apply security, caching, and monitoring best practices

By following these guidelines, developers can deliver AI-driven applications that are dynamic, secure, and user-friendly.