| 2014-03-27 14:37:25 |
Rick Spencer |
description |
While attempting to write an application that required authenticating with a REST API, I discovered that when posting to the end point, onreadystatechange for the request object was never called. However, the same code worked fine in a web browser.
I boiled down the code to the smallest sample that I could. Note that the code sample here will not work to log in the user, as I removed extraneous code to focus on the fact that onreadystatechange is never called. When this code is run in qml, the following output is produced. Notice that readystatechange is never invoked.
[code]
import QtQuick 2.0
Rectangle
{
Component.onCompleted:
{
formPost("http://api.npr.org/identity/v1/login/npr")
formPost("https://api.npr.org/identity/v1/login/npr")
formPost("https://google.com")
}
function formPost(location)
{
var req = new XMLHttpRequest();
console.log("Posting to " + location)
req.open("POST", location, true);
req.onreadystatechange = function()
{
console.log("Ready state changed to " + req.readyState + " for " + location)
if (req.readyState == 4)
{
console.log("Data received for " + location)
}
}
req.send(null);
}
}
[/code]
[output]
Starting /usr/lib/x86_64-linux-gnu/qt5/bin/qmlscene...
Posting to http://api.npr.org/identity/v1/login/npr
Posting to https://api.npr.org/identity/v1/login/npr
Posting to https://google.com
Ready state changed to 2 for https://google.com
Ready state changed to 3 for https://google.com
Ready state changed to 3 for https://google.com
Ready state changed to 3 for https://google.com
Ready state changed to 4 for https://google.com
Data received for https://google.com
Ready state changed to 2 for http://api.npr.org/identity/v1/login/npr
Ready state changed to 3 for http://api.npr.org/identity/v1/login/npr
Ready state changed to 3 for http://api.npr.org/identity/v1/login/npr
Ready state changed to 3 for http://api.npr.org/identity/v1/login/npr
Ready state changed to 3 for http://api.npr.org/identity/v1/login/npr
Ready state changed to 4 for http://api.npr.org/identity/v1/login/npr
Data received for http://api.npr.org/identity/v1/login/npr
[/output]
However, essentially the identical in a browser does show that the https endpoint for npr does work. Note that when I include the proper credenitals, the code works in the browser, but in qml onreadystatechange is never called.
[code]
<HTML>
<HEAD>
<SCRIPT>
function init()
{
formPost("http://api.npr.org/identity/v1/login/npr")
formPost("https://api.npr.org/identity/v1/login/npr")
formPost("https://google.com")
}
function formPost(location)
{
var req = new XMLHttpRequest();
console.log("Posting to " + location)
req.open("POST", location, true);
req.onreadystatechange = function()
{
console.log("Ready state changed to " + req.readyState + " for " + location)
if (req.readyState == 4)
{
console.log("Data received for " + location)
}
}
req.send(null);
}
</SCRIPT>
</HEAD>
<BODY onload=init()>
<P>Form post test</P>
</BODY>
</HTML>
[/code]
[output]
Posting to http://api.npr.org/identity/v1/login/npr test.html:15
Posting to https://api.npr.org/identity/v1/login/npr test.html:15
Posting to https://google.com test.html:15
XMLHttpRequest cannot load http://api.npr.org/identity/v1/login/npr. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. test.html:1
Ready state changed to 4 for http://api.npr.org/identity/v1/login/npr test.html:21
Data received for http://api.npr.org/identity/v1/login/npr test.html:24
XMLHttpRequest cannot load https://google.com/. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. test.html:1
Ready state changed to 4 for https://google.com test.html:21
Data received for https://google.com test.html:24
POST https://api.npr.org/identity/v1/login/npr 400 (Bad Request) test.html:28
Ready state changed to 2 for https://api.npr.org/identity/v1/login/npr test.html:21
Ready state changed to 3 for https://api.npr.org/identity/v1/login/npr test.html:21
Ready state changed to 4 for https://api.npr.org/identity/v1/login/npr test.html:21
Data received for https://api.npr.org/identity/v1/login/npr
[/output] |
While attempting to write an application that required authenticating with a REST API, I discovered that when posting to the end point, onreadystatechange for the request object was never called. However, the same code worked fine in a web browser.
I boiled down the code to the smallest sample that I could. Note that the code sample here will not work to log in the user, as I removed extraneous code to focus on the fact that onreadystatechange is never called. When this code is run in qml, the following output is produced. Notice that readystatechange is never invoked.
[code]
import QtQuick 2.0
Rectangle
{
Component.onCompleted:
{
formPost("http://api.npr.org/identity/v1/login/npr")
formPost("https://api.npr.org/identity/v1/login/npr")
formPost("https://google.com")
}
function formPost(location)
{
var req = new XMLHttpRequest();
console.log("Posting to " + location)
req.open("POST", location, true);
req.onreadystatechange = function()
{
console.log("Ready state changed to " + req.readyState + " for " + location)
if (req.readyState == 4)
{
console.log("Data received for " + location)
}
}
req.send(null);
}
}
[/code]
[output]
Starting /usr/lib/x86_64-linux-gnu/qt5/bin/qmlscene...
Posting to http://api.npr.org/identity/v1/login/npr
Posting to https://api.npr.org/identity/v1/login/npr
Posting to https://google.com
Ready state changed to 2 for https://google.com
Ready state changed to 3 for https://google.com
Ready state changed to 3 for https://google.com
Ready state changed to 3 for https://google.com
Ready state changed to 4 for https://google.com
Data received for https://google.com
Ready state changed to 2 for http://api.npr.org/identity/v1/login/npr
Ready state changed to 3 for http://api.npr.org/identity/v1/login/npr
Ready state changed to 3 for http://api.npr.org/identity/v1/login/npr
Ready state changed to 3 for http://api.npr.org/identity/v1/login/npr
Ready state changed to 3 for http://api.npr.org/identity/v1/login/npr
Ready state changed to 4 for http://api.npr.org/identity/v1/login/npr
Data received for http://api.npr.org/identity/v1/login/npr
[/output]
However, essentially the identical code in a browser does show that the https endpoint for npr does work. Note that when I include the proper credenitals, the code works in the browser, but in qml onreadystatechange is never called.
[code]
<HTML>
<HEAD>
<SCRIPT>
function init()
{
formPost("http://api.npr.org/identity/v1/login/npr")
formPost("https://api.npr.org/identity/v1/login/npr")
formPost("https://google.com")
}
function formPost(location)
{
var req = new XMLHttpRequest();
console.log("Posting to " + location)
req.open("POST", location, true);
req.onreadystatechange = function()
{
console.log("Ready state changed to " + req.readyState + " for " + location)
if (req.readyState == 4)
{
console.log("Data received for " + location)
}
}
req.send(null);
}
</SCRIPT>
</HEAD>
<BODY onload=init()>
<P>Form post test</P>
</BODY>
</HTML>
[/code]
[output]
Posting to http://api.npr.org/identity/v1/login/npr test.html:15
Posting to https://api.npr.org/identity/v1/login/npr test.html:15
Posting to https://google.com test.html:15
XMLHttpRequest cannot load http://api.npr.org/identity/v1/login/npr. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. test.html:1
Ready state changed to 4 for http://api.npr.org/identity/v1/login/npr test.html:21
Data received for http://api.npr.org/identity/v1/login/npr test.html:24
XMLHttpRequest cannot load https://google.com/. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access. test.html:1
Ready state changed to 4 for https://google.com test.html:21
Data received for https://google.com test.html:24
POST https://api.npr.org/identity/v1/login/npr 400 (Bad Request) test.html:28
Ready state changed to 2 for https://api.npr.org/identity/v1/login/npr test.html:21
Ready state changed to 3 for https://api.npr.org/identity/v1/login/npr test.html:21
Ready state changed to 4 for https://api.npr.org/identity/v1/login/npr test.html:21
Data received for https://api.npr.org/identity/v1/login/npr
[/output] |
|
