POST элемент на сервер JSON db- Angular

Я пытаюсь отправить элемент в свою базу данных на моем сервере json. Я отправляю запрос POST из Angular. Когда я это делаю, я получаю следующую ошибку:

Примечание: когда я получаю конечную точку GET, она работает нормально. Я очень новичок на стороне сервера

POST ERROR 404: Http failure response for http://localhost:3000/addMember: 404 Not Found

СЕРВЕР.JS

const express = require('express');
const cors = require('cors');
const bodyParser = require('body-parser');
const request = require('request');
const app = express();
....

app.use(cors());
app.use(express.static('assets'));
app.use(bodyParser.json());
app.use(bodyParser.urlencoded({ extended: true }));
app.disable('x-powered-by');
app.use(xssFilter());
app.use(nosniff());
app.set('etag', false);
app.use(
  helmet({
    noCache: true
  })
);
app.use(
  hsts({
    maxAge: 15552000 // 180 days in seconds
  })
);

app.use(
  express.static(path.join(__dirname, 'dist/softrams-racing'), {
    etag: false
  })
);

app.get('/api/members', (req, res) => {
  request('http://localhost:3000/members', (err, response, body) => {
    if (response.statusCode <= 500) {
      res.send(body);
    }
  });
});

// TODO: Dropdown!
app.get('/api/teams', (req, res) => {
  request('http://localhost:3000/teams', (err, response, body) => {
    if (response.statusCode <= 500) {
      res.send(body);
    }
  });
});

    // Submit Form!
    app.post('/api/members', function(request, response) {
  request.post('http://localhost:3000/members', (err, response, body) => {
    if (response.statusCode <= 500) {
      req.send(body);
    }
  });
});



  app.get('*', (req, res) => {
      res.sendFile(path.join(__dirname, 'dist/softrams-racing/index.html'));
    });

    app.listen('8000', () => {
      console.info('Vrrrum Vrrrum! Server starting!');
    });

УГЛОВОЙ

addMember(memberForm: Member) {
    this.http.post(`${this.api}/addMember`, memberForm).subscribe(
      data => {
        console.info('POST Request is successful ', data);
      },
      error => {
        console.info('Error', error);
      }
    );
  }

ОБНОВИТЬ: в моей консоли я вижу это POST /addMember 404 12.105 ms - 2 и если я захожу в http://localhost:3000/addMember прямо в браузере я вижу пустой объект {} и если я захожу сюда http://localhost:3000/ я вижу это сообщение Для доступа и изменения ресурсов вы можете использовать любой HTTP-метод GET POST PUT PATCH DELETE OPTIONS

Не могли бы вы показать свой код GET API. Похоже, вы пытаетесь вызвать удаленный API внутри своего API. Я думаю, что основной причиной является то, что вы используете параметр req для вызова другого API. Можете ли вы попробовать использовать: request = require('request') вместо req

Scofjeld 27.05.2019 08:16

@Scofield Я обновил вопрос с кодом GET

Patricio Vargas 27.05.2019 08:17

Кажется, что все, что у вас работает на localhost: 3000, просто не имеет обработчика POST-запросов к URL-адресу, который вы ему дали…

Will Alexander 27.05.2019 08:18

@Scofield, я уже использую запрос, я определил его в верхней части моего файла.

Patricio Vargas 27.05.2019 08:21

@WillAlexander в моей консоли я вижу это POST /addMember 404 12.105 ms - 2 Если я перехожу к http://localhost:3000/addMember прямо в браузере, я вижу пустой объект {}. и если я зайду сюда http://localhost:3000/ я увижу это сообщение To access and modify resources, you can use any HTTP method GET POST PUT PATCH DELETE OPTIONS

Patricio Vargas 27.05.2019 08:23

Если вы получаете 404, это почти наверняка связано с тем, что все, что там работает, не обрабатывает POST для /addMember. Что именно работает на порту 3000?

Will Alexander 27.05.2019 08:26

@WillAlexander на сервере 3000 - это сервер JSON

Patricio Vargas 27.05.2019 08:27

Можем ли мы увидеть ваш файл db.json, пожалуйста?

Will Alexander 27.05.2019 08:28

Я подозреваю, что вам нужно отправить запрос POST на /members, а не на /addMember

Will Alexander 27.05.2019 08:30

@WillAlexander ОМГ! ты гений!

Patricio Vargas 27.05.2019 08:32

@WillAlexander не стесняйтесь использовать это как ответ

Patricio Vargas 27.05.2019 08:32
Стоит ли изучать PHP в 2023-2024 годах?
Стоит ли изучать PHP в 2023-2024 годах?
Привет всем, сегодня я хочу высказать свои соображения по поводу вопроса, который я уже много раз получал в своем сообществе: "Стоит ли изучать PHP в...
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
Поведение ключевого слова "this" в стрелочной функции в сравнении с нормальной функцией
В JavaScript одним из самых запутанных понятий является поведение ключевого слова "this" в стрелочной и обычной функциях.
Приемы CSS-макетирования - floats и Flexbox
Приемы CSS-макетирования - floats и Flexbox
Здравствуйте, друзья-студенты! Готовы совершенствовать свои навыки веб-дизайна? Сегодня в нашем путешествии мы рассмотрим приемы CSS-верстки - в...
Тестирование функциональных ngrx-эффектов в Angular 16 с помощью Jest
В системе управления состояниями ngrx, совместимой с Angular 16, появились функциональные эффекты. Это здорово и делает код определенно легче для...
Концепция локализации и ее применение в приложениях React ⚡️
Концепция локализации и ее применение в приложениях React ⚡️
Локализация - это процесс адаптации приложения к различным языкам и культурным требованиям. Это позволяет пользователям получить опыт, соответствующий...
Пользовательский скаляр GraphQL
Пользовательский скаляр GraphQL
Листовые узлы системы типов GraphQL называются скалярами. Достигнув скалярного типа, невозможно спуститься дальше по иерархии типов. Скалярный тип...
0
11
5 734
2
Перейти к ответу Данный вопрос помечен как решенный

Ответы 2

Ответ принят как подходящий

Проблема здесь в том, что вы отправляете запрос POST на маршрут, который не обрабатывает ваш сервер JSON. Измените URL-адрес на http://localhost:3000/members, и он должен работать нормально!

(Маршруты на json-сервере соответствуют элементам в вашем файле db.json.)

Попробуйте изменить свой код следующим образом:

addMember(memberForm: Member) {
    this.http.post(`${this.api}/api/addMember`, memberForm).subscribe(
      data => {
        console.info('POST Request is successful ', data);
      },
      error => {
        console.info('Error', error);
      }
    );
  }

Из ошибки видно, что ваш сервис ожидает запрос на http://localhost:3000/api/addMember, но ваш console.info показывает, что вы отправляете почтовый запрос на http://locatlhost:3000/addMember

Другие вопросы по теме