Угловой 6 с API в Codeigniter

Question

Я хочу использовать Angular 6 с NGXS для внешнего интерфейса и Codeigniter 3 для внутреннего интерфейса. Как я могу объединить два, чтобы вызвать API от CI в Angular NGXS

Я пробовал следующие шаги:

• Создан угловой проект с помощью команды: ng new {имя проекта}
• Создан API входа в CI
• Установил NGXS store и обновил файл app.module.ts, чтобы включить его
• В файле login.state.ts я добавил следующий код, который дает мне следующую ошибку:

Ответ на запрос предварительной проверки не проходит проверку контроля доступа: в запрошенном ресурсе отсутствует заголовок "Access-Control-Allow-Origin". Источник ' http://localhost:4200/ ', следовательно, не имеет доступа. Ответ имеет HTTP-код состояния 404

import { State, Action, StateContext, Selector } from '@ngxs/store';
import { HttpClient } from '@angular/common/http';
import { Router } from '@angular/router';

import { Login } from '../models/Login';
import { LoginUser } from '../actions/login.action';

export class LoginUserModel {
    login: Login[];
}

@State<LoginUserModel>({
    name: 'login',
    defaults: {
        login: []
    }
})
export class LoginState {

    constructor(private http: HttpClient) {}

    @Action(LoginUser)
    authenticate({ getState, patchState }: StateContext<LoginUserModel>, { payload }: LoginUser) {
        this.http.post("http://localhost/CI/api/User/authenticate" , payload ).subscribe(response => {
            console.log("res=>"+response);
        });
    }
}

Answer 1

Так как вы используете angular-cli вы, вероятно, можете пойти на прокси-сервер, чтобы обойти проблемы CORS, как это,

Создать proxy.conf.json файл в корне вашего проекта с содержанием ниже

{
  "/api/*": {
    "target": "http://localhost",
    "secure": false,
    "logLevel": "debug",
    "changeOrigin": true
  }
}

Примечание. Это временное решение рекомендуется только для целей разработки, его не должно быть на рабочем сервере.

Надеюсь это поможет!