未找到 VueJS POST 404

Question

我的目標是將我的 Quasar 應用程序運行到連接到局域網的其他設備上。 我設法按預期運行它們，盡管當我登錄網站時，我遇到此錯誤POST http://10.0.0.20:8080/MyComposer/?submitId=3 404 (Not Found)盡管我的工作正常本地主機之前。 為什么它不能正確讀取后端文件夾中我的 index.php 中的類？

PS 我不知道這是否可以解決我的問題，但是當我使用 phpinfo() 進行調試時，我注意到 REQUEST_METHOD 有 GET 而不是 POST。 可以交換它們嗎？ 我會嘗試你們給我的任何東西。

安慰

General
Request URL: http://10.0.0.20:8080/MyComposer/?submitId=3
Request Method: POST
Status Code: 404 Not Found
Remote Address: 10.0.0.20:8080
Referrer Policy: no-referrer-when-downgrade

Response Headers
Connection: keep-alive
Content-Length: 151
Content-Security-Policy: default-src 'none'
Content-Type: text/html; charset=utf-8
Date: Tue, 28 Jul 2020 12:18:12 GMT
Vary: Accept-Encoding
X-Content-Type-Options: nosniff
X-Powered-By: Express

Request Headers
Accept: application/json, text/plain, 
Accept-Encoding: gzip, deflate
Accept-Language: en-US,en;q=0.9,es;q=0.8
Connection: keep-alive
Content-Length: 49
Content-Type: application/json
Host: 10.0.0.20:8080
Origin: http://10.0.0.20:8080
Referer: http://10.0.0.20:8080/
User-Agent: Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/84.0.4147.105 Safari/537.36

頭文件.php

<?php
header('Access-Control-Allow-Origin: http://10.0.0.20:8080/'); //OR EITHER http://10.0.0.20:8080/ OR .$_SERVER['HTTP_ORIGIN']
header('Access-Control-Allow-Credentials: true');
header('Access-Control-Allow-Max-Age: 3600');
if (strtoupper($_SERVER['REQUEST_METHOD']) === 'OPTIONS') {
    if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_METHOD']))
        header("Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS");
    if (isset($_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']))
        header("Access-Control-Allow-Headers: {$_SERVER['HTTP_ACCESS_CONTROL_REQUEST_HEADERS']}");
    exit(0);
}

store.js

   actions: {
      LOGIN (context, payload) {
        return new Promise((resolve, reject) => {
          axios
            .post('/MyComposer/', payload, {
              headers: { 'Content-Type': 'application/json' },
              params: {
                submitId: 3
              }
            })

index.php

<?php
require 'Classes/Headers.php';
require 'vendor/autoload.php';

echo 'Hello!';
phpinfo();

use Classes\SubjectClass;
use Classes\TestClass;
use Classes\AnswerClass;
use Classes\LoginClass;
use Classes\RegisterClass;
use Classes\TeacherClass;
use Classes\StudentClass;
use Classes\AccountClass;
use Classes\AccessClass;
use Classes\SchoolClass;

if ($_SERVER["REQUEST_METHOD"] == "POST") {
    $addsubject = new SubjectClass();
    $addsubject->addSubject();
    $addtest = new TestClass();
    $addtest->addTest();
    $submitTest = new AnswerClass();
    $submitTest->submitTest();
    $submitLoginData = new LoginClass();
    $submitLoginData->submitLoginData();
    $addAccountData = new RegisterClass();
    $addAccountData->addAccountData();
    $addSchool = new SchoolClass();
    $addSchool->addSchool();
}

Answer 1

該問題不是由編碼錯誤引起的，而是由於受影響的系統上安裝了兩個 Web 服務器，一個 XAMPP 安裝在默認端口 80 上運行，而 Node.Js 服務器在端口 8080 上運行。

為了診斷問題，我們首先將腳本中使用的 URL 復制粘貼到瀏覽器 window 中，它給出了相同的 404 HTTP 錯誤。 這排除了axios.post()方法導致該行為的選項。

接下來測試基本的 HTTP 端口分配。 調用地址http://10.0.0.20 （本地網絡內用戶的 IP）給出了正確的 XAMPP 主頁。 在檢查httpd.conf和其中的Listen設置（應該是Listen 8080 ）時，我們看到 Apache 正在使用默認的 HTTP 端口。 將其更改為 8080（在腳本中使用）並重新啟動 Apache 導致服務器無法啟動並出現以下錯誤：

檢測到問題：“C.\Program Files\nodejs\node.exe”正在使用端口 8080，PID 為 3808！ Apache 不會在沒有配置的端口空閑的情況下啟動！ 您需要卸載/禁用/重新配置阻塞應用程序或重新配置 Apache 和控制面板以偵聽不同的端口。

現在可以確定是端口混亂是問題的原因。 從腳本中刪除:8080確保請求被發送到正確的服務器。