JSON Ajax stringify

strong97

Hallo,

ich wollte meine Daten per JSON.Stringify senden, jedoch bekomm ich ein Problem.

Wenn ich "dataType: 'json' oder "Content-type", "application/json" benutze, sehe ich keine Daten mehr.

Seite1.php

Spoiler anzeigen

JavaScript

$('.send').on('click', function(event) {
    
        event.preventDefault();
        
        var name = $('.name').val();
        
        var nachname = $('.nachname').val();
        
        var datas = {
            name: name,
            nachname: nachname
        }
        
        $.ajax({
            
            type: 'POST',
            url: 'name.php',
            async: false,
            dataType: 'json',
            data: {json: JSON.stringify(datas)},
            success: function(data) {
                $('#output-data').html(data);
            }
        
        });
    
    });

Alles anzeigen

name.php

Spoiler anzeigen

PHP

$decode = json_decode($_POST['json'],  JSON_UNESCAPED_SLASHES);
    
    foreach($decode as $value) {
        
        echo $value . ' ';
        
    }

Wenn ich dataType: 'json' weglasse oder Content-Type: ap.../json weglasse, klappt es. Ich versteh aber nicht wieso?

Zweite Frage ist:

Wieso benutzen die meistens um Daten zu übergeben mit Ajax JSON.stringify und nicht einfach data: {name:name} ?

Hier mal ein Video:

Externer Inhalt www.youtube.com

Inhalte von externen Seiten werden ohne Ihre Zustimmung nicht automatisch geladen und angezeigt.

Durch die Aktivierung der externen Inhalte erklären Sie sich damit einverstanden, dass personenbezogene Daten an Drittplattformen übermittelt werden. Mehr Informationen dazu haben wir in unserer Datenschutzerklärung zur Verfügung gestellt.

Sempervivum

In der Doku von $.ajax steht:

Zitat

dataType (default: Intelligent Guess (xml, json, script, or html))

Type: String

The type of data that you're expecting back from the server.

d. h. dieser Parameter definiert, welche Daten vom Server in Empfangsrichtung zurück erwartet werden. Mit dem Senden der Parameter hat das nichts zu tun. D. h. deine "datas" musst Du so wie sie sind an die Funktion übergeben.

strong97

Zitat von Sempervivum

In der Doku von $.ajax steht:

d. h. dieser Parameter definiert, welche Daten vom Server in Empfangsrichtung zurück erwartet werden. Mit dem Senden der Parameter hat das nichts zu tun. D. h. deine "datas" musst Du so wie sie sind an die Funktion übergeben.

Aber wie kann ich die Parameter eindeutig machen? z.b so:

Place: Köln <br>

PLZ: 50674

Wenn ich daten per Json in meine Name.php seite sende.

Code

Spoiler anzeigen

HTML

<div id="output-data">
    
    </div>

<form method="POST">
    <input type="text" name="plz" class="plz">
    <button type="submit" class="send">Senden</button>
</form>

<script>
    
    $('.send').on('click', function(event) {
    
        event.preventDefault();
        
        var name = $('.plz').val();
                
        $.ajax({
            
            type: 'POST',
            url: 'name.php',
            data: {plz:plz},
            success: function(data) {
                $('#output-data').html(data);
            },
            error: function(data) {
                alert(data);
            }
        
        });
    
    });
    
</script>

Alles anzeigen

Name.php

Spoiler anzeigen

PHP

<?php

$plz = $_POST['name'];

$curl = curl_init();

curl_setopt_array($curl, array(
  CURLOPT_URL => "https://api.postleitzahlapi.de/v1/postcodes/$plz",
  CURLOPT_RETURNTRANSFER => true,
  CURLOPT_ENCODING => "",
  CURLOPT_MAXREDIRS => 10,
  CURLOPT_TIMEOUT => 30,
  CURLOPT_HTTP_VERSION => CURL_HTTP_VERSION_1_1,
  CURLOPT_CUSTOMREQUEST => "GET",
  CURLOPT_HTTPHEADER => array(
    "accept: application/hal+json",
    "x-api-key: WqfwLHlFeg9P6C38YplE2ax7Fq7pBgQz9oL7kyxz"
  ),
));

$response = curl_exec($curl);
$err = curl_error($curl);

curl_close($curl);

if ($err) {
  echo "cURL Error #:" . $err;
} else {
  echo $response;
}
?>

Alles anzeigen

Wenn ich es ausgebe steht da sowas:

