AJAX/RestController Post Problem

Sternenregen

Mitglied
Grüße euch,

Ich bin hart genervt. Sitze seit über 8 Stunden ab den Mist und ich komm nicht weiter. Ich hab schon so viele Dinge probiert, dass ich das hier gar nicht alles aufzählen kann. Es ist bestimmt irgend ein grundlegender Fehler.

Ich will über ein HTML Dokument ein AJAX Skript aufrufen, dass einen simplen String an einen Restcontroller @POST/PUT schicken soll. Der entsprechende Methode wird auch getriggert, allerdings ist der übergebene String IMMER null. Ich habe Postman genommen. Dort kommt der String an und wird verarbeitet. Das sagt mir, dass es am AJAX Script bzw dem HTML Teil liegt.

Die Forms performen ja in der Regel nur ein GET und kein POST. Daran wirds irgendwie liegen. Aber ich weiß nicht mehr weiter. Hab komplett Google umgegraben. Ich habe viele LÖsungen gefunden. Muss gestehen, ich arbeite jetzt das erste mal mit AJAX bzw Javascript im Allgemeinen so richtig.


Zur Erklärung: "operator" ist der Parameter der in dem RestController erwartet wird.



Hier die AJAX Function und der HTML Teil. Der RestController tut was er soll.

d1.PNG

Und hier der relevante HTML Teil:

Code:
    <div id="formDiv">
        <form id="form" method="post">
            <input type="text" id="display">
           
                <div class="batteryBlock">      
                    <table>
                        <tr>                          
                            <td><button type="submit" onClick="test()" id="bat" class="btnNum"  value = "+">+</button></td>          
                        </tr>






Erlöst mich bitte.
 

Thallius

Top Contributor
mach mal Type=„Button“. ehrlich gesagt habe ich keine Ahnung was passiert wenn du submit und onClick gleichzeitig benutzt aber der submit müßte eigentlich einen Page reload Auslösen was sicherlich nicht gewollt ist
 

Sternenregen

Mitglied
Selbst von diesem AJAX-Script, hatte ich schon unzählige Versionen davon. Meine Content-Types u.a. so aus: text/plain, text, 'application/x-www-form-urlencoded'
usw... Und sogar laut Dokumentation komplett weggelassen, da letzteres eigentlich auch der default Wert ist.

Hab aber mal einen Script Validator drüberlaufen lassen, der monierte da @action("url...."). Hab jetzt nur url: "localhost:8080" dortstehen.

Der content-type sieht zumindest schräg aus, was sendet der Browser da denn genau?

Ich habe einen RestController. In meinem speziellen POST Methode gibt es keinen Pfad sondern nur ein Parameter der verlangt wird. Wenn ich es nicht verwechsel (Hab in dem Gebiet erst vor 4 Tagen begonnen) ist es ja glaub ich da der Vorteil dass die URL gleich bleibt.

Ich hoffe es gibt vom Ergebnis einen Unterschied zwischen
Code:
 var muell = { "operator": "umpalumpa" }
und
Code:
 data: {"operator": "umpalumpa"},
Was ich bisher gelesen habe, ist der erste Wert, der Parametername und der zweite (umpalumpa), der Wert, der darin gespeichert werden soll.
Falls dem nicht so ist, hab ich den Fehler gefunden. Weil ansonsten wird ja nur das object ausgegeben und ich müsste es ähnlich wie bei JSON stringifyen :) Aber da der DataType nur "text" ist...


Wie kann ich denn testen was bei einem ajax-Script versendet wird? Hab versucht in das Script sowie in der Success bzw Error ein Alert einzubauen. Aber das wird nicht aufgerufen. Das sagt mir eigentlich dass der Fehler vor dem Success: sein muss. Aber wie gesagt. ich hab schon alles erdenkliche ausprobiert.

Trotz allen hab ich das data: im Verdacht.
 

sascha-sphw

Top Contributor
Den Request kannst Du Dir im Browser in den Dev-Tools Anschauen. F12 (Chrome, Firefox, IE, Edge) da findest Du dann einen Bereich in dem die ganzen Requests angezeigt werden. HINT: erst Dev-Tools öffnen, dann Request absetzen.

