I tried to load a local file in my javascript file by using Fetch API having no result.
"It couldn't be loaded as URL scheme "file" is not supported".
So i decided to try using XMLHttpRequest API but nothing changed, as i got CORS error.
"from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, chrome-untrusted, https".
how can it be done?
First of all, let me clear some facts:
To load any file through a http protocol, you need to create a server
that is able to fetch the file from the filesystem for you.
Let's say you have a file.txt file lying around, and you want to load it, so you can definietly do it but you need to setup a server such that it can capture the query you want.
Now, I recommend using POST request in this case, and fs library with express in backend.
Related
I have made some project which sends XHR request to fetch a locally saved JSON file (the file being in the same folder).
I use VS Code with 'live server' extension.
The request, response and every thing else works perfectly fine when I open the html file with Live Server.
But when I open the file without starting any kind of local server, then the request doesn't return any response and instead logs out an error-
(I am using Chrome)
Access to XMLHttpRequest at 'file:///G:/_PROJECTS/Graph%20Plotter/sample_data.json' from origin 'null' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
I searched online about this and found some google documentation but didn't quite understand it. I want to know what the error is about and how can I fix it?
Also I would be great help if you could simplify it so that I understand it.
Thanks in advance!
I need to have a HTTP server point to my localhost to be able to fetch files locally.
Since XHR needs a network to send HTTP requests, I cannot simply fetch local files without being on any network/server (either internet or local server). The resulting chrome error is due to the fact that chrome has disabled fetching local files without being on any network due to security and privacy concerns
In my background.js script, I'm making vanilla AJAX GET request using the XMLHttpRequest() object to my Node server (currently hosted on localhost). The Node server is using the npm package express to handle the GET request. However, background.js just returns the error:
Access to XMLHttpRequest at 'localhost:80' from origin 'chrome-extension://jhccmehanjenpnjalilnihdmeignbcpn' has been blocked by CORS policy: Cross origin requests are only supported for protocol schemes: http, data, chrome, chrome-extension, https.
Is it a permission I need to include in the manifest.json or something? Thanks!
#wOxxOm solved my problem in the comment above! I just forgot the http://
I am getting a below error in chrome console
XMLHttpRequest cannot load XMLHttpRequest cannot load
turn:global.turn.twilio.com:3478/turn?username=username&key=key&transport=udp
Cross origin requests are only supported for protocol schemes: http,
data, chrome, chrome-extension, https.
while running a local webrtc sample server
The node server example i am running is from https://github.com/ISBX/apprtc-node-server/
Below is the screenshot
Thanks in advance
I believe you have a misunderstanding of what a TURN server is for, and are calling it as if it is a standard web server.
As some of the commenters mentioned, you're not supposed to make an HTTP request to a TURN server, which uses a different TURN protocol. Instead, you configure your WebRTC setup via the iceServer object, which is where you define a TURN server. The WebRTC implementation will use the TURN servers when required.
Here's a nice article about WebRTC signaling:
https://www.html5rocks.com/en/tutorials/webrtc/infrastructure/
And here's a couple other articles if you're interested in learning about the specific protocols WebRTC uses:
https://developer.mozilla.org/en-US/docs/Web/API/WebRTC_API/Protocols
https://www.twilio.com/docs/api/stun-turn/faq
I'm trying to wrap my head around CORS (cross origin resource sharing) by reading https://developer.mozilla.org/en-US/docs/Web/HTTP/Access_control_CORS. Here, I noticed that the document states:
Cross-site HTTP requests initiated from within scripts have been subject to well-known restrictions, for well-understood security reasons. For example HTTP Requests made using the XMLHttpRequest object were subject to the same-origin policy.
This makes sense to me, as I have experienced the following error before:
XMLHttpRequest cannot load http://localhost:7000. No
'Access-Control-Allow-Origin' header is present on the requested
resource. Origin http://localhost:9000 is therefore not allowed
access.
However, why does curl http://localhost:7000 return the JSON that located on the page correctly? Is it simply the fact that curl commands don't come from scripts? In addition, how does the browser even recognize that the request is coming from a script? If this differentiates significantly from browser to browser, I'd be curious to know about how Chrome and Firefox detect this.
In my idea
XMLHttpRequest is javascript call server to get data and noad reload page. No page load first no XMLHttpRequest.
Curl is php server function get data from server and return to php code, curl is a part of server code.
Is there any any option available to load a PDF from a website (e.g. http://mywebsite.com/mydoc.pdf) and read it into base64 (or) binary data using javascript. The XHR (ajax) request not helps me due to cross domain scripting restrictions. The HTML5 FileReader API works with user file input control. I could not think of any other option. Any ideas greatly appreciated. Thank you.
As you have said there are cross domain restrictions that prevent you from downloading any old file from another domain. There are a couple of ways round this.
If the server you're downloading from supports CORS requests then you should be able to download the file as a binary object. If you're downloading from a server you control then you could update it to support CORS requests.
If CORS support on the originating server isn't an option then you could create a proxy on your server to download the PDF and pass it on to the client. Either host it on the same domain or make sure it supports CORS requests from your domain.