Search code examples
asp.net-corehttpdependenciesconnection-stringangular17

API Testing / DB Connections in Angular17


I'm currently working creating a web app using Asp.Net Core (back) & Angular17 (front). I created the class models for my tables in my project with the DbContext, here the code used for the DbContext (I changed private information for obvious reasons):

using Microsoft.EntityFrameworkCore;

namespace App.Models.MyEntity
{
    public partial class MyEntity: DbContext
    {
        public MyEntity(DbContextOptions<MyEntity> options)
            : base(options)
        {
        }

        public virtual DbSet<Employee> Employee { get; set; }
    }
}

In my Startup.cs I added the connection to that DB:

public void ConfigureServices(IServiceCollection services)
{
   services.AddDbContext<MyEntity>(options =>
      options.UseSqlServer(Configuration.GetConnectionString("MyEntity")));
}

And finally in my 'appsettings.json' I added the ConnectionString:

{
  "Logging": {
    "LogLevel": {
      "Default": "Warning"
    }
  },
  "AllowedHosts": "*",
  "ConnectionStrings": {
  "MyEntity": "Server=MyServer;Database=DB1;User Id=UserId;Password=password1;MultipleActiveResultSets=True;" 

  }
}

After setting up all those things I tried testing my API inside my Angular code using this:

export class PDSLoginComponent {
  private apiUrl = 'https://localhost:44612/';

  loginData = {
    UserId: ''
  };
  getEmployeeData(input: string) {
    this.http.get<any>(`${this.apiUrl}api/Employees/GetEmpNameByClock?clockNo=${clockNo}`).subscribe(
        data => {
          console.log(data);
        }, error => {
          console.log("What's the error? ",error);
          this.toastr.error(error, "Error");
        }
      );
  onLogin() {
    this.getEmployeeDataByClock(this.loginData.UserId);
  }
}

Why am I getting this next error: polyfills.js:23 GET https://localhost:44359/api/Employees/GetEmpNameByClock?clockNo=7284 404 (Not Found)

  1. I have tried looking syntaxis errors but the strings seems to be right,
  2. I reviewed that the connection strings have the right credentials.
  3. My backend and fronted are running together at the same time.
  4. I'm importing all necessary libraries and dependencies are up to date.

I don't know what else should I look up.


Solution

  • After a research and Thanks to Achim Schnell comment I took a different perspective. The problem was not the 'ConnectionStrings' or the configuration on my 'Startup.cs' file. The problemas was actually the controller. I was using the 'api' prefix in my route, that was part of the problem.

    I was using "ApiController" Instead of "ControllerBase" on my Controller, here's how I configured my Controller to be able to use my DB:

    [Route("api/[controller]")]
    [ApiController]
    public class EmployeesController : ControllerBase //Here I used 'ApiController'
    {
        private readonly MyModel _ctx;
    
        public EmployeesController(MyModel ctx){
           _ctx = ctx;
        }
    
        [HttpGet("GetEmployeeByClock/{clockNo}")]
        public IActionResult GetEmpByClock(string clockNo){
    
            /* REST OF MY QUERIES AND FUNCTIONALITY */
    
        }
    }