Use another website from an HTML file running locally - javascript

I am trying to load another website from a webpage I am running locally. While it does load, I can not seem to reference anything inside. I keep getting
Blocked a frame with origin "null" from accessing a frame with origin "http://theWebsiteImAccessingWithTheIFrame.com". The frame requesting access has a protocol of "file", the frame being accessed has a protocol of "http". Protocols must match.
I get that this is a security feature, but there must be a way to reference the stuff inside if it is loading it anyway, no?
Any help is greatly appreciated!
Edit:
I have created a map of the office I work in, using SVGs, with everyone's information(office location, their photo, extension, etc). We also just got a bunch of IP Phones that are managed and hosted by LightPath. On the webpage they have, it lets us manage our phones and even make them call others(using javascript but I have no idea how since their code is insanely complex).
My plan was that if a user clicked on someone's office, they could then have a button that would ask them to enter their number and pin to log in(how it works on the lightpath website), it would connect their 2 phones. I intended to use their number and pin to log in for them, and have the call connect that way, by just controlling the forms on lightpath's site, while it was in an iframe. This way, they wouldn't see Lightpath's site's clutter(because I could hide the iframe), and it would just get done. Essentially, it would happen as if they had gone to the website themselves and done it that way, except in a much more approachable format, and with less distractions.
LightPath does offer a "call me" feature which creates a dedicated button for calling a specific person, but it creates a token for them, and only that person has the ability to create it, not to mention I would have to enter each persons' unique token into the site, and run the risk of it failing should their extension get changed, or they leave the company. So I was hoping for something a little more dynamic.

This is a security feature from the browsers.
You can't access iFrames which are not from the same origin.
So the file has to be local.
They have to be on the same server. In chrome you aren't allowed to access any other file in the file:// protocol.
So to access remote files you may want to look into other ways of accessing it.
But either way, you need — at least in Google Chrome — to be on the http:// protocol.

Related

GDPR: youtube-nocookie embedded URL's, need visitors' permission?

This is my first time posting on Stack Overflow and I have a question about the GDPR.
Hi there! (This is ment to be on top of the post, but for some reason it gets deleted when I save it)
Situation:
On my website I don't want to bother visitors with cookie notifications, so the goal is to only place necessary cookies. However, there will be embedded YouTube video's on the website, which usually places tracking cookies.
After some research I stumpled upon the youtube-nocookie.com domain, which I am using now. Without using that domain, an embedded video url will be:
https://www.youtube.com/embed/7cjVj1ZyzyE
With using it, it is:
https://www.youtube-nocookie.com/embed/7cjVj1ZyzyE
By using the latter, cookies will only be placed after playing the video, and no tracking cookies will be placed (according to Google: https://support.google.com/youtube/answer/171780?hl=en under 'Turn on privacy-enhanced mode'). However, there will still be placed some cookies, and it is not clear for me if visitors will need to give permission for those, and if so, under what category (and maybe they are still tracking?).
Image of the cookies:
Image of cookies youtube-nocookies.com places
This is in Chrome. The cookies from the gstatic domain are placed on page-load for some reason. That doesn't happen in Opera.
Another weird thing is that FireFox (with allowing all cookies and trackers) and Edge don't seem to place any of the 6 cookies from the image at all.
Many sites and blogs say that this is the way to embed YouTube video's, but I can't seem to find a clear answer to the question if you still need visitors' permission for these cookies. Also on many sites where I only accept necessary cookies, I still have the possibility to view YouTube video's and the corresponding cookies will be happily placed without my consent.
Has anybody delt with this before?
Thanks in advance!
After some more research I think I found a clear answer. From a report of Cookiebot:
“Privacy-Enhanced Mode” currently
stores an identifier named “yt-remote-device-id”
in the web browser’s “Local Storage”. This
allows tracking to continue regardless of
whether users click, watch, or in any other way
interact with a video – contrary to Google’s
claims. Rather than disabling tracking, “privacyenhanced mode” seems to cover it up.
Source: https://www.cookiebot.com/media/1136/cookiebot-report-2019-ad-tech-surveillance-2.pdf
The 'yt-remote-device-id' indentifier, along with some other ones, are, even with the use of the youtube-nocookie.com domain (or 'Privacy Enhanced Mode'), still being placed on page load (given that the iframe with the set source is already part of the DOM at this point of course).
So while no tracking 'cookies' cookies are placed, the tracking has moved to the browsers localStorage (I overlooked this before), which basically means visitors actually do need to give permission before embedded YouTube video's with Privacy Enhanced Mode enabled should be loaded on the page.
Update
Gave some nuance in response to Marc Hjorth's comment.
i can confirm that the localStorage entry effectively replaces the funktion of the cookie. it is persistent and makes you identifiable across browser sessions. i get the same "yt-remote-device-id" value each time after restarts. only erasing the local storage makes a difference.

Error when using G-Suite Developer console with Google Sites embedded API

I've written some code that retrieves some data from google sheets then updates some content on my google sites. However, while the script works (when run on localhost) I encounter the
"details": "Not a valid origin for the client: https://966655698-atari-embeds.googleusercontent.com has not been whitelisted for client ID MY-ID. Please go to https://console.developers.google.com/ and whitelist this origin for your project's client ID."
However, I enabled this for localhost, cleared my caches. The problem is the 'https://966655698-atari-embeds'. Each time the google site loads it generates a new random number sequence. Does anyone know how to workaround this? The google site uses embedded html which I believe is why the initialization failed.
I have tried to white-list https://googleusercontent.com which didn't work (I didn't think it would because the domain changes) but I'm honestly incredibly stumped.
Google hosts all user content using their somedomain.googleusercontent.com. I do not know for certain, but I'm almost sure that to save space they dynamically host their content, meaning that when the embedded html does not need to be actively hosted, it isn't. I had to find a way to host from a site that would always send the request. For me, I found that github pages was the answer.
I found this on adobe's website which somewhat explains what googleusercontent does. https://helpx.adobe.com/analytics/kb/googleusercontentcom-instances.html
To set up github pages this link will explain how to do so https://guides.github.com/features/pages/
You can add this to the developer Google console relatively easily and any connection will submit from your username.github.io. (I believe it also uses https protocol). It also allows me to implement directly using git version control and implements nicely with WebStorm.

X-Frame ORIGINS in IFRAME

A while ago I created an application whereby clients connect to a server using WebRTC protocols.
The clients screen is made up of two halves. One half is linked to the server and receieves things like messages, and has the web page which has the WebRTC javascript in it. The other is an IFRAME. When the client connects to the server, the server sends the client a web address which is loaded in the IFRAME.
I know that some web pages cannot be loaded in an iframe, examples typically having password screens. Google forms does not appear to have this restriction, which is great.
So now imagine I launch a server and ask 20 people to connect to it. All 20 students connect to the server properly, I know because it comes up with all their details on my computer. Typically, from my testing, 15/20 will be fine. The other 5 will get a white screen. When I investigate in the console it is an XFRAMES ORIGIN problem, its saying the webpage being loaded will not allow itself to be loaded in an iframe. However everybody else (who are using the same browser [chrome], and some the same browser version) are fine.
Now I have one solution which works for some students, there is a setting in chrome which is called:
block third party cookies and site data
If this is enabled it doesn't work, if its not enabled it does work.
Now I have 4 students left who still just see a white screen whom I have no solution for. Chrome and Firefox both support the software but both produce the same issue.
The building setup is that students connect to the internet through a server. They must connect via this server as my nameserver is not local and indeed my website is not local either.
I dont think it is a coding issue as it only happens on a few select computers and everything else works just hunky dory. Thus I think it might be an issue with something else: firewall, security settings, config button etc. If anybody has any suggestions for what i can do to remedy this then I would be very grateful for your help.
I have tried to supply all info I believe to be relevant (hense the length) but anything I have missed please ask.
Thank you.
Alex
If the main site's URL is different than the iframe's URL, you'll get an xframes origin problem. This includes the protocol (http vs. https) and full domain (example.com vs www.example.com). In other words, if a user goes to example.com and the iframe uses www.example.com it could cause an xframes origin error. Or if they go to http://www.example.com and the iframe uses https://www.example.com you might get this error.
OK so for people who encounter this issue in the future I am going to create an update this post here. Basically it is for people who want an answer to the issue of iframes just displaying a whitepage.
With these three solutions I have eliminated all my issues, but as I come up with new ones I will post them here. Hopefully its useful to somebody :)
SOLUTION 1
If your iframe is aiming somewhere that requires the user to log in, it is unlikely to work. Password pages are rarely cross origin for obvious and good reasons. The solution is to ensure before they use your iframe page they log in fully to what they are doing, or provide an error message that gives them this information if it happens. See this post for details: Catch error if iframe src fails to load . Error :-"Refused to display 'http://www.google.co.in/' in a frame.."
Where I am we had dual login, so they sign into google and then into the organisation. Both these login areas will cause your page load to fail.
SOLUTION 2 (Chrome ONLY)
Some services react badly to QUIC mode, and some of my users have had issues due to this.
To fix:
1. chrome://flags
2. change QUIC mode to 'Disabled'
SOLUTION 3
If you are working via a proxy server that requires cookies, users may have issues if they have the 'Block third-party cookies and site data' button enabled. Disabling this had a positive effect on how well the iframes were working.
In chrome:
Settings
Search for cookies
Click 'content settings'

