Javascript - Querying VoltDB api with fetch

Question

I'm trying to query a VoltDB using its api:

    const url = 'http://server:8080/api/1.0/'
    const queryParam = encodeURIComponent('select * from table')
    const queryURL = url + `?Procedure=@AdHoc&Parameters=['${queryParam}']&jsonp=console.log`

    fetch(queryURL).then( response => {
        response.text().then( text => console.log(text) )
    })

With that code throws an "No Access-Control-Allow-Origin" error. If I change the fetch call to this:

    fetch(queryURL, { mode: 'no-cors').then( response => {
        response.text().then( text => console.log(text) )
    })

It does nothing

score 1 · Accepted Answer · answered Nov 01 '16 at 16:01

This is a browser security feature. If you are serving a web page from one url and within the page you have embedded url calls to another host or port, then the browser won't allow this.

One way to get around this is to add a proxy to your web server, so it can make the calls to port 8080, and pass the responses back to the web page from the same origin.

You may see some answers on Stack Overflow about using CORS to get around this error, but that requires changing the headers that VoltDB uses on port 8080, so that's not something you can do yourself, and we have no plans to do that.

Another solution is to use the voltdb.js file provided in some of our demos, such as the NBBO demo dashboard: https://github.com/VoltDB/voltdb/tree/master/examples/nbbo/web

I think this uses low-level javascript to open a socket to make the HTTP call without using XMLHttpRequest, so it avoids the No Access-Control-Allow-Origin error.

In the example, the code that is specific to the NBBO example is in demo.js, voltdb-dashboard.js contains code that is common to various example dashboards, and voltdb.js is the base library that provides access to call procedures asynchronously.

score 0 · Answer 2 · answered Oct 31 '16 at 20:00

You should encode all the URI parameters not just the procedure parameters

$ curl --data 'Procedure=@AdHoc&Parameters=["select count(*) from store;"]' http://127.0.0.1:8080/api/1.0/

{"status":1,"appstatus":-128,"statusstring":null,"appstatusstring":null,"results":[{"status":-128,"schema":[{"name":"C1","type":6}],"data":[[100000]]}]}

or

$ curl --data 'Procedure=%40AdHoc&Parameters=%5B%22select+count(*)+from+store%3B%22%5D' http://127.0.0.1:8080/api/1.0/; echo

{"status":1,"appstatus":-128,"statusstring":null,"appstatusstring":null,"results":[{"status":-128,"schema":[{"name":"C1","type":6}],"data":[[100000]]}]}

If I use curl I don't have any issues because the real problem is the cross-domain request. Also, I don't have to encode all the query parameters, because I tried this from the VMC and it worked just fine. — aamadeo, Oct 31 '16 at 20:09

Javascript - Querying VoltDB api with fetch

2 Answers2