Tim: Unerwartetes Verhalten bei JSONP-Request mit jQuery/Ajax

Hey Community,

auf Grund einer Idee wollte ich versuchen, die Rest-API von Atlassian Jira zu nutzen, um einige Informationen in einer eigenen Webanwendung darzustellen (bspw. Anzahl offener Fälle im Backlog...). Die Abfrage wollte ich mit JSONP realisieren, da bei einem reinen Ajax/jQuery-Request der fehlende "Allow-Origin" Header problematisch ist.

Meine Abfrage ist die folgende:

$.ajax({
		type: "GET",
		url: url,
		async: true,
		dataType: "jsonp",
		jsonp: "callback",
		jsonpCallback: "jsonpCallback",
		cache: false,
		success: function(data) {
			console.log(data);
		},
		error: function(xhr) {
			console.log(xhr);
		}
});

Leider scheint Jira ein Problem mit diesem Request zu haben, denn in der Browser-Konsole wird folgende Fehlermeldung angezeigt:

Refused to execute script from 'http://[domain]/rest/agile/1.0/board/[boardNr]/issue?callback=jsonpCallback' because its MIME type ('application/json') is not executable, and strict MIME type checking is enabled.

Mein Problem an der Sache ist bloß, wenn ich die URL direkt im Browser aufrufe oder mit der Chrome-Erweiterung Postman darauf zugreife, erhalte ich die gewünschte JSON-Datei als Response. Zusätzlich sehe ich sowohl im Konsolen-Reiter "Network" als auch "Application", dass der Response empfangen wurde.

(s. hier ![](/images/4c4e8e0f-8de8-489f-a6b4-8f263bcb96f6.png?size=medium "Response im Reiter "Application"") und hier ![](/images/5a407714-588b-4558-bd01-ce056a1a9524.png?size=medium "Response im Reiter "Network"") )

Mein Problem liegt nun darin, dass ich nicht weiß, wie ich auf den scheinbar fehlerfreien Response zugreifen kann. Kennt einer von Euch vllt. eine Möglichkeit trotz dessen auf die Datei zuzugreifen, oder kann mir sagen worin mein offensichtlicher Fehler besteht?

Ich danke Euch für jede Form der Hilfe! :)

Mit freundlichen Grüßen

