我的 React 应用程序中的表单标签下载 php 文件。怎么解决？

Question

我正在开发一个反应应用程序，它提供有关用户选择的国家/地区的旅游景点的信息。

目前，我的应用程序通过

<form>

标签与服务器通信。

这是我的反应代码：

class App extends React.Component{
submitForm = (e)=>{
}
render(){
    return(
        <div>
            <section id="Search" onSubmit={this.submitForm}>
                <form action="/public/server/search.php" method="GET">
                    <input placeholder="search country, attraction names" type="text" name="search"/>
                    <button type="submit">SEARCH</button>
                </form>
            </section>
            <ItemList/>
        </div>
    )
}

}

php 文件：这只是测试代码。用于检查我的 php 文件是否有效。

<?php
 $message = "wrong answer";
 echo "<script type='text/javascript'>alert('$message');</script>";
?>

网址没有问题。

问题是当用户提交时，浏览器下载 php 文件而不是运行它。

我用谷歌搜索，发现如果可以下载，则说明我的网络服务器配置有问题。

提交按钮正在下载 php 而不是运行它

和

表单提交，下载php

但是如何解决使用 npm start 运行文件和 localhost 时的配置问题？不是阿帕奇？或者是一样的吗？

我尝试使用 apache webserver 运行我的文件（我已经有 XAMPP），但它显示 404 错误，因为它找不到 bundle.js （webpack 文件）。

这是我的 package.json 文件：

{
"name": "ReactExample",
"version": "1.0.0",
"description": "",
"main": "index.js",
"scripts": {
  "test": "echo \"Error: no test specified\" && exit 1",
  "start": "webpack-dev-server --config ./webpack.config.js --mode 
   development"
},
"keywords": [],
"author": "",
"license": "ISC",
"devDependencies": {
"babel-core": "^6.26.3",
"babel-loader": "^7.1.5",
"babel-preset-env": "^1.7.0",
"babel-preset-react": "^6.24.1",
"babel-preset-stage-2": "^6.24.1",
"webpack": "^4.16.0",
"webpack-cli": "^3.0.8",
"webpack-dev-server": "^3.1.4"
},
"babel": {
  "presets": [
    "env",
    "react",
    "stage-2"
  ]
},
"dependencies": {
  "classnames": "^2.2.6",
  "react": "^16.4.1",
  "react-dom": "^16.4.1",
  "react-redux": "^5.0.7",
  "redux": "^4.0.0"
}
}

Answer 1

发送到您的网络服务器的请求通常会点击

index.php

或

.html

等等。

使用标准网络服务器配置，索引文件需要位于网络服务器根目录中，如果您使用 xampp，则为 htdocs/ 目录。所以基本上你只能用标准配置运行一个项目。如果您必须运行多个项目，您必须为 apache 配置虚拟主机。

发生的情况是，您尝试使用您的请求点击“http://localhost:80/public/server/search.php”，并期望 php 执行该文件，但事实上，您的应用程序的唯一入口点是根目录中的索引文件。

所以澄清一下，下面的所有这些链接实际上都在访问服务器

index.php

，而不是子目录中的任何

.php

文件：

• http://awesomedomain.com/posts/show/1
• http://awesomedomain.com/contact
• http://awesomedomain.com/downloads/catpics

有一个名为

.htaccess

（特定于 apache）的配置文件，它负责很多事情，其中一些将参数传递给入口点并重写实际的 url。 （如果已配置）

所以你可以做的是......只需点击你的

index.php

，它应该位于 htdocs/ 目录而不是 /public/server/search.php 并返回你选择的一些值。

不要对现代框架感到困惑，其中

index.php

位于子目录中，这只是一种更安全的方法，并且可以配置入口点。

主要的 XAMPP 配置文件位于以下位置：

apache 配置文件：

• \xampp 帕赫