我正在创建一个非常基本的登录页面,并且我试图使用php来验证用户登录。这是我用来访问php文件的代码。
axios.post("login.php", {
user: 'Fred',
pass: 'Flintstone'
})
.then(function (response) {
console.log(response);
})
.catch(function (error) {
console.log(error);
});
PHP文件位于react应用程序的src文件夹中。
── src
│ ├── components
│ │ ├── BrowsePage
│ │ │ ├── BrowsePage.css
│ │ │ ├── BrowsePage.js
│ │ │ └── default.jpg
│ │ ├── CreatePage
│ │ │ ├── CreatePage.css
│ │ │ └── CreatePage.js
│ │ ├── Header
│ │ │ ├── Header.css
│ │ │ └── Header.js
│ │ ├── LoginPage
│ │ │ ├── LoginPage.css
│ │ │ ├── LoginPage.js
│ │ │ └── logo.svg
│ │ ├── ProfilePage
│ │ │ ├── ProfilePage.css
│ │ │ └── ProfilePage.js
│ │ └── RecPage
│ │ ├── default.jpg
│ │ ├── RecPage.css
│ │ └── RecPage.js
│ ├── index.css
│ ├── index.js
│ ├── login.php
│ └── registerServiceWorker.js
当我拨打电话时,它会记录
xhr.js:178 POST http://localhost:3000/login.php 404 (Not Found)
php文档的当前路径不起作用,我尝试过的其他任何工作都没有。对这个php文档进行axios调用的路径是什么?
答案 0 :(得分:1)
您需要在本地设置一个服务器,您的React应用程序可以代理某些http请求。此服务器将运行您的login.php脚本并验证用户名/密码。 create-react-app
在您的package.json中查找proxy
值,并告诉webpack-dev-server
将对api/foobar
的任何调用转发到您声明后端将运行的任何位置。
在你的package.json中添加:
"proxy": "http://localhost:8000"
这告诉React将对http://localhost:3000/api/login
的请求转发给http://localhost:8000/api/login
然后修改你的axios调用看起来像这样
axios.post("/api/login", ..., ...).then()
接下来,您必须在http://localhost:8000
上运行PHP服务器并设置服务器应用程序以处理对/api/login
发出的POST请求。
我不是一个PHP家伙,但我听说Laravel很高兴能与之合作。如果您的PHP后端完全位于自己的目录中会更容易。