web-dev-qa-db-fra.com

Le proxy angulaire-CLI au backend ne fonctionne pas

https://github.com/angular/angular-cli#proxy-to-backend voici une instruction sur la procédure de proxy pour le backend. J'ai tout fait étape par étape et les demandes ne sont toujours pas adressées par proxy.

8080 - mon backend Express 4200 - mon frontend Angular2

Dans le projet Angular2, j'ai le fichier proxy.cons.json avec un contenu comme celui-ci:

{
  "/api": {
    "target": "http://localhost:8080",
    "secure": false
  }
}

Dans Angular2 package.json, j'ai changé la procédure start en "start": "ng serve --proxy-config proxy.conf.json"

Quand je tape à l'intérieur du commandant npm start puis au début je peux voir Proxy created: /api -> http://localhost:8080. Eh bien, jusqu'ici c'est bon je suppose.

J'essaie d'envoyer une demande (Angular2)

  constructor(private http: Http) {
    this.getAnswer();
  }

  getAnswer(): any {
    return this.http.get("/api/hello")
      .subscribe(response => {
        console.log(response);
      })
  }

Je reçois une erreur qui http://localhost:4200/api/hello 404 (Not Found). Comme on peut le constater, rien n’a été représenté par procuration. Pourquoi? Est-ce que j'ai fait quelque chose de mal?

Pour être clair. Quand je vais manuellement à http://localhost:8080/hello, tout fonctionne bien. Il n'y a rien à rechercher dans le backend.

angularproxyangular-cli
26
elzoy

Pourriez-vous essayer avec celui-ci: 

{
  "/api": {
    "target": "http://url.com",
    "secure": false,
    "pathRewrite": {"^/api" : ""}
  }
}

Ça marche pour moi,

** NG Live Development Server is running on http://localhost:4200. **
 10% building modules 3/3 modules 0 active[HPM] Proxy created: /api  ->  http://ec2-xx-xx-xx-xx.ap-south-1.compute.amazonaws.com
[HPM] Proxy rewrite rule created: "^/api" ~> ""
34
Manish

C'était proche de travailler pour moi. Aussi dû ajouter 

"changeOrigin": true,

proxy.conf.json complet illustré ci-dessous:

{
  "/proxy/*": {
  "target": "https://url.com",
  "secure": false,
  "changeOrigin": true,
  "logLevel": "debug",
  "pathRewrite": {"^/proxy" : ""}
  }
}
13
Tony Scialo

Je devais faire un petit ajustement basé sur les réponses ci-dessus, bien que cela semble un peu étrange de regarder la configuration maintenant.

Voici mon proxy.conf.json ci-dessous:

{
  "/api/*": {
     "target": "https://url.com",
     "secure": false,
     "changeOrigin": true,
     "logLevel": "debug",
     "pathRewrite": {"^/api" : "http://url.com/api"}
  }
}

En gros, j'ai complètement réécrit le chemin. Et ça marche maintenant.

3
Srikkant Srinivasan
    Please follow below steps

    1 In Angular project create a file called  **proxy.cons.json** with content like this:

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

    2 edit package.json file and add below code

      "start": "ng serve --proxy-config proxy.conf.json"


    3 call your backend api like this

       this.http.get('/api/v1/people')
      .map(res => res.json());

    4 run npm start or ng serve --proxy-config proxy.conf.json
0
vipinlalrv