Client-side request for DbPedia SPARQL: Cross Origin Request Blocked

Hi!

We are incorporating results from DbPedia into a web page. We noticed that, when deployed on one of our servers, we were encountering this error: "
Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at " followed by the query URL “https://dbpedia.org/sparql?query=…”, etc. We worked around this by using a JSONP request instead of a regular AJAX request. We wanted to ask whether “OpenLink Virtuoso SPARQL Query Editor” is intended to block cross origin requests or should be passing headers to enable AJAX requests? Thanks!

could you copy this deployment (just download the file YASGUI) to your https based web setup and try the following query (select dbpedia.org sparq endpoint first) as in the screenshot below?
I could not reproduce your problem for me CORS is setup based on the origin head in the request.

response

Access-Control-Expose-Headers: Content-disposition,Content-Type
Access-Control-Allow-Headers: Accept, Authorization, Slug, Link, Origin, Content-type, On-Behalf-Of
Content-disposition: filename=sparql_2021-11-29_10-34-23Z.json
Expires: Mon, 06 Dec 2021 10:34:26 GMT
Cache-Control: max-age=604800
Access-Control-Allow-Origin: https://akswnc7.informatik.uni-leipzig.de
Access-Control-Allow-Credentials: true
Access-Control-Allow-Methods: GET, POST, OPTIONS
Access-Control-Allow-Headers: Depth,DNT,X-CustomHeader,Keep-Alive,User-Agent,X-Requested-With,If-Modified-Since,Cache-Control,Content-Type,Accept-Encoding
Accept-Ranges: bytes

request

POST /sparql HTTP/1.1
Host: dbpedia.org
Connection: keep-alive
Content-Length: 66
sec-ch-ua: " Not A;Brand";v=“99”, “Chromium”;v=“90”, “Google Chrome”;v=“90”
Accept: application/sparql-results+json
DNT: 1
sec-ch-ua-mobile: ?0
User-Agent: Mozilla/5.0 (X11; Linux x86_64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/90.0.4430.212 Safari/537.36
Content-Type: application/x-www-form-urlencoded; charset=UTF-8
Origin: https://akswnc7.informatik.uni-leipzig.de
Sec-Fetch-Site: cross-site
Sec-Fetch-Mode: cors
Sec-Fetch-Dest: empty
Referer: https://akswnc7.informatik.uni-leipzig.de/
Accept-Encoding: gzip, deflate, br
Accept-Language: en-US,en;q=0.9

Thank you for the recommendation! I will try it out and then provide an update here.

The Same Origin Policy (SOP) is the policy browsers implement to prevent vulnerabilities via Cross Site Scripting (XSS). In other words, the browser would not allow any site to make a request to any other site. It would prevent different origins from interacting with each other through such requests, like AJAX. This policy exists because it is too easy to inject a link to a javascript file that is on a different domain. This is a security risk - you really only want code that comes from the site you are on to execute and not just any code that is out there.

The Cross Origin Resource Sharing (CORS) is one of the few techniques for relaxing the SOP. Because SOP is “on” by default, setting CORS at the server-side will allow a request to be sent to the server via an XMLHttpRequest even if the request was sent from a different domain. This becomes useful if your server was intended to serve requests from other domains (e.g. if you are providing an API).

JSON with Padding is just a way to circumvent same-origin policy, when CORS is not an option. This is risky and a bad practice. Avoid using this.

If you want to bypass that restriction when fetching the contents with fetch API or XMLHttpRequest in javascript, you can use a proxy server so that it sets the header Access-Control-Allow-Origin to *.

If you need to enable CORS on the server in case of localhost, you need to have the following on request header.

Access-Control-Allow-Origin: http://localhost:9999