B4J Question [Banano]problem to fetch data from Server(CORS)....[solved]

[Michael1968]

Hi,
I have a problem to fetch data from a Server in my local network.

I have in the last few days gegoggelt much to the topic CORS and much on the subject of HTTP protocol .
I read a lot , write some test code but found no solution.

Situation:
php file on server:

<?php
header("Content-type:application/json");

$age = array("Peter"=>35, "Ben"=>37, "Joe"=>43);

echo json_encode($age);
?>

Banano Code to fetch the data:

Dim fetch2Options As BANanoFetchOptions
     fetch2Options.Initialize
     fetch2Options.Mode = "no-cors"
    'fetch2Options.Headers = CreateMap("Content-type": "application/json; charset=UTF-8")
'
    Dim fetch1 As BANanoFetch
    'fetch1.Initialize("http://192.168.2.115/test.php",fetch2Options)
    fetch1.Initialize("http://192.168.2.115/test.php",Null)
    'fetch1.Initialize("https://jsonplaceholder.typicode.com/posts", Null)
    fetch1.Then(response)
'    ' we got a response, but as the Json() method returns a Promise, we will need to process it in the next 'then' so we return it to this Fetch
    fetch1.Return(response.Json)
    
    fetch1.Then(data)
'    ' the Json promise is resolved, lets log it...
    Log(data)

1) if I start the APP direct from server....everything is ok

2) if i start the APP on my computer from file, i get a "CORS" error.
if i follow the link in the error massage i get the data.

3) if i add

fetch2Options.Mode = "no-cors"

i get no "CORS" error but:

Uncaught (in promise) SyntaxError: Unexpected end of input at app.js:42

// [59] fetch1.Return(response.Json)
return _response.json();

with postman i get the data without problem.

at the moment i feel walking through a forest

any help is welcome

best regards
Michael

 

[Mashiane]

Assumptions:

The php file is added via the files tab of the app and updated.

<?php
header("Access-Control-Allow-Origin: *");
header("Content-type:application/json");

$age = array("Peter"=>35, "Ben"=>37, "Joe"=>43);

echo json_encode($age);
?>

Sub BANano_Ready
    Dim response As BANanoFetchResponse
    Dim error As BANanoObject
    Dim data As BANanoJSONParser
   
    Dim fetch2Options As BANanoFetchOptions
    fetch2Options.Initialize
    fetch2Options.Method = "GET"
    fetch2Options.Headers = CreateMap("Content-type": "application/json; charset=UTF-8")
    '
    Dim fetch1 As BANanoFetch
    fetch1.Initialize("./assets/test.php",fetch2Options)
    fetch1.Then(response)
    fetch1.Return(response.Json)
    fetch1.Then(data)
    Log(data)
    fetch1.end  
End Sub

Still to explore using an ip address.

Good luck.

 

[Michael1968]

Hi Mashiý...
i get the same error described in ponit 3.
the php file is hosted on a server....the app starts from a local file.

response frome the server:

access-control-allow-origin:*
content-type:application/json
content-length:30
date:Fri, 22 Nov 2019 14:25:36 GMT
server:lighttpd/1.4.45

it must be a fault in the response.json

 

[mindful]

@Michael1968 It's not banano fault.

In the library there is an example of B4J server and inside that project you can see that it set's headers for cors:

    resp.SetHeader("Access-Control-Allow-Origin","*")
    resp.SetHeader("Access-Control-Allow-Methods" ,"GET, POST, OPTIONS")
    resp.SetHeader("Access-Control-Allow-Headers", "Access-Control-Allow-Headers, Origin, Accept, X-Requested-With, Content-Type, Access-Control-Request-Method, Access-Control-Request-Headers, Authorization")

You should change fetch2Options.Mode = "no-cors" to "cors", because you get the resource from another server.

I don't use php so I can't give you the exact thing you need to do but a quick google search for "php cors" returns a lot of examples how to setup server so that it can handle cors

 

[Michael1968]

@mindful,@Mashiane ...thank you
i add header in the php file and it works

<?php
header('Access-Control-Allow-Origin: *');
header("Access-Control-Allow-Credentials: true");
header('Access-Control-Allow-Methods: GET, PUT, POST, DELETE, OPTIONS');
header('Access-Control-Max-Age: 1000');
header('Access-Control-Allow-Headers: Origin, Content-Type, X-Auth-Token , Authorization');

$age = array("Peter"=>35, "Ben"=>37, "Joe"=>43);

echo json_encode($age);
?>