Cordova and express js?

Question

I am really lost when it comes to rendering express views onto the client, when the client is a cordova app.

There are a few obvious things, for example the app would need to make a GET request and the express app would render the view.

I'm not sure how to do that though, how does one make those requests?

In the emulator I tried alert(window.location.pathname) and it shows android_asset/www/index.html so that needs to be adjusted right?

score 3 · Accepted Answer · answered May 16 '14 at 15:06

3

Use AJAX to make calls from your application to your server. This can be done in pure JavaScript or easily with libraries like jQuery or frameworks like AngularJS.

Ex in pure JS:

var xmlhttp=new XMLHttpRequest();
xmlhttp.open("GET","my/route",true);
xmlhttp.send();

and fetch response with

xmlhttp.onreadystatechange=function()
  {
  if (xmlhttp.readyState==4 && xmlhttp.status==200)
    {
    document.getElementById("aDiv").innerHTML=xmlhttp.responseText;
    }
  }

Or with jQuery :

$.get( "my/route", function( data ) {  $( ".aDiv" ).html( data ); });

However, usually, on Cordova apps, views are stored on the client side, and only data are being fetched through AJAX requests to speed up the app.

answered May 16 '14 at 15:06

Riron

1,023
14
18

I am using backbone, It's weird to me making a request to `/` ill play around with the vanilla way... it makes sense, it just feels weird. Since my app `alert(window.location.pathname)` returns `android_assets/www/index.html` will express recognize the request to `/` – Michael Joseph Aubry May 16 '14 at 15:08
Yeah to your last sentence I agree, but I already built the app using the express backend and have a routing system for a user login with passportjs and hide certain pages to unauthorized users.. This could be done on the client side but that is more work... – Michael Joseph Aubry May 16 '14 at 15:10
What do you mean ? Replace `my/route` with your server path. Like `http://myserver.com/api/v1/home` for example, if that's what you mean... – Riron May 16 '14 at 15:11
Sorry I am just confused with the path and where the app is located. The app isn't even on a server its .apk is installed... I assume I need to separate the two though and have the server just handle the data and make requests when needed... That doesnt work well with express routing though... – Michael Joseph Aubry May 16 '14 at 15:13
So I have basic experience with express, I assume I can still make a GET request to the full path the server is on like localhost:3000 and it would render the view on the app? – Michael Joseph Aubry May 16 '14 at 15:15
1

The `.apk` is your client site code. And your express app has to run somewhere with node. For example `http://localhost.com:8080` if you are running your node server locally on port 8080. Then if you have a route `/home` in your express app, make the call from the client side to `http://localhost:8080/home` – Riron May 16 '14 at 15:17
I get what you're saying, im starting to grasp the concept, I forgot the express server sits on localhost:3000. This is good info I am testing my theory out – Michael Joseph Aubry May 16 '14 at 15:17
Yeah thats what I thought it just hit me... testing that out :) – Michael Joseph Aubry May 16 '14 at 15:18
I didn't realize that route could essentially be accessed or triggered from anywhere, I am used it being called within the same file tree... This makes sense now. – Michael Joseph Aubry May 16 '14 at 15:19
Good ! Just beware your `localhost` in only accessible in your local network. So just make sure you have access to it when testing :) – Riron May 16 '14 at 15:23
I am testing now, about to accept this but last question just to reassure... So if I make the ajax 'GET' request from the cordova client side my express server will execute this `var router = express.Router(); router.get('/', function(req, res) { res.render('index'); });` and render the index? – Michael Joseph Aubry May 16 '14 at 15:24
1

Yes for the beginning. But you shouldn't use `res.render('index');` as it's not express that is going to render the view, it's the client. You have to pass those view data to the client, and the client will render it. Use something like `res.send('Some HTML/reference to HTML here')`, grab those data from your client and display them (as shown with the `xmlhttp.responseText` stuff in my response) . Hope it's clear... – Riron May 16 '14 at 15:31
Ah yes very clear, makes sense now! I don't know why this is not emphasized a little more, it's a pain to have to grab the data then use it but whatever. Thanks – Michael Joseph Aubry May 16 '14 at 15:32

Cordova and express js?

1 Answers1

Linked