cordova-plugin-webserver
cordova-plugin-webserver copied to clipboard
Not working
I have this JS in the index.html
phonegap app. Testing on Android 6
app.initialize();
function onLoad() {
document.addEventListener("deviceready", onDeviceReady, false);
}
webserver.onRequest(
function(request) {
console.log("O MA GAWD! This is the request: ", request);
document.getElementById("server").innerHTML = "O MA GAWD! This is the request: " + request;
webserver.sendResponse(
request.requestId,
{
status: 200,
body: '<html>Hello World</html>',
headers: {
'Content-Type': 'text/html'
}
}
);
}
);
webserver.start(
function() {
alert('Success!');
},
function() {
alert('Error!');
},
1337
);
function request(method, url, data, callback) {
var xhttp = new XMLHttpRequest();
xhttp.onreadystatechange = function() {
if (this.readyState === 4 && this.status === 200) {
callback(this);
}
};
xhttp.open(method, url, true);
xhttp.send(data);
}
function sendReq() {
request('GET', 'localhost:8080', undefined, function (response) {
document.getElementById("response").innerHTML = JSON.stringify(response);
});
}
<body onload="onLoad()">
<p id="server"></p> <!--- To show server responded -->
<p><input type="button" value="Send Request" onclick="sendReq()" /></p>
<p id="response"></p> <!-- To show XHR response -->
</body>
Nothing happens. I can't even know if the server has started. Doing a curl request gives
curl: (7) Failed to connect to 192.168.1.2 port 1337: Connection refused
There should be some way to know that the server has started and get the address printed. Now is this code okay? Where is it wrong?
After the event deviceready all plugins have been loaded. So if the event is fired you have to load up the webserver and start it. Create a function onDeviceReady and put the webserver code in there. So the webserver will start up after everything have been loaded.
Example:
function onDeviceReady() {
webserver.onRequest(
function(request) {
console.log("O MA GAWD! This is the request: ", request);
document.getElementById("server").innerHTML = "O MA GAWD! This is the request: " + request;
webserver.sendResponse(
request.requestId,
{
status: 200,
body: '<html>Hello World</html>',
headers: {
'Content-Type': 'text/html'
}
}
);
}
);
webserver.start(
function() {
alert('Success!');
},
function() {
alert('Error!');
},
1337
);
}
Hey Thanks. That is working. It takes some time to see the request. Any reason for that?
Also, is it possible for it to listen to other types of incoming methods, like a NOTIFY
request?
That request is send by a Upnp
eventing server when a client wants to be updated of events or changes in the Upnp
server.
A client sends a SUBSCRIBE
request (similar to a GET
request) with a callback url, like this webserver address and in return the Upnp sends a NOTIFY
response to the webserver, to tell if there are any changes.
I can see that it does not receive any response.
In python/ruby I can simply define a new do_POST
function and make it equal to a or listen to a do_NOTIFY
responses as well, when you start a simple HTTP webserver, to begin listening for responses, of that nature.
How can I do that here. Tell the webserver to listen to NOTIFY
responses as well.
EDIT - NanoHTTPD says that
You can easily implement/customize any HTTP method, though.
And GCDWebServer implements handlers
to process incoming web requests and generating responses. Handlers are implemented with GCD blocks which makes it very easy to provide your own.
How can we do that?
Hi, why you should use a "NOTIFY" header? Can't you use just a default header like POST or GET?
I am listening to and interacting with a Upnp/Openhome server. They communicate with NOTIFY/SUBSCRIBE HTTP methods. So the plugin can't receive any responses if they are set to default methods. Since the core android/ios server gives customization, how can we use them.
Have you looked in the request object in the onRequest function for the "method" property?
webserver.onRequest(
function(request) {
console.log("Request method: ", request.method);
webserver.sendResponse(
request.requestId,
{
status: 200,
body: '<html>Hello World</html>',
headers: {
'Content-Type': 'text/html'
}
}
);
}
)
The library should listen to any HTTP Request method. Please try it out and tell me if it doesn't
Hey Since it's part of the request object, nothin changes. I tried it though. Simple curl GET/POST requests are shown. Doing a SUBSCRIBE request does nothing.
If it helps, you can check page 64(under eventing) inside this PDF document. It details how to send a request. It mentions to send a SUBSCRIBE request. And it will get back a NOTIFY. Not a POST or GET.
I have a simple python server listening in on NOTIFY request to it.
It works there.
EDIT - Doing a cimple curl request with various HTTP methods
>$ curl -X POST http://192.168.1.2:1337
^C
>$ curl -X PUT http://192.168.1.2:1337
^C
>$ curl -X DELETE http://192.168.1.2:1337
^C
>$ curl -X NOTIFY http://192.168.1.2:1337
BAD REQUEST: Syntax error. HTTP verb NOTIFY unhandled.
>$ curl -X SUBSCRIBE http://192.168.1.2:1337
BAD REQUEST: Syntax error. HTTP verb SUBSCRIBE unhandled.
The server isn't configured to handle any customized HTTP methods.
This is what the simple python server shows when it listens a NOTIFY request
>$ python reflect.py
Listening on localhost:8081
----- Request Start ----->
/
HOST: 192.168.1.11:8081
CONTENT-TYPE: text/xml; charset="utf-8"
CONTENT-LENGTH: 1432
NT: upnp:event
NTS: upnp:propchange
SID: uuid:517b90a6-eefb-11e7-a56b-b70c55c1e054
SEQ: 0
<e:propertyset xmlns:e="urn:schemas-upnp-org:event-1-0">
<e:property>
<IdArray>AAAAAQAAAAIAAAADAAAABAAAAAUAAAAGAAAABwAAAAgAAAAJAAAACgAAAAsAAAAMAAAADQAAAA4AAAAPAAAAEA==</IdArray>
</e:property>
<e:property>
<TracksMax>16384</TracksMax>
</e:property>
<e:property>
<ProtocolInfo>http-get:*:audio/L16:DLNA.ORG_PN=LPCM,http-get:*:application/flac:*,http-get:*:application/x-flac:*,http-get:*:audio/flac:*,http-get:*:audio/x-flac:*,http-get:*:audio/aac:*,http-get:*:audio/x-aiff:*,http-get:*:audio/aif:*,http-get:*:audio/aiff:*,http-get:*:audio/dff:*,http-get:*:audio/x-dff:*,http-get:*:audio/dsd:*,http-get:*:audio/x-dsd:*,http-get:*:audio/dsf:*,http-get:*:audio/x-dsf:*,http-get:*:audio/m4a:*,http-get:*:audio/x-m4a:*,http-get:*:audio/mp1:*,http-get:*:audio/mp4:*,http-get:*:audio/mpeg:*,http-get:*:audio/x-mpeg:*,http-get:*:audio/ogg:*,http-get:*:audio/vorbis:*,http-get:*:audio/x-ape:*,http-get:*:audio/x-monkeys-audio:*,http-get:*:audio/wav:*,http-get:*:audio/x-wav:*,http-get:*:audio/wave:*,http-get:*:audio/x-ms-wma:*,http-get:*:audio/x-ogg:*,http-get:*:audio/x-scpls:*,http-get:*:audio/x-vorbis+ogg:*,http-get:*:audio/x-vorbis:*,http-get:*:audio/x-wavpack:*,http-get:*:video/mp4:*</ProtocolInfo>
</e:property>
<e:property>
<Id>16</Id>
</e:property>
<e:property>
<Shuffle>0</Shuffle>
</e:property>
<e:property>
<Repeat>1</Repeat>
</e:property>
<e:property>
<TransportState>Stopped</TransportState>
</e:property>
</e:propertyset>
<----- Request End -----
192.168.1.4 - - [01/Jan/2018 19:24:42] "NOTIFY / HTTP/1.1" 200 -
I have no time to improve the code. Sorry. I think it's possible to retrieve other HTTP Methods than the usual ones.
Hey Can you give example how to test that. Because I think by default both of them handle only basic HTTP methods. Custom handlers have to be written. So what did I miss in getting info on other HTTP methods? That would be helpful.
Hey @bykof I just checked with the author. It is not possible to extend Nanohttpd. - https://github.com/NanoHttpd/nanohttpd/issues/478
I guess for this task some other server is the only solution, like Jetty, which is truly extensible.
But since you are tied up with your studies, hope one day you can take a look.