Question

我正在开发一个react应用程序，该应用程序提供有关用户选择的那个国家的旅游景点的信息。

当前，我的应用通过<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>";
?>

URL没问题。

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

我在Google上搜索后发现，如果下载了，则我的Web服务器配置存在一些问题。

Submit button is downloading the php instead of running it

和

Form submit, downloads php

但是，如果我使用npm start运行文件和localhost，该如何解决配置问题？不是Apache？还是一样？

我试图用apache网络服务器（我已经有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等。使用标准的Web服务器配置，索引文件需要位于Web服务器的根目录中；如果使用的是xampp，则该目录为htdocs /目录。因此，基本上，您只能使用标准配置运行一个项目。如果必须运行多个项目，则必须为apache配置虚拟主机。

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

为了明确起见，下面所有这些链接实际上都是在服务器index.php上，而不是子目录中的任何.php文件：

有一个名为.htaccess的配置文件（特定于Apache），它负责处理很多事情，其中一些正在将参数传递给入口点并重写实际的url。（如果已配置）

所以您可以做的就是...只需单击应位于htdocs /目录而不是/public/server/search.php的index.php，然后返回您选择的值。

不要因为现代框架而感到困惑，因为index.php位于子目录中，它只是一种更安全的方法，并且可以配置入口点。

主要的XAMPP配置文件位于：

apache配置文件：

\ xampp \ apache \ conf \ httpd.conf
\ xampp \ apache \ conf \ extra \ httpd-xampp.conf

php配置文件：

\ xampp \ php \ php.ini

mysql配置文件：

\ xampp \ mysql \ bin \ my.ini

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

1 个答案: