If I have an iFrame that's trying to launch a custom URL scheme (e.g. twitter://user?data=value), Chrome will throw an error in the console:
Failed to launch 'twitter://user?data=value' because the scheme does not have a registered handler
I need to access that URL, without taking any actions (like launching Twitter, for example). If the console is displaying this error information, that must mean the client has access to the URL and data.
Is there a way to intercept these errors and deal with the URL myself?
Related
I have 2 applications both hosted individually. Lets name them App A and App B.
In App A's iframe I am loading the url of App B to perform an action.(It is actually a form submit which contains file upload, but to not reload the page, I'm using an iframe to do that)
While the url is called and the action is performed in App B correctly, I'm unable to read the response in App A.
I'm getting the below JS Exception while reading the response.
Failed to read the 'contentDocument' property from 'HTMLIFrameElement': Blocked a frame with origin "App A URL" from accessing a cross-origin frame.
When the URL is loaded in App A, it is received by a Servlet in App B. The action is performed in App B and response is returned. In App B, I have set the following -
response.setContentType("application/json");
response.setHeader("Access-Control-Allow-Origin","*");
response.setHeader("Access-Control-Allow-Methods","POST,GET,OPTIONS,DELETE");
Even by setting Access-Control-Allow-Orgin to *, I'm unable to read the response.
How do I get the response in my iframe?
PS: I don't want to use any third party API.
I have latest version of ckeditor. I did file upload to my remote service. that service after uploading, returns uploaded file link. that is included as iframe 'upload' tab.
So that is all ok. But when I try to switch tab or close image uploader popup window 'ckeditor' throws error:
"Blocked a frame with origin "http://localhost:3101" from accessing a frame with origin "http://localhost:61666". Protocols, domains, and ports must match."
Is where any way to fix this problem?
That is a security standard. Browser auto check and prevent it like default way. Have no method to pass it.
But in your case I have a trick to resolve this problem, you can try this:
After click "send it to server" and receive a response.
Detect your iframe source by id in DOM
Change the iframe's source domain to current domain. (important thing of this trick to pass error "Blocked a frame with origin..." )
And do continue like as you did.
I have a need for a solution to a repetitive task I do in Google Chrome.
I come across IP addresses once in a while, and I need to geo locate them.
On my system I already have a REST service that If I called a certain url:
http://localhost:8080/json/8.8.8.8
I get a JSON response with GEO data.
I want to create a chrome extension that would trigger a geo rest call on selection or even hovering over a IPv4 string.
Is such an extension possible? Would it be blocked by cross domain request protection?
You can do is as an extension to chrome, content scripts, message passing and setting up proper permissions.
Content scripts will run on selected (or all) pages and can do whatever you want with the page. They just sandboxed from page's JavaScript environment. You can develop a hover action which recognize IP address and send the information to the background page where it can be processed (in environment and especially permissions of the extensions which are not available in context of content scripts).
In the background page you can make a request using either XMLHttpRequest or Fetch function. After you process the data you can return the result to the page via message passing or do whatever you want with it.
In the manifest file you can set up specific URL you want to send information to or <all_urls> to have permission to send request everywhere.
...
"permissions": [
"http://*.google.com/"
],
...
Then your request won't be subject of CORS and same domain policy.
You can run the following scriptlet directly from Chrome's address bar:
javascript:var xhr = new XMLHttpRequest;xhr.open('GET', 'http://localhost:8080/json/'+window.getSelection().toString(), true);xhr.onload = function (e) {alert(xhr.responseText)};xhr.send();
(note that you'll need to prepend the "javascript:" to the text on the address bar when copying from here because Chrome trims it when pasting).
Add this as a new page bookmark (name it something like "IP Geo Data") and put it on the bookmarks bar. Alternatively just type its name and choose it on from the ombibox autocomplete. You'll need to have the IP you want data about selected.
You're right about the cross domain protection, but since you control the service on your localhost:8080/json, just have it add the following headers on requests made to that path:
Access-Control-Allow-Credentials: true
Access-Control-Allow-Headers: Authorization,Content-Type,Accept,Origin,User-Agent,DNT,Cache-Control,X-Mx-ReqToken,Keep-Alive,X-Requested-With,If-Modified-Since
So I am writing an application in Node-Webkit/NW.js that needs a "Login to LinkedIn" button. We have to use a custom protocol/domain in order to allow hooking into the Dropbox API (let's call it app://example).
In the Application Details on the developer portal, for JavaScript API Domains I have "app://example" and "example." However, when I attempt to use my API key inside the application I get the following error:
Uncaught Error: JavaScript API Domain is restricted to example
Does LinkedIn not allow custom protocols, and only http/https? This is a big problem for us and I hope someone is able to answer.
Use a server in a controlled environment rather than the developer console to avoid this error.
Use a redirect from the https:// protocol to the app:// protocol in that controlled environment. Here is the process:
Essentially, where I was previously seeing "Not allowed to load local resource: app://whatever/somefile.html", addOriginAccessWhitelistEntry eliminates the error and I see the appropriate app:// resource in the address bar with the following new error in the console: "Uncaught ReferenceError: require is not defined"
That said, if I force a refresh at this point the resource rendering occurs as expected.
nw.App.addOriginAccessWhitelistEntry('http://github.com/', 'app', 'myapp', true);
References
nw.js: app:// Protocol doesn't load for OAuth Redirect
nw.js: addOriginAccessWhitelistEntry
I am using an iframe for a pseudo-ajax file upload. The iframe is in the same view as the upload javascript:
<iframe id="upload_iframe" name="upload_iframe" style="position: absolute; left: -999em; top: -999em;"></iframe>
his works 'nicely' on my local machine, but when I deploy to an Azure web site, I get the following error in Chrome's debug console:
Uncaught SecurityError: Failed to read the 'contentDocument' property
from 'HTMLIFrameElement': Blocked a frame with origin
"https://acme.azurewebsites.net" from accessing a frame with origin
"null". The frame requesting access has a protocol of "https", the
frame being accessed has a protocol of "data". Protocols must match.
I understand this iframe to be same-origin, as it is strictly local, but how do I convince the browser that it is local? That is, is there something I should be doing to the origin and protocol of my iframe to avoid this error?
This is my code, in a nutshell:
dataAccess.submitAjaxPostFileRequest = function (completeFunction) {
$("#userProfileForm").get(0).setAttribute("action", $.acme.resource.links.editProfilePictureUrl);
var hasUploaded = false;
function uploadImageComplete() {
if (hasUploaded === true) {
return;
}
var responseObject = JSON.parse($("#upload_iframe").contents().find("pre")[0].innerText);
completeFunction(responseObject);
hasUploaded = true;
}
$("#upload_iframe").load(function() {
uploadImageComplete();
});
$("#userProfileForm")[0].submit();
};
The form userProfileForm has its target property set to the iframe. This upload arrangement seems to work for most requests, and I don't know if the 'uncaught exception' message is just an observation on Chrome's part, or a potential show stopper. Is there not perhaps a way I can 'catch and ignore' such an exception, and just display a generic message if this happens?
This may depend on your browser, but the IFRAME element is generally not supported for the data protocol, see Wikipedia entry:
http://en.wikipedia.org/wiki/Data_URI_scheme
It may have worked on localhost because localhost can use different authentication & authorization methods (for example on Windows it may run as a trusted site, and may pass your windows user credentials to server automatically, etc.). Same origin I believe means protocol, host, and port must all match. Since data protocol is different than https this is not same origin, hence the security error.
Usually the data protocol is only supported by these elements:
object (images only) (ie: not activeX controls)
img
input type=image
link
CSS declarations that accept a URL
Can you post more of your code and problem statement? There are multiple other ways to accomplish file uploads. For example, traditional POST method (single file), HTML5 method (multi files), or even using javascript to send a stream of bytes to a web service (I did this once in an ActiveX control that used TWAIN to scan documents on user's computer and then upload the scanned image to the website).