Wie erwartest Du denn die Daten am RestController? Passend dazu musst Du sie über JS abschicken.
 

sascha-sphw

Top Contributor
Über Insomnia kann man sich das JavaScript eines Requests generieren lassen. Ich kann mir gut vorstellen, dass Postman das auch kann.
 

Sternenregen

Mitglied
Wie erwartest Du denn die Daten am RestController? Passend dazu musst Du sie über JS abschicken.
Der RestController erwartet an der Stelle einen String.

So sieht der Methodenkopf aus:
Code:
public String setTest(@RequestParam(required=false) String operator)

Ich hab jetzt mal in Chrome nachgeschaut. Die Request Methode ist auf jeden Fall POST. Aber die Content-Länge ist 0. Sowohl beim Request wie auch bei der Response. Aber das zeigt mir auch die JavaConsole an, dass der String null ist.

Die Frage ist warum.

Achja und Postman hab ich schon genutzt. Das Post funktioniert und die Werte werden auch übertragen. Das sagt mir persönlich, dass das Problem bei dem data: liegt bzw an der Stelle, wo in dem AJAX der Text übergeben wird.

Aktuell sieht das Skript so aus:


Code:
function test(){
        
        alert("springe in ajax funktion");   
        
         $.ajax({
                url: "localhost:8080",
                type: "POST",
                dataType: 'text',
                data: { 'operator': 'foooooo'},
                cache: false,
                              
                success: function (data) {                   //Springt nicht rein
                    alert("Es funktioniert endlich");
                },
              
                error: function(data){                       //Springt nicht rein
                    alert("Es geht nicht, aber es läuft");
                }
            });   
        
         alert("muh");                                      //Springt nicht rein
    }
 

Thallius

Top Contributor
Also für mich ist das kein String sondern ein JSON. Von daher würde ich es ganz blöd mal mit datatype: "json" probieren. Weiterhin finde ich es befremdlich, dass die URL der Root ist. Normalerweise nimmt man hier eine URL die den Namen der API Methode enthält. Also Localhost:8080/setUser oder sowas. Weiterhin adde doch mal

Code:
.done(function() { console.log("Done"); } );

zum request hinzu. Vielleicht wird das ja aufgerufen
 

mrBrown

Super-Moderator
Mitarbeiter
Also für mich ist das kein String sondern ein JSON. Von daher würde ich es ganz blöd mal mit datatype: "json" probieren.
dataType ist der Typ, den man vom Server zurück bekommt. Ist in diesem Fall String, text ist also völlig richtig.


Weiterhin finde ich es befremdlich, dass die URL der Root ist. Normalerweise nimmt man hier eine URL die den Namen der API Methode enthält. Also Localhost:8080/setUser oder sowas
Eine Methode in der URL stehen zu haben ist eigentlich das genaue Gegenteil von üblich – das gilt bei Rest als ziemliches Antipattern.
Da der Controller auch aufgerufen wird, scheint die URL korrekt zu sein.
 

Sternenregen

Mitglied
OMG.

Jetzt gehts. Nach der url hat ein / gefehlt. Also localhost:8080/.

Ich dachte immer und machte immer localhost:8080?operator=fooo

10 Stunden wegen einem Schrägstrich.

!!

Aber das Ganze offenbart mir, dass ich den Part mit dem data: offenbar doch nicht so ganz verstanden habe.

Es hatte jetzt funktioniert weil ich in die URL:
Code:
   url: "localhost:8080/?operator=fooo",

Aber ist nicht gerade der Sinn von data: den Parameternamen und den Wert zu übermitteln? Hab es grad getestet.
Code:
localhost:8080/?
data: { 'operator':'foooooo'},

geht auch nicht. Ich hatte mir Dokumentation angeschaut und hatte das so rausgelesen.
 
Zuletzt bearbeitet:

Sternenregen

Mitglied
Jap. So siehts aus.

Ich dachte die ganze Zeit

localhost:8080?operator=fooo == url:"localhost:8080", data: { 'operator':'foooooo'}

Aber beides ging nicht.

localhost:8080/?operator=foo


läuft
 
Zuletzt bearbeitet:

Sternenregen

