-1

I wanted to play around a little bit with OpenUI5 and JS Bin. And use a public JSON service for some mock data.

However I am not able to load data to my JSONModel from this public JSON service within JS Bin.

Please check My Example where I set the data manually and everything is working as expected. But after uncommenting this line (and of course commenting the next line):

oModel.loadData("http://jsonplaceholder.typicode.com/posts");

I would expect that the JSON model loads data from that service and displays the data in the output table.

Unfortunately after loading data when I try to check the oModel variable in the console, for example like this: 

oModel.getData()

I am expecting that getData() returns that JSON data, but I am getting an javascript object. What am I missing? Is it even possible to use an public JSON service within JS Bin?

Thanks

Marc
  • 6,051
  • 5
  • 26
  • 56
sachad
  • 307
  • 4
  • 13
  • 2
    Open your JS console. Read the messages. *sap-ui-core.js:71 Mixed Content: The page at 'https://null.jsbin.com/runner' was loaded over HTTPS, but requested an insecure XMLHttpRequest endpoint 'http://jsonplaceholder.typicode.com/posts'. This request has been blocked; the content must be served over HTTPS.* – Quentin Mar 18 '16 at 13:14
  • 1
    Thanks! I actually didn't check my browser console. Just the JS Bin console. So if I understand it correctly - it is possible to use public JSON service in JS Bin, only if it is served over HTTPS. – sachad Mar 18 '16 at 13:22

2 Answers2

1

The browser doesn´t allow mixed content. If you have a website over https, you must include your model with https.

For testing purposes you can start your chrome with --disable-web-security. "C:\Program Files (x86)\Google\Chrome\Application\chrome.exe" --disable-web-security

Or you can use this chrome extension to allow it:

https://chrome.google.com/webstore/detail/allow-control-allow-origi/nlfbmbojpeacfghkpbjhddihlkkiljbi

alexander-fire
  • 1,082
  • 4
  • 27
  • 52
1

CORS issue for you here...you can call the service like this "https://cors-anywhere.herokuapp.com/services.odata.org/V2/Northwind/Northwind.svc/"

Please have a look at Nabi's tutorial: tutorial

gmodrogan
  • 323
  • 5
  • 14