Tim

  1. hi,

    Leider scheint Jira ein Problem mit diesem Request zu haben, denn in der Browser-Konsole wird folgende Fehlermeldung angezeigt:

    Refused to execute script from 'http://[domain]/rest/agile/1.0/board/[boardNr]/issue?callback=jsonpCallback' because its MIME type ('application/json') is not executable, and strict MIME type checking is enabled.

    JSONP möchte den Namen einer Callbackfunktion die als JS ausgeführt werden soll. Wobei JSONP mit JSON an sich gar nichts zu tun hat, sendest Du den o.g. Enctype 'application/json' was der WS offensichtlich checkt und für falsch befindet.

    Mein Problem an der Sache ist bloß, wenn ich die URL direkt im Browser aufrufe oder mit der Chrome-Erweiterung Postman darauf zugreife, erhalte ich die gewünschte JSON-Datei als Response.

    Guch Dir an, was in diesem Fall für ein Content-Type gesendet wird. Also welchen der WS für richtig befindet.

    MfG

    1. Das werde ich machen 😉, wie ist dann aber zu erklären, dass zwar der Fehler angezeigt wird, die eigentliche Ausführung trotzdem zu funktionieren scheint!?

      1. Eine Suche bringt jede Menge Ergebnisseiten zu Deinem Problem, ua. diese hier.

        MfG

        1. Bevor ich die Frage gestellt habe, habe ich durchaus nach dem Problem gesucht (auch den genannten Post) Mein Problem ist, dass obwohl die Fehlermeldung angezeigt wird, der eigentlich Request scheinbar fehlerfrei ausgeführt werden kann. Anders kann ich mir zumindest nicht die in den Bildern eingetretenen Ereignisse erklären. Ich würde an dieser Stelle gern verstehen, wieso es zu dieser Abweichung kommt und wie man ggf. das Ergebnis trotzdessen verwerten kann…

          1. hi

             contentType: "application/jsonp",
            crossDomain: true,
            dataType: 'jsonp',
            jsonpCallback: 'jsonpCallback',
            

            lese ich auf der von mir verlinkten Seite und ich interpretiere deine Fehlermeldung derart, daß sie wie eine Faust aufs Auge auf o.g. Konfiguration abziehlt. D.h., offensichtlich ist nur der Content-Type falsch bei Dir und crossDomain ist nicht gesetzt.

            Ich würde die Konfiguration mal ändern und das ausprobieren. Was letztendlich auf deinem System funktioniert oder nicht kann ich jedoch nicht beurteilen. Im Zweifelsfall kontaktiere den WS Anbieter.

            MfG

  2. problematische Seite

    moin

    Mein Problem an der Sache ist bloß, wenn ich die URL direkt im Browser aufrufe oder mit der Chrome-Erweiterung Postman darauf zugreife, erhalte ich die gewünschte JSON-Datei als Response.

    Grundsätzlich: Die Datenübertragung in JSONP basiert auf einem Funktionsaufruf und hat mit JSON-Dateien gar nichts zu tun. Wie das gemacht wird, habe ich hier mal kurz und bündig aufgeschrieben, das zeigt Dir auch wie eine JSONP Response aussehen muss. Eine Solche ist also mitnichten eine JSON~Datei.

    MfG

  3. Tach!

    Die Abfrage wollte ich mit JSONP realisieren, da bei einem reinen Ajax/jQuery-Request der fehlende "Allow-Origin" Header problematisch ist.

    JSONP ist kein 1:1-Ersatz zu einen Ajax-Request, der unter der Cross-Origin-Policy leidet. Eine für JSONP geeignete Response muss ihr Ergebnis in einen Funktionsaufruf eingebettet haben. Das ist das P an der Geschichte.

    JSON-Response: {"x": "Foo", "y": "Bar"}

    JSONP-Response: jsonpCallback({"x": "Foo", "y": "Bar"});

    Leider scheint Jira ein Problem mit diesem Request zu haben, denn in der Browser-Konsole wird folgende Fehlermeldung angezeigt:

    Der Server muss verstehen, dass du JSONP haben möchtest, und entsprechend handeln. Er kann nicht einfach so sein übliches JSON liefern.

    Refused to execute script from 'http://[domain]/rest/agile/1.0/board/[boardNr]/issue?callback=jsonpCallback' because its MIME type ('application/json') is not executable, and strict MIME type checking is enabled.

    Die AUsführung wird also schon wegen flaschen MIME-Types abgelehnt, weil Code und nicht Daten erwartet werden.

    Mein Problem an der Sache ist bloß, wenn ich die URL direkt im Browser aufrufe oder mit der Chrome-Erweiterung Postman darauf zugreife, erhalte ich die gewünschte JSON-Datei als Response.

    Ja, JSON, aber nicht JSONP. Und beim Direktaufruf stört auch keine Cross-Origin-Policy.

    Mein Problem liegt nun darin, dass ich nicht weiß, wie ich auf den scheinbar fehlerfreien Response zugreifen kann.

    Es geht nicht ohne Zutun des Servers / der Anwendung auf dem Server. Wenn du auf den Server keinen Einfluss hast, kannst du die Geschichte so direkt vergessen.

    Direkt würde ich versuchen, CORS auf dem Server richtig zu konfigurieren. Eigentlich gehe ich davon aus, dass wenn JIRA eine REST-API bereitstellt, sie dann auch fähig sein muss, von anderen Domains aus angesprochen zu werden, also CORS können muss. Ajax hat auf alle Fälle die Möglichkeit, Request-Header hinzuzufügen, auch die jQuery-Funktion. Also wenn der Browser den Origin-Header nicht von selbst setzt, kannst du das darüber tun.

    Ansonsten müsstest du einen Proxy auf der Domain aufsetzen, von der deine Website abgerufen wird. Das kann ein einfach gehaltenes PHP-Script sein, dass die Aufrufe und deren Antworten durchreicht. Der Proxy hat dann kein Cross-Origin-Problem mit deinem Browser und, weil du ihn selbst schreibst, muss er auch nicht die COP hin zum JIRA beachten.

    dedlfix.