0

First of all. Please bear with my questions.

What I am doing is just performing an ajax request which will return a response data of string.

Here's my php

<?php
     header('Access-Control-Allow-Origin: *');

     echo 'Peenoise Crazy';
?>

Http request

let headers = new Headers({ 'Content-Type': 'application/x-www-form-urlencoded' });
let options = new RequestOptions({ headers: headers });
return this.http.post('./app/parsers/peenoise.php', '', options)
    .then(val => console.log(val))

This doesn't work. But if I change the url into this http://localhost:8912/app/parsers/peenoise.php. It works.

Questions

  1. Why ./app/parsers/peenoise.php doesn't work?
  2. If I change the url to http://localhost:8912/app/parsers/peenoise.php. Why do I need to put header('Access-Control-Allow-Origin: *')? It is on the same folder of my app.
  3. How to use http.post without passing an url of http://localhost:8912/route/to/phpfolder.php?

Any help would be appreciated. Please guide me to this. Thanks

  • quando o usuário faz uma solicitação usando ajax angular 2, o pedido é de navegador do cliente. O pedido não vem de servidor para servidor. Por isso, é necessário utilizar o caminho do servidor. lembre-se que no momento em que o aplicativo está no navegador do cliente. not is possible to make a request to the server that way you want. – Renato Souza de Oliveira Oct 29 '16 at 02:39
  • Have you tried `/app/parsers/peenoise.php` (without the leading dot)? It seems like you're trying to use directory path notation, but a dot is not interpreted the same way when it comes to URLs. – Dan Wilson Oct 29 '16 at 02:58
  • @user3608792 yes. I tried everything and doesn't have an error on console and doesn't work. –  Oct 29 '16 at 03:13
  • Instead of `.then()` you could try using the `.map().subscribe()` pattern. http://stackoverflow.com/questions/34671715/angular2-http-get-map-subscribe-and-observable-pattern-basic-understan – Dan Wilson Oct 29 '16 at 03:17

2 Answers2

0

Post requires a full or a relative URL to work. You can use:

this.http.post('/parsers/peenoise.php', '', options)
Ben Richards
  • 3,437
  • 1
  • 14
  • 18
0

Actually Angular looks for a backend server to post the data, so Imagine in your post request is like below

this.http.post('./app/parsers/peenoise.php', '', options).then(val => console.log(val))

It will try to make the post request at the location imagine you are serving angular on localhost:4200

http://localhost:4200/app/parsers/peenoise.php

Now to answer your Questions :

1)./app/parsers/peenoise.php doesn't work because it's actually trying to find it from your backend service

2)You need to put header('Access-Control-Allow-Origin: *') whenever you are making an http request to a different server than from the one which your site is currently using, if you don't use that you'll end up with Connection_refused_Error.

3)If you want to use just angular then there are mockAckends, in-memory-web-api

An example using mockBackEnd is here

Ram Sharma
  • 91
  • 1
  • 2