Mitglied
Ich hab mir jetzt nochmal die offizielle Dokumentation angeschaut: https://api.jquery.com/jquery.ajax/
Ich erkenne keinen Fehler.

Laut Doku:
data: { 'operator':'foooooo'} = operator=foooooo

Gut, wenn man danach geht, fehlt ja noch das Fragezeichen. Und nimmt man noch das / dazu, müsste es ja theoretisch in der Kombination
ja hinhauen:

localhost:8080/?
data: { 'operator':'foooooo'}


Tut es aber nicht. Woran liegt das? Der Fehler muss daher im data: liegen. Ich will das verstehen. Weiß das jemand?
 

Sternenregen

Mitglied
Ja, aber warum wird das nicht berücksichtigt? Der RestController/POST/PUT wird ja getriggert und die Anfrage kommt an. Warum nicht der Inhalt?

Es ist wie du sagst, ein POST-Request. Und ich habe den Parameter und den Wert mit angegeben.
Das data: { 'operator':'foooooo'} müsste ja im Body stehen. Oder versteh ich das falsch.

Ich glaub das Ganze resultiert daraus, dass das GET Request eher abgefeuert wird als das AJAX. Und deswegen ist es immer null. Ich guck mal. Da gibt es ja etwas, um dieses zu unterbinden. Wenn es funzt, schreibe ich es hierher.
 
Zuletzt bearbeitet:

sascha-sphw

Top Contributor
Ja, aber warum wird das nicht berücksichtigt? Der RestController/POST/PUT wird ja getriggert und die Anfrage kommt an. Warum nicht der Inhalt?
Der Inhalt kommt wahrscheinlich im Body auch an, nur wird er von Deinem Service nicht ausgewertet, die Annotation @RequestParam steht für einen Query oder einen Form Parameter. Wenn ich mich nicht irre.

Versuchs mal so:
Javascript:
$.ajax({
  "url": "http://localhost:8080/",
  "method": "POST",
  "headers": {
    "content-type": "application/x-www-form-urlencoded"
  },
  "data": {
    "operator": "fooo"
  }
}).done(function (response) {
  console.log(response);
});

Wenn Du den Body auswerten möchtest, sollte im Controller sowas stehen.
Java:
public class MyDto {
    private String operator;
   
    // getters setter omitted
}

@PostMapping
public String setTest(MyDto dto) { ... }

Und dann mit JS:
Javascript:
$.ajax({
  "url": "http://localhost:8080/",
  "method": "POST",
  "headers": {
    "content-type": "application/json"
  },
  "processData": false,
  "data": JSON.stringify({
      operator: "fooo"
  })
}).done(function (response) {
  console.log(response);
});

PS: Code nicht getestet, es könnten also Fehler enthalten sein.
 

sascha-sphw

Top Contributor
Achja und Postman hab ich schon genutzt. Das Post funktioniert
Ja, was ich meinte, ist dass es in Postman die Möglichkeit gibt, sich von dem funktionierenden Request das jQuery Script generieren zu lassen.
 

mrBrown

Super-Moderator
Mitarbeiter
Der Inhalt kommt wahrscheinlich im Body auch an, nur wird er von Deinem Service nicht ausgewertet, die Annotation @RequestParam steht für einen Query oder einen Form Parameter. Wenn ich mich nicht irre.
application/x-www-form-urlencoded ist der default, und zumindest in der letzten Variante hier im Thread ist nichts anderes angegeben, es sollte also ganz normal als Form-Daten gesendet werden.
 

mrBrown

Super-Moderator
Mitarbeiter
Habs grad extra getestet, dieser Request funktioniert völlig Problemlos:

Javascript:
$.ajax({
    url: "http://localhost:8080",
    type: "POST",
    data: {'operator': 'foooooo'},
    success: function (data) {
        alert("Es funktioniert endlich: " + data);
    }
});

Und auf Spring-Seite einfach nur ein @PostMapping("/") @ResponseBody public String test(@RequestParam String operator)


OMG.

Jetzt gehts. Nach der url hat ein / gefehlt. Also localhost:8080/.
Mit Chrome und jQuery 3.1.1 produzieren "http://localhost:8080" und "http://localhost:8080/" genau den gleichem Request, der Slash am Ende ist da völlig egal.
 
