Sending POST or GET request from Angular project to Python server

Question

I made a little server with http.server python library.

import http.server
import socketserver

class  SimpleHTTPRequestHandler(http.server.SimpleHTTPRequestHandler):
    def do_GET(self):
        print("get")

    def do_POST(self):
        print("post")
        content_length = int(self.headers['Content-Length'])
        msg = self.rfile.read(content_length).decode('utf-8')
        print(msg)

if __name__ == '__main__':
    PORT = 8080
    Handler = SimpleHTTPRequestHandler
    with socketserver.TCPServer(("", PORT), Handler) as httpd:
        print("serving at port", PORT)
        try:
            httpd.serve_forever()
        except KeyboardInterrupt:
            print("-- stop --")
            exit()

I tested it with a simple python script

import socket

def mypost():
    s = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
    s.connect(("localhost", 8080))
    txt = "1234"
    post = "POST /test.txt HTTP/1.0\nContent-Length: " + str(len(txt)) + "\nContent-Type: plain/text\n\n" + txt
    s.send(post.encode())

def myget():
    s = socket.socket(socket.AF_INET, socket.SOCK_STREAM)
    s.connect(("localhost", 8080))
    post = "GET HTTP/1.0"
    s.send(post.encode())

Get and post are both receive by the server. Then I want to send the requests with my angular project.

import { Component, OnInit } from '@angular/core';

import { HttpClient } from '@angular/common/http';

@Component({
  selector: 'srp-send-request',
  template: `
  <button  (click)="postMsg()">RUN</button >
  `,
  styles: [
  ]
})
export class SendRequestComponent implements OnInit {

  constructor(private http: HttpClient) {
  }

  ngOnInit(): void {}

  public postMsg() {
    var url = 'http://localhost:8080';
    var msg = "1234";
    var option = {'Content-Length' : msg.length, 'Content-Type': 'plain/text', 'body' : msg};
    var ret = this.http.get<any>('localhost:8080');
    var ret = this.http.request('POST', url, option);
    console.log(ret);
  }
}

I can click on the button but the server receive nothing. I am new to Angular so I don't now what I done wrong. Are my request well formated ?

Does this answer your question? [Angular 2 http.post() is not sending the request](https://stackoverflow.com/questions/36208732/angular-2-http-post-is-not-sending-the-request) — R. Richards, Aug 21 '20 at 13:36

score 2 · Accepted Answer · edited Aug 21 '20 at 13:11

2

If I'm not mistaken, both Angular's HttpClient get and post methods return an Observable object that you have to subscribe to, in order to get the data sent by the server.

public postMsg() {
    var url = 'http://localhost:8080';
    var msg = "1234";
    var option = {'Content-Length' : msg.length, 'Content-Type': 'plain/text', 'body' : msg};
    this.http.get<any>('localhost:8080').subscribe((data) => console.log(data));
    this.http.request('POST', url, option).subscribe((data) => console.log(data));
  }

The http guide of the Angular website is fairly complete and covers lots of topics, from making GET, POST,... requests, handling the responses, intercepting, incoming and outgoing queries...

edited Aug 21 '20 at 13:11

Dharman

30,962
25
85
135

answered Aug 21 '20 at 13:05

bastantoine

582
4
21

Thanks, I got a Cross origin requests error now but it acualy do something ^^ – Baptiste Gavalda Aug 21 '20 at 13:14
1

Oh yeah, makes sense. I suppose your Angular server is running on `localhost:4200` while your python one is on `localhost:8080`? You should add the `Access-Control-Allow-Origin` HTTP header, but I'm not sure I know in which request to add it though... ^^' – bastantoine Aug 21 '20 at 13:17
Oh no, never mind, it work well with my post request. The get was just for testing purpose so it is ok ^^ – Baptiste Gavalda Aug 21 '20 at 13:22

Sending POST or GET request from Angular project to Python server

1 Answers1