AJAX POST-запрос к Express серверу с PHP веб-страницы (одинаковые или разные порты)?

Question

Я хочу отправить запрос POST через AJAX с веб-сайта на сервер express при нажатии кнопки. Когда я запускаю сервер на том же порту, что и веб-сайт (localhost: 8080), веб-сайт перестает отображаться, и я получаю сообщение «Cannot GET /mogle/income.php», «mogle / дохода». php "- это веб-страница, с которой я хочу отправить запрос. Когда я запускаю сервер на другом порту (localhost: 8000), вызов AJAX POST больше не работает. Насколько я понимаю, вы можете отправлять запросы на разные порты только с помощью JSONP, но JSONP может работать только с GET-запросами, и мне нужно использовать POST.

Я попытался добавить функцию app.get в мой файл server. js (см. фрагмент кода ниже) для адресации веб-страницы, которая не отображается, когда сервер работает на том же порту, что и веб-сайт, но когда я go обращаюсь к «localhost: 8080 / mogle / доход. php» файл загружается вместо рендеринга, что, как я полагаю, связано с тем, что это файл PHP, а не файл HTML. Однако, даже если бы это работало, пришлось бы мне тогда делать заявление app.get для каждой другой веб-страницы (homepage. php, login. php, et c.) На веб-сайте на сервере. . js файл?

app.get("/mogle/income.php", (req, res) => {
  // "../../" because the server file is in two folders
  res.sendFile(path.join(__dirname, "../../income.php"));
});

app.post("/path", async (req, res) => {
  // Process response
});

Каково соглашение об отправке запросов (как POST, так и GET) с веб-сайтов на серверы в терминах портов?

Answer 1

Решение может быть следующим:

• Сначала необходимо разрешить все эти запросы POST / GET / PUT на вашем сервере, обновив значения заголовка

  const express = require('express')
  const bodyParser = require('body-parser');
  const app = express()
  
  app.use(bodyParser.json());
  app.use(bodyParser.urlencoded({extended: true}) );
  
  app.all("/*", function(req, res, next){
    res.header('Access-Control-Allow-Origin', '*');
    res.header('Access-Control-Allow-Headers', 'Content-Type, Authorization, Content-Length, X-Requested-With');
    res.header('Access-Control-Allow-Methods', 'GET,PUT,POST,DELETE,OPTIONS');
    next();
  });
  
  app.post('/yourendpoint', function (req, res) {
    res.send(req.body)
  })
  
  app.listen(8080, function () {
    console.log('Server Listening on - localhost:8080!')
  })
  

А на стороне клиента разместите данные следующим образом (Angular Пример)

let myDataObj = { name: "test", age: 22 , otherprop: "my post data values"};
this.http.post('http://localhost:8080/yourendpoint', JSON.stringify(myDataObj), {
  headers: headers
})
.subscribe(data => {
  console.log(data);
});