#node.js #angular #http
#node.js #angular #http
Вопрос:
Я пытаюсь подключить проект Angular к API NodeJS, проблема в том, что запрос не работает на стороне Angular, хотя он хорошо работает в консоли и браузере.
Я попробовал это в консоли, например: curl http://127.0.0.1:3333/table И я получил ответ: [{«userid»: 2, «roleid»:2, «username»: «partner2», «fullname»: «Его полное имя», «psw»:»gmail@gail.com «, «электронная почта»:»пароль», «баланс»: 0}]%
Я предполагаю, что есть некоторые проблемы на угловой стороне. Есть ли у вас какие-либо идеи, как это исправить?
// app.modules.ts
import { BrowserAnimationsModule } from '@angular/platform-browser/animations'; // this is needed!
import { NgModule } from '@angular/core';
import { FormsModule } from '@angular/forms';
import { NgbModule } from '@ng-bootstrap/ng-bootstrap';
import { RouterModule } from '@angular/router';
import { AppRoutingModule } from './app.routing';
import { ComponentsModule } from './components/components.module';
import { ExamplesModule } from './examples/examples.module';
import { AppComponent } from './app.component';
import { NavbarComponent } from './shared/navbar/navbar.component';
import {HTTP_INTERCEPTORS, HttpClientModule} from '@angular/common/http';
import {AuthInterceptor} from './auth.interceptor';
import {BrowserModule} from '@angular/platform-browser';
@NgModule({
declarations: [
AppComponent,
NavbarComponent
],
imports: [
BrowserModule,
HttpClientModule,
BrowserAnimationsModule,
NgbModule,
FormsModule,
RouterModule,
AppRoutingModule,
ComponentsModule,
ExamplesModule
],
providers: [
/*{
provide : HTTP_INTERCEPTORS,
useClass: AuthInterceptor,
multi : true,
},*/
],
bootstrap: [AppComponent]
})
export class AppModule { } // services.services.ts
import { Injectable } from '@angular/core';
import {HttpClient} from '@angular/common/http';
import {Observable} from 'rxjs';
@Injectable({
providedIn: 'root'
})
export class ServiceService {
constructor(private httpClient: HttpClient) {
}
public createNewUser(bodyParams: any): Observable<any> {
return this.httpClient.post('carriers/new-carrier', bodyParams);
}
public getTableX(): Observable<any> {
return this.httpClient.get('http://localhost:3003/api/table');
}
public getTableZ(): Observable<any> {
return this.httpClient.get('http://localhost:3003/table');
}
public getTable(): Observable<any> {
return this.httpClient.get('http://127.0.0.1:3333/table');
}
} 
Ответ №1:
Вы должны исправить эту проблему на стороне вашего пакета, браузеру нужны ответы с разрешенными cors Cross-Origin , пожалуйста, проверьте https://expressjs.com/en/resources/middleware/cors.html когда вы используете Espression Node js.
Комментарии:
1. Консоль Angular, Nodejs или консоль браузера? (консоль браузера с ошибкой запроса добавлена в описание)?
2. Нет, вы указали вкладку «Сеть» в консоли браузера, пожалуйста, укажите вкладку «Консоль» в консоли браузера.
Ответ №2:
Эта проблема была исправлена путем добавления строки ниже в мой прокси
app.use((req, res, next) => {
res.header('Access-Control-Allow-Origin', '*');
next();
});