viteサーバーからApache配下のphpを呼ぶには

Question

ApacheサーバーがCドライブで起動しています。
下記ファイルがありCDNでvueとaxiosをimportしています。
htdocs/vuephp/index.html
htdocs/vuephp/select.php
index.htmlからselect.phpを呼ぶために下記のようにaxios.postにurlを設定しました。
axios.post('select.php',{}) ～
index.htmlからaxiosでselect.phpを呼びmysqlからデータを取得して表示しています。
サーバーのホストはlocalhostです。
上記のやり方はデータの取得と表示に成功しています。

Eドライブにviteプロジェクトをvueを選択して作成しました。
axiosもインストールしました。
npm run devでサーバーが起動するとApp.vueが表示されます。
サーバーのホストは 127.0.0.1:5173です。
このApp.vueからCドライブのhtdocs/vuephp/select.phpを呼ぶために下記のようにaxios.postにurlを設定しました。
axios.post("http://localhost/vuephp/select.php", {}) ～
しかしこれだとAxiosError Network Errorとなります。

何が考えられるでしょうか？

Answer 1

アクセスするphpに下記設定でデータを取得できました
header('Access-Control-Allow-Origin: *');
header('Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept');

Answer 2

サーバーのホストは 127.0.0.1:5173です。

サーバーのIPアドレスが 127.0.0.1 、これはlocalhostと記しても到達できるローカルループバックアドレスで問題なし。
サーバーとしてLISTENしているポート番号が 5173 ということなのだから、
5173番宛にアクセスしないといけないことはわかりますよね。

http://localhost/vuephp/select.php
は
http://localhost:80/vuephp/select.php
と同じ意味で、サーバーが80番ポートでLISTENしている前提、
いわゆるデフォルトのポート番号ってやつです。
この80を、5173にして
http://localhost:5173/vuephp/select.php
でいかがでしょうか。

Comments

[takahashi-one]

回答ありがとうございます。
5173はvite側のサーバーです。
phpはapacheのサーバーにあります。5173のvite側にはありません。
vite側のApp.vue(127.0.0.1:5173)からapache(localhost)にあるphpにアクセスします
なのでhttp://localhost:5173/vuephp/select.phpとすると404 (Not Found)になります