Click here to Skip to main content
15,663,033 members
Please Sign up or sign in to vote.
0.00/5 (No votes)
Hi All,

I am working on a demo project using .Net Web API with C#, Angular, Entity Framework. Saving the code into Github and finally deploying the API and Angular. The purpose is to learn the end-to-end implementation of the technologies.

I am trying to access the data through http and displaying the same in Angular application. I have also implemented the CORS policy.

While building through dotnet CLI, I am using "dotnet run" and its compiling successfully and its showing the API url(s) as "http://localhost: 5090" and "https://localhost:7011".

Currently, I am facing 3 problems and need help:

1) when I am trying to test the same over Postman or through browser url, providing the necessary Controller/Action, its throwing "404 ok" error.

2) I want to access the "https" url, but wondering from where I woud get SSL Certificate while deploying the application on Internet.

3) I could be able to save the C# code (API, Models) into github, but would like to know how to save Angular files too into same repository of github.

What I have tried:

footer.component.ts
Here, I have provided hard-coded url for testing purpose and later planning to move the hard-coded http URL into environment variable.
public getAllSocialMediaLinks(): any {
        this.http.get('http://localhost:5090/api/SocialMediaLinks/GetAllMediaLinks/').subscribe({
            next: response => this.socialMediaLinksList = response,
            error: error => console.log(error),
            complete: () => console.log("Request Completed")
        });
    }


Program.cs
Here, "http://localhost:4200/" is the Angular application.
// Configure the HTTP request pipeline.
app.UseCors(builder => builder.AllowAnyHeader().AllowAnyMethod().WithOrigins("http://localhost:4200/"));


MediaLinksController.cs
using Microsoft.AspNetCore.Mvc;
using Microsoft.EntityFrameworkCore;
using API.Data;
using DOMAIN_MODELS;

namespace API.Controllers
{
    [ApiController]
    [Route("api/SocialMediaLinks")]
    public class SocialMediaLinksController
    {
        private DataContext _context;
        public SocialMediaLinksController(DataContext context)
        {
            _context = context;
        }

        [HttpGet]
        public async Task<ActionResult<IEnumerable<SocialMediaLinks>>> GetAllMediaLinks()
        {
            return await _context.SocialMediaLinks.ToListAsync();
        }
    }
}



Secondly, I have used git commands to save the project as repository, where I can see only API reated files got saved. But, how to save the Angular related files too, into the same repository, into Github.

Please help.
Thanks.
Posted
Updated 26-Jan-23 16:40pm
v2

1 solution

Hi All,

I tried below steps and I could see its working on Postman and Browser as well:

1) Added [action] on Controller
[Route("api/SocialMediaLinks/[action]")]


2) Removed '/' from the calling url
this.http.get('http://localhost:5090/api/SocialMediaLinks/GetAllMediaLinks').subscribe({


I don't know why API requires [action] to be mentioned even if there is only one action or if the actions are named differently.

Anyways, it worked for me.

Thanks.
 
Share this answer
 

This content, along with any associated source code and files, is licensed under The Code Project Open License (CPOL)



CodeProject, 20 Bay Street, 11th Floor Toronto, Ontario, Canada M5J 2N8 +1 (416) 849-8900