Wie kann ich eine JavaScript-Variable via AJAX an PHP übergeben?
Hallo liebe Community,
ich möchte in JavaScript einen Text anhand von Eingaben eines Users zusammenbauen, was auch reibungslos funktioniert.
Da ich noch nie zuvor wirklich mit PHP gearbeitet habe, da ich bisher keinen Server benötigt habe, weiß ich leider nicht genau, wie man mit AJAX einen String bzw. den Text an PHP übergibt, um es dann als E-Mail mit der mail-Funktion von PHP weiterzuleiten.
Bevor ich hier Antworten erhalte, ob ich nicht wüsste, was PHP ist: Doch dies weiß ich und möchte wirklich nur wissen, wie genau ich den AJAX-Request erstellen muss, um diese Variable an PHP zu versenden. Wenn dies geschehen ist, muss allerdings auch PHP darauf reagieren. Wie stelle ich das an?
4 Antworten
Du kannst die fetch-Funktion nutzen.
JavaScript:
const message = "your text to send";
fetch("URL to your php script", {
method: "POST",
body: new URLSearchParams(`message=${message}`)
})
.then(response => response.text())
.then(result => alert(result))
.catch(error => alert(error));
Die Nachricht, die an die Serveranwendung verschickt werden soll, wird als Schlüsselwertzeichenfolge im Request Body verstaut (Schlüssel: message, Wert: Die Nachricht). Das URLSearchParams-Objekt sorgt hierbei für eine URL-Kodierung.
Sobald die Serveranwendung ihrerseits auf die Anfrage antwortet, wird die Antwort als Plaintext geparst (response.text), das Ergebnis steht dann in result und wird in diesem Beispiel in einem kleinen Dialogfenster ausgegeben. Sollte die Anfrage jedoch scheitern (z.B. wegen einem Verbindungsfehler), wird die Fehlermeldung angezeigt.
PHP:
<?php
if (isset($_POST['message'])) {
$message = $_POST['message'];
// validate message and send mail ...
print "Success";
exit;
}
print "No valid request.";
Das PHP-Skript kann die geschickten Daten anschließend auslesen. Alle via POST-Methode verschickten Daten werden im superglobalen Array $_POST gespeichert.
Das, was das PHP-Skript (via print, echo, o.ä. Ausgabefunktionen) in den Response Body schreibt, wird später in der JavaScript-Variable result stehen.
Wie schon geschrieben, geht das am einfachst mit der Fetch-API. In Javascript könnte das dann zum Beispiel so aussehen:
async sendData(message) {
try {
const request = fetch("https://example.org/script.php", {
method: "POST",
headers: {'Content-Type' : 'application/json'},
body: JSON.stringify({
action: 'send',
message: message,
}),
});
const response = await request;
const result = await response.json();
if (result.success) {
this.questionSets = result.sets;
}
return true;
} catch (error) {
console.error("Result error:", error);
} finally {
}
return false;
}
Mit der Funktion sendData kannst du dann einen String an dein PHP-Script schicken. Im PHP-Script kannst du die Daten so empfangen und verarbeiten:
<?php
$data = file_get_contents('php://input');
$jsonRequest = json_decode($data);
if (isset($jsonRequest->action) && $jsonRequest->action == 'send') {
// mach irgendwas mit $jsonRequest->message
die(json_encode((object)[
'success' => true,
]));
}
die(json_encode((object)[
'success' => false,
'message' => 'Unkown command',
]));
In $jsonRequest->message ist dann dein Text enthalten.
Natürlich brauchst du deinen Server, unter dem das PHP-Script arbeiten kann. irgendwohin muss deine Fetch-URL ja zeigen.
Ich sage es mal so, wenn du so was machen willst, musst du dich schon vorher mal mit den Grundlagen beschäftigen.
Ja, natürlich brauchst du ein PHP-Script in einer externen Datei. In meinem Beispiel ist das script.php unter der Domain example.org. Das musst du natürlich anpassen.
Es gibt verschiedene Wege, der einfachste wäre über die URL Parameter die du in PHP einfach über eine Map abrufen kannst.
Außerdem kannst du über eine POST Request auch im Body deiner Anfrage Daten senden die du z.B. als JSON formatieren kannst.
In JS würdest du die fetch API nutzen
https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API/Using_Fetch
In PHP https://www.php.net/manual/en/reserved.variables.get.php
https://stackoverflow.com/questions/8945879/how-to-get-body-of-a-post-in-php
Warum so umständlich ?
Und GET ist ganz schlechte Wahl!
Geht in PHP mit POST Daten ganz einfach
Wozu erst umständlich mit Axa die Eingabe bearbeiten. Es wäre doch viel einfacher ein ganz normales HTML-Formular zu benutzen und die dann ganz nochmal mit POST Daten ans PHP zu schicken
Ich erhalte nach wie vor selbst bei meinen vorherigen Versuchen immer den Fehler
POST 405 (Method Not Allowed)
hat das etwas damit zu tun, dass ich noch keinen localserver installiert habe ?