How to screen scrape across origins in an IFRAME?

I have a business web app that needs to pull in information from various other web sites. For most sites, the user just instructs the server to pull the data (either using .NET's HttpRequest, or Selenium).
But for some unfriendly, Javascript-heavy sites, our users have to visit the site manually, navigate to the right spot, and copy and paste into our application.
Other than bookmarklets, is there any way for our page to show an IFRAME with the source web site loaded, allow the user to navigate within the frame, and then capture the IFRAME's body?
Since the site in the IFRAME isn't in the same domain (not even close), I can't seem to work around browser cross-site scripting limitations. I've tried using HTML5's "sandbox" feature, but it appears to only allow communication (via "allow-same-origin") the other way, from the IFRAME to the host site, which isn't useful to me. Also, it doesn't work if the site in question attempts to load its frames to the top context.
What I'm ideally looking for is a solution that would allow the browser to be configured to trust my web site implicitly (it's an intranet app) and allow it to access any frame's contents. That would at least get me in the ballpark. Bonus points if I can get the iframe to redefine the "top" context as its own frame, so the hosted site functions properly within the frame.
The best approach I've found through many many screen scraping projects (scraping JS heavy pages) is to create a user-script or Greasemonkey script, setup a few virtual machines in their own IP space (for protection) and feed them a list of sites to visit from a remote program:
Check the queue at a set interval
Request page with Greasemonkey, etc.
Capture contents and send to remote program for processing
You can't use an iframe method and you are going to bang your head up against a wall trying to go that route, the method I've described has worked for numerous large-scale scraping projects.

accessing elements of a child window via javascript in a parent window across domain AND protocol

I'm building an automation tool at work, and I've hit a bit of a snag... The task is to automate the laborious process of navigating a large web-based GUI which sends queries to a database based on the values entered in various fields. We do not have access to the database itself or the server on which the web-GUI is located. Furthermore, the protocol for the web-GUI is https. Is there any way to have javascript open the web-GUI in a new window and then act on it [clicking buttons, reading returned text strings etc.]? The implementation doesn't have to be javascript (autoIT would do the same job much more easily) but I am curious as to how the access denied errors might be overcome. I have read about certain workarounds, but none of them went so far as to actually attempt to interact with elements of the cross-domain document. I have also discovered easyXDM, but it doesn't solve the protocol discrepancy, and I'm not certain it would work for my situation anyway. Any input would be appreciated!
thanks,
CCJ
You are not going to be able to do cross domain because of the same origin policy.
Sounds like you should do something with greasemonkey or with selenium to automate it.

Categories