I have a service and would like clients to be able to place this service on their website. I am looking at doing this by using an iframe. I will provide the code and they can just copy and paste the code to show the functionality. Each client will be discovered by the query string.
There is a concern that anyone can look at the source of the website, copy the iframe and add it to their own website therefore using the service and charging the original client. I obviously want to stop this.
Ideally, I would like to verify that the website that is using the iframe is linked to the client who registered to use the service. Is this possible at all? I know there are issues with cross domain security.
If it isn't possible, I guess I would need to create a widget instead.
For each client, have a whitelist of web sites that can embed the iframe. Then check the 'referer' header against that list whenever the page inside the iframe is loaded.
Or if http headers prove to be unreliable try using javascript, via parent.document.location.href
Related
I have a static website, it only contains html and css. No javascript, no php, no databases. On this site, I'm using images, which I get from image-hosting websites (like imgur).
I've noticed when I visit my website (on Google Chrome at least), if I click the information button next to the URL, it says there are cookies on this site. If I click on the cookies button, it says The following cookies were set when you viewed this page and has a list from cookies, including from those sites that I use for image-hosting.
If I delete them, they come back after a while, but not immediately. I'm trying to avoid cookies as the site is very simple. Are they considered part of my site? If so, is there anything I can do, except hosting the images myself?
I always though that if you link to an image directly (as in a link ending in .png for example) it would be the same as if you were hosting the image yourself, and there would be no javascript being run (to save cookies).
Are they considered part of my site?
That depends on your perspective.
The browser doesn't consider them to be part of your site. Cookies are stored on a per-domain basis, so a cookie received in response to a request for an image from http://example.com will belong to http://example.com and not to your site.
However, for the purpose of privacy laws (such as GDPR) then they are considered part of your site and, if they are used by the third party to track personally identifiable information, you are required to jump through the usual GDPR hoops.
If so, is there anything I can do, except hosting the images myself?
Not really.
I always though that if you link to an image directly (as in a link ending in .png for example) it would be the same as if you were hosting the image yourself, and there would be no javascript being run (to save cookies).
Cookies are generally set with HTTP response headers, not with JavaScript.
Whenever a browser requests a file from a server it automatically forwards any cookie data along with the request. Image Hosting services may use that for different purposes.
I always though that if you link to an image directly (as in a link ending in .png for example) it would be the same as if you were hosting the image yourself, and there would be no javascript being run (to save cookies).
So the question is, how to they set these cookies?
Let's say, you use a simple img tag to load an image from a hoster.
<img src="imageHoster.tld/123xyz.png">
The site imageHoster.tld can handle that request by redirecting all requests to e.g. requestHandler.php and that file can set the cookie before sending the image with a simple
<?
setcookie("cookieName", "whateverValue", time()+3600);
header('content-type: image/png');
...
?>
What happens there is actually the same as if you would set the image source like that:
<img src="imageHoster.tld/requestHandler.php?img=123xyz">
Are they considered part of my site?
Since these so called third party cookies are set when visiting your site one could consider them as part of your site. To be on the safe side I would at least mention the use of third party services in the data privacy statement.
If so, is there anything I can do, except hosting the images myself?
Third party cookies can be disabled in the clients browser. But you can't disable them for the visitors of your site. So no, to avoid third parties setting cookies on client browsers visiting your site you can only avoid using their services.
I'm using a online web builder to create my website. Once the site is published, it automatically sets their (web builders) third party cookies (google analytics, etc). There is no way to disable it in the platform.
However, under the new EU law, you are not supposed to download any cookies to the users computer, without their prior consent.
I can modify the header html code. Is there a way to generically block all cookies in the html header of my webiste?
Is there a way to generically block all cookies in the html header of my webiste?
No.
If you think your hosting service is exposing you to legal problems, then don't try to hack around them, either talk to them so they fix the problem or find a new host.
I read more in the Internet, but I didn't managed to find solution to this problem:
Is it possible to attach some external content in case of sending X-Frame-Option=SAMEORIGIN by server ?
I know that <iframe> can't be used, however maybe there exists some another way.
Thanks in advance
No, it's not possible to show another page's contents within your website if they are setting the HTTP header X-Frame-Options: SAMEORIGIN. That header says that the page can only be embedded on pages on the same domain name.
However, if you are running your own server-side application (i.e. using PHP, Node.js, etc), you can scrape the website on your server, and then display whatever info you needed from the other site that way. It will be more work this way, and you probably won't be able to perfectly replicate how everything appeared on the source site, but it's the only route you've got. I suggest googling "scraping" + the name of your server-side language/environment to learn how to do this.
So I am working on a fairly simple project, basically a web page that should list the captions from a certain instagram account. It's all designed, it just needs to be lit up with the content. Have a look at http://evanshellborn.com/speechofthebeets/.
I found that you can see a json file containing all the necessary data at instagram.com/{username}/media. So in my case, https://www.instagram.com/beets_are_life/media/. So before I put that page actually online, I was on my local machine, and I did a JSON call to that page and it worked perfectly. So I built it all out and my web page loaded the captions just like I wanted it to.
Then I went to put it online, (http://evanshellborn.com/speechofthebeets), but it doesn't work. Have a look at the script at the bottom of it, on my localhost that code works and the captions get loaded. But on the live page, I get an access not allowed error in the console. So I think Instagram doesn't allow this sort of direct access anymore, you have to go through their API.
Now I've tried looking at the API but it seems rather confusing. Basically what I'm asking for is a different JSON url that would give me the same result as https://www.instagram.com/beets_are_life/media/, but that would work from the live page.
I think https://api.instagram.com/v1/users/{user-id}/?access_token=ACCESS-TOKEN would work, just replacing {user-id} with the appropraite user_id. But where do I get an access token?
From reading https://www.instagram.com/developer/authentication/, it looks like you get one when a user puts in their user credentials. But I don't want to have anyone log in, I just want a simple web page.
Hopefully that made sense. How can I do what I want?
Looks like the API url https://www.instagram.com/beets_are_life/media/ does not support jsonp (no callback support), so u cannot use javascript (client side) for making API request, it will fail because of Access-Control-Allow-Origin error on browser side, you have make this API call on server side as proxy.
I guess https://www.instagram.com/<USER_NAME>/media/ is not a publicly documented API, thats the reason it is not supporting jsonp, Instagram uses it for their website and since it is same-origin it will work for them on client-side
This link will help you embeding the instagram on a simple html webpage.
There is a button on the bottom of the post on instagram.when you click on the link a menu pops up. then click on embed
now a box pops up
just copy paste the html and you are done.
it will fetch the post for you
I've an app, which loads data from database. In a table I'm storing some URLs EX: https://facebook.com. Remember these URLs are dynamic and are controlled in admin panel.
Now, I need to get contents of these URLs and display it inside iFrame or inside a div within my app. Idea here is user should not go away from my app.
When I tried to load https://facebook.com it never loads because they've (X-Frame-Options) enabled.
Is there any solution for this?
You cannot tell the browser to ignore the security instructions provided by the third party site. That would defeat the object of having them in the first place.
If you want to display the content on your site, then you will have to display it from your own server (e.g. by using a server side process to read the data from the third party site and serve it from your own). Obviously, this will mean that you cannot (for example) load Facebook using the user's own credentials.