Postare dati a file php da app Reactjs

Luke220898

Nuovo Utente
27 Giu 2018
4
0
1
Buonasera,ho un problema con un app Reactjs.
Il problema riguarda la sua integrazione con un file php.
Questa è la prima domanda che posto,perciò se ho sbagliato sezione scusatemi e abbiate un po' di pazienza.
Infatti non sapevo bene in quale sezione postare perchè la domanda comprende javascript,Reactjs,nodejs,php,html,e mysql.

Adesso cercherò di spiegare bene il mio problema.
Ho creato un app Reactjs tramite il comando di nodejs create-react-app.
Poi ho creato una pagina di Login(con React) in cui l'utente deve inserire username e password.
Una volta inseriti questi dati devono essere mandati con method="POST" inserito nell'html tramite React, ad un file index.php che deve verificare i dati su un database mysql.
Creando la pagina web in puro javascript e html il tutto funziona,ma con l'app Reat no.
Infatti al momento del click sul bottone "Login"(submit) sulla pagina ricevo il seguente messaggio:
cannot POST /index.php
Il file Login.js è nella cartella "src",invece index.html e index.php sono nella cartella "public".
L'app è eseguita sul server localhost:3000 invece il database mysql l'ho creato tramite xampp e phpmyadmin,(il server però è su un'altra porta).

Il codice Reactjs è il seguente:
Codice:
import React,{Component} from 'react';
import "./LoginView.css";
import logo from './resources/images/User.svg'

class LoginView extends Component{
render(){
return(
<div className={"LoginView"}>
<div id="LoginView">
<img className="LoginImage" src={logo} alt={"logo"}/>
<form id="LoginForm" action="index.php" method="post" >
<input type="text" id="Username" name="Username" placeholder="Username" required/>
<input type="password" id="Password" name="Password" placeholder="Password" required/>
<input type="submit" id="LoginButton" value="Login"/>
</form>
</div>
</div>
);
}
}
export default LoginView;

Quello di index.php è questo:
PHP:
$Username=$_REQUEST["Username"];
$Password=$_REQUEST["Password"];

echo $Username,"/",$Password;

$Conn=mysqli_connect("localhost","root","password");

if(!$Conn){
echo "Server al momento non disponibile.\n";
echo "Riprova:<a href='index.html'>Click qui</a>";
}
else{
if(!mysqli_select_db($Conn,"users")){
echo "Impossibile aprire Database users.\n";
echo "Riprova:<a href='index.html'>Click qui</a>";
}
else{
$sql="SELECT * FROM accesso where username='$Username' and password='$Password'";
}
$result=mysqli_query($Conn,$sql);


if(mysqli_num_rows($result)>0){
echo "User Accettato!.\n";
echo "Prosegui:<a href='index.html'>Click qui</a>";
}
else{
echo "User Rifiutato!.\n";
echo "Riprova:<a href='index.html'>Click qui</a>";
}
}

?>

Quello dell'index.html è quello creato di default dal comando create-react-app.

Sto cercando da tempo una soluzione,ma su internet non ho trovato niente.
Ringrazio in anticipo chi mi aiuterà,e se ritenete che ci sia un modo più adeguato/semplice/corretto per fare ciò sarei felice che lo condivideste con me,dato che sono alle prime armi e voglio imparare a fare le cose correttamente,grazie.

ps.Non ho capito come indentare correttamente il codice.
 

Discussioni simili