Zitat

{"district":null,"postcode":"50674","place":"Köln","state":"Nordrhein-Westfalen","_links":{"self":{"href":"https://api.postleitzahlapi.de/v1/postcodes/50674/"}}}

Ich möchte aber die Parameter eindeutig haben und zu Variablen machen.

"place" zu $place

oder

"postcode" zu $postcode

Sempervivum

Mit dem Code aus deinem ersten Posting warst Du schon auf dem richtigen Weg. Wenn Du dataType:'json' angibst, veranlasst jQuery bereits das Parsen und stellt die Daten in einer Javascript-Struktur zur Verfügung. Du kannst dich davon überzeugen, indem Du die Daten in der Console ausgibst. Aus dieser Struktur kannst Du die Daten einfach auslesen und Variablen zuweisen:

Code

    $('.send').on('click', function(event) {
    
        event.preventDefault();
        
        var plz = $('.plz').val();
                
        $.ajax({
            
            type: 'POST',
            url: 'name.php',
            data: {plz:plz},
            dataType: 'json',
            success: function(data) {
                // Die Antwort vom Server wurde bereits geparsed und steht
                // jetzt nicht als String sondern als JS-Struktur zur Verfügung
                console.log(data);
                var ort = data.place;
                var bundesland = data.state;
                // jetzt stehen Ort und Bundesland in den Variablen zur Verfügung
            },
            error: function(data) {
                alert(data);
            }
        
        });
    
    });

Alles anzeigen

strong97

Super das hat ja geklappt. Danke dir dafür! Nur eine einzige Sache verstehe ich nicht. Ich sende die Daten ja an name.php. Wieso gibt name.php mir nichts aus? In der Console klappt alles aber hab extra eine DIV erstellt namens Output wo z.b stehen soll echo $_POST['plz'];

Jedoch zeigt er mir gar nichts an. Ich kann da sogar irgendwas hinschreiben bei der name.php aber es wird einfach nicht "geoutputet"

Sempervivum

Wenn Du mit JSON arbeitest, kannst Du nichts zusätzlich ausgeben, weil das die Syntax zerstören würde. Du musst die Antwort auswerten und ausgeben, z. B. so:

Code

            success: function(data) {
                // Die Antwort vom Server wurde bereits geparsed und steht
                // jetzt nicht als String sondern als JS-Struktur zur Verfügung
                console.log(data);
                var ort = data.place;
                var bundesland = data.state;
                // jetzt stehen Ort und Bundesland in den Variablen zur Verfügung
                // und können weiter verarbeitet und z. B. ausgegeben werden:
                $('#output-data').html("Ort: " + ort + " Bundesland: " + bundesland);

Alternativ könntest Du das Ganze auch serverseitig machen: Im PHP-Skript das JSON parsen und das gewünschte HTML generieren. Dann müsstest Du aber dataType:'json' im Ajax-Aufruf weg lassen bzw. durch 'text' ersetzen.

strong97

Wenn ich es Serverseitig mache und Parsen möchte, benutze ich vor dem Senden diese Funktion:

Spoiler anzeigen

JavaScript

$.ajaxSetup({
            beforeSend: function(xhr) {
            
                xhr.setRequestHeader('Content-Type', 'application/json');
            
            }
        })

Problem ist hierbei:

Variable ist undefiniert:

bsp. $_POST['plz'];

Wenn ich den Header einfüge funktoniert es, ist aber dann nicht mehr sicher da ich den Content-Type JSON eingeben muss da ich es auch ja mit json parse usw.

JavaScript

application/x-www-form-urlencoded; charset=UTF-8

Sempervivum

Damit bin ich jetzt nicht vertraut, aber IMO brauchst Du beim Senden nichts zu verändern, wenn Du es serverseitig machen willst. Nur das PHP-Skript ändern, d. h. parsen und HTML generieren.

strong97

Zitat von Sempervivum

Damit bin ich jetzt nicht vertraut, aber IMO brauchst Du beim Senden nichts zu verändern, wenn Du es serverseitig machen willst. Nur das PHP-Skript ändern, d. h. parsen und HTML generieren.

Aso, weil hab mal glaube ein Artikel gelesen wegen der Sicherheit mit Json, Oder gilt das nur wenn man es Client-Seitig macht?

€: Sorry hab den Request Header mit Response Header verwechselt..bedanke mich bei dir für die Zeit und Lösungsschläge

Jetzt mitmachen!