Блог

Главная - Вопросы по программированию - Вызов Angular API не попадает в метод контроллера

Вызов Angular API не попадает в метод контроллера

#c# #angular #api

#c# #angular #API

Вопрос:

Я не могу попасть в свой метод контроллера Get

У меня есть файл register.component.ts, в котором я вызываю метод getfeed dataservice

 ngOnInit() {
this.dataservice.getFeed('register').subscribe(result => {
}

в файле data.service.ts я написал следующее

 @Injectable()
export class DataService {
constructor(private http: HttpClient) { }

getFeed(methodName: string): Observable<any> {

return this.http.get(environment.baseApiUrl   methodName);
}
}

В моем файле environment.ts у меня есть

  baseApiUrl:'http://localhost:4200/api/'

И, наконец, в RegisterController.cs я закодировал как

 [ApiController]
[Route("[controller]")]
public class RegisterController : ControllerBase
{
    [HttpGet]
    [ProducesResponseType(400)]
    [ProducesResponseType(typeof(string), 500)]
    public async Task<IActionResult> Get()
    {
    }
}

Но этот Get никоим образом не попадает. Я попробовал другой URL-адрес непосредственно из браузера. Но в этом методе get ничего не происходит. Есть идеи, чего мне не хватает в моей реализации?

И в моем файле Startup.cs у меня есть что-то вроде этого

     public void Configure(IApplicationBuilder app, IWebHostEnvironment env)
    {
        if (env.IsDevelopment())
        {
            app.UseDeveloperExceptionPage();
        }

        app.UseHttpsRedirection();
        app.UseStaticFiles();

        app.UseRouting();

        app.UseEndpoints(endpoints =>
        {
            endpoints.MapControllerRoute(name: "default", pattern: "{controller}/{action=index}/{id?}");
        });

Комментарии:

1. У вас проблема с CORS?

2. как мне это проверить?

3. находится register в register.component.ts переменной со значением string 'register' ? Прямо сейчас вы вызываете this.dataservice.getFeed(register) , вы хотели передать его как строку this.dataservice.getFeed('register') ? Также на каком порту API запущен в разработке? Вы указываете http-запрос на порт 4200, на котором выполняется angular в процессе разработки, разве его не нужно указывать на порт api?

4. @AlexanderStaroselsky его строка…

5. @NithinPaul Проверьте консоль разработчика в вашем веб-браузере, чтобы узнать, есть ли какие-либо ошибки или проблемы с CORS.

Ответ №1:

Чтобы решить вашу CORS проблему, вы можете выполнить следующие действия в своем web.config файле:

В <system.webServer> разделе укажите следующее, чтобы включить CORS глобально в вашем проекте:

 <httpProtocol>
    <customHeaders>
        <add name="Access-Control-Allow-Origin" value="*" />
        <add name="Access-Control-Allow-Credentials" value="true"/>
        <add name="Access-Control-Allow-Headers" value="Content-Type" />
        <add name="Access-Control-Allow-Methods" value="GET, POST, PUT, OPTIONS" />
    </customHeaders>
</httpProtocol>

Комментарии:

1. Rahul в моем web.config я указал это как <system.webServer> <httpProtocol> <Пользовательские заголовки> <add name=»Access-Control-Allow-Origin» значение =»*» /> <add name=»Access-Control-Allow-Credentials» значение =»true»/> <добавить имя = «Управление доступом-Разрешить-заголовки» значение =»Тип содержимого» /> <добавить имя =»Управление доступом-Разрешить-методы» значение =»ПОЛУЧИТЬ, ОПУБЛИКОВАТЬ, ПОМЕСТИТЬ, ПАРАМЕТРЫ» /> </customHeaders> </system.webServer>Но все же я получаю ту же ошибку

2. Когда я пытаюсь использовать прямой URL-адрес, я могу использовать свой метод service api, но когда я вызываю его с помощью angular, я этого не делаю. Нужно ли мне что-либо делать на стороне клиента angualr?

3. @NithinPaul Нет, вам не нужно ничего делать на стороне клиента. Возможно, вам нужно перезапустить IIS, чтобы изменения отразились.

4. Хорошо, также мне нужно удалить этот тег <обработчики> из раздела <system.webServer>? Потому что в моей ошибке cors он отображается так, как будто у него нет статуса ok, поэтому, когда я погуглил, кто-то упомянул его

5. Рахул, теперь он попадает на мою сторону обслуживания :), я полностью удалил этот раздел обработчика, Спасибо за вашу помощь 🙂

Ответ №2:

Если я вас правильно понял, вы хотите вызвать контроллер api http://localhost:4200/api/register .

Для этого выполните следующие действия:

  1. Измените код вашего контроллера следующим образом: 
      [ApiController]
 [Route("api")]
 public class RegisterController : ControllerBase
 {
     [HttpGet("register")]
     [ProducesResponseType(400)]
     [ProducesResponseType(typeof(string), 500)]
     public async Task<IActionResult> Get()
     {
     }
 }
  2. Избавьтесь от локального хоста и номера порта, он вам не понадобится: 
      baseApiUrl:'api/'

Ваш getFeed метод должен выглядеть так без параметра:

 getFeed: Observable<any> {
    return this.http.get('api/register');
}

Или, я думаю, это тоже должно сработать, если вы просто измените baseApiUrl , как указано выше. Попробуйте.