Ähnliche Java Themen
  Titel Forum Antworten Datum
pkm Probleme mit einem AJAX-Call in einem dynamischen Webprojekt Web Tier 15
J JSF/JEE6 asynchronie Statusmeldungen per ajax Web Tier 1
J Funktion für AJAX - Problem mit Return Web Tier 14
D Servlet 1 Servlet für alles - Wie Cookies per Ajax? Web Tier 1
J Wicket: Füllen von Textarea via AJAX irgendwo auf der PAGE Web Tier 1
S JSF mit Ajax? Web Tier 3
V Wie baue ich eine Ajax Webanwendung? Suche Beispielanwendung (UML) eines AJAX Service Web Tier 0
P JSF Ajax aktualisiert Seite neu Web Tier 2
L JSF Composit Component mit ajax funktioniert nicht. Web Tier 4
M Ajax Fehler zur Laufzeit Web Tier 5
T JSF Primefaces: DataTable Ajax Update - Weiterleitung von anderer Seite Web Tier 11
S JSF SelectOneMenu - Probleme mit AJAX Web Tier 6
S JSF ComboBox mit JSF 2.0/ajax Web Tier 4
Kenan89 Class Funktion mit Ajax rufen Web Tier 13
P JSF tag "ajax" not found Web Tier 3
M JSF DataTable refreshen mit Ajax? Web Tier 5
R JSF Mit Ajax ganze Seite neu laden Web Tier 2
J Ajax ist undefiniert Web Tier 3
P JSF AJAX render wird nicht ausgeführt Web Tier 4
M JSF Ajax Command Link Web Tier 2
X Seite wird mit AJAX neu geladen Web Tier 4
J JSF AJAX-Aufruf ohne Komponente Web Tier 4
S Richfaces 4.0 Ajax Waitingpanel Web Tier 2
G JSF 2x h:selectManyCheckbox ohne duplikate Auswahl/selectManyCheckbox und f:ajax Web Tier 3
P JSF Login per Ajax validieren. Was ist der Beste Weg? Web Tier 4
S Ajax Request verhindert forward? Web Tier 8
P JSF Ajax refresh nach Linkklick Web Tier 4
B Ajax JSON Objekt verschicken Web Tier 3
N Htmlunit Test mit Ajax Web Tier 2
D JSF Ajax mit Facelets (PrimeFaces) Web Tier 4
G mit Ajax ein Image vom Server holen Web Tier 2
J JSP und Ajax Web Tier 6
7 Struts+AJAX- Session-Handling? Web Tier 2
H Richfaces - Taglib Problem gelb unterstrichen Ajax Output Web Tier 6
S Framework, AJAX Drag and Drop Hilfe? Web Tier 2
H Welches Ajax Framework Web Tier 8
7 Struts und Ajax. Problem mit Actions Web Tier 2
F AJAX: Inhalt nachladen + load icon Web Tier 2
I AJAX - Problem Web Tier 18
I AJAX update Web Tier 2
T <f:ajax> in JSF2.0 Komponente ein- und ausblenden Web Tier 4
D [JSF] Center per Ajax wechseln Web Tier 3
D Ajax und Validation ohne große Umstrukturierung Web Tier 3
G Probleme mit Ajax Login (jsp) Web Tier 5
I Ajax DOM speichern Web Tier 27
V Image Map und Ajax-Richfaces Web Tier 5
J Ajax in MyFaces? Web Tier 6
K Orientierungslosigkeit: Webservice+Ajax(echo2)+Session-Management Web Tier 4
S Beschleunigung Verarbeitung, ...Ajax Client-Side? Web Tier 3
C RichFaces Ajax ReRender funktioniert nicht. Web Tier 2
T Ajax / Javascript Plugin für Eclipse Web Tier 1
G AJAX und J2EE Web Tier 6
T Post Daten Abfangen Web Tier 59
J werte per post an servlet übergeben und auswerten Web Tier 3
G Json post Web Tier 4
S servlet bedienen mit get und post parameter Web Tier 10
M Zwischen GET und POST unterscheiden Web Tier 9
O Kann man POST Parameter Link-abhängig setzen? Web Tier 4

Ähnliche Java Themen

Neue Themen


Oben