I have a website with a great base for a narrow category of data (such as astronomy). Customers interested in my content and they want me to be given them finished blocks (widgets) to paste into their site. API is difficult for them, they need just finished blocks with specific information.
My question is: Is it possible to display the widgets only on the sites of my customers and how to implement it technically? And if some unknown wise guy copied the widget code to his site, he could not see the widget content.
I understand HTTP_REFERER is not suitable, because it is easy to forge. And what are the technologies? I've heard about software tokens, and the ability to sign requests, but do not know if they are suitable for my situation and how to practically implement it. Please suggest?
If I start to work with my customers, then I shall include them into my database and can be stored there any info, associated with them
I accomplished the task due to HTTP access control (CORS). Widget controller manages external requests via database settings:
Customer ID
Customer date range limit
Customer domains which used for "Access-Control-Allow-Origin" header
So unknown customer couldn't render my widgets on their website even if they copied widget code.
Widget content loads dynamically into client iframe from external JS via ajax request. This ensures asynchronous data loading on customer website, and lets only authorized client with known domains to load widget content
Related
I am building a website in which I have included third part weather html widget, the widget looks from reliable source and is trusted over web. This widget is in the form of link and a small javascript tags which are then rendered once loaded.
I wanted to know how safe will my site data will be once I load this or other widgets, will they be able to sniff my site data including cookies, html,css etc.
When you use 3rd party JavaScript on your site, you have to trust them. You are, in effect giving them permissions to run whatever code they want in your site. That code could:
Read cookies that are not set as HTTP only
Access all the data on the page
Call JavaScript APIs from your server that would not normally be accessible to 3rd parties
Change anything on they page
Send any data they find back to the 3rd party (or any other party)
These ability could potentially be abused for any number of nefarious purposes such as stealing your data, redirecting your users, or tracking your users.
Here is a related article that goes into more detail: Jeremiah Grossman: Third-Party Web Widget Security FAQ
Cookies you can't copy because they work only for domain if u change domain the browser begin new cookies .
Html and js it is very easy to copy the is few option to do this:
httrack
use view source
and more option...
I was wondering if there's a way to add html to a webpage (from another domain) before displaying it in a iframe. Basically my idea is to make a website that allows the user to type in a website and choose or add things to the page, like copy a yahoo anwsers page and still have it function (so javascript and all still works) but the background has changed or a button that does a specific thing to the page has been added in. So far I keep running into cross domain policies and I have no idea how to get round these.
No, you cannot, this will be a massive violation of information security codes.
Imagine if someone could access your code, js and html and just alter it and access your information.
even worse, if you have sensitive information stored in the client code (you shouldn't but lets imagine), everyone across the web will have access to that information.
Displaying the webpage is one thing, you have api's for this sort of things (for example, google, twitter, facebook api's) and you pay for them too.
The reason you are running into cross domain policies is because you are not allowed to make that request. Not by JsonP and not by CORS Requests.
If you want access, look for a proper api.
For beginners, here is the Yahoo Api (Yql)
And here is it's Terms of use
Read them before you continue.
You can't do that because, if you could, an attacker could use this to exploit referred page.
Source: https://developer.mozilla.org/pt-BR/docs/Glossary/Cross-site_scripting
I have a static site where users can generate images and content in unlimited combinations. When the user is finished, permalink is generated to allow them to share their creation via Facebook/Twitter/GooglePlus/etc. I want their shared post to contain the user's image and content, but I discovered that the social media bots only parse HTML meta tags from my permalinks, and they do not evaluate any Javascript.
How can I make my user's content appear on the shared social media post? When the permalink is clicked, client side Javascript will evaluate the permalink's query params and render the user's content. I can render the user's content inside HTML meta tags too, which is used by Twitter and FB to populate a post's content, but the bots don't evaluate any javascript, so the meta tags are not rendered.
One possible solution that I have explored is pre-rendering. Perhaps my permalink can be the location of an HTML file on an AWS S3 bucket, which I can create as soon as the user shares their permalink. That HTML file on S3 can have the user-specific meta tags in it, and I can provide that to the social media bots. And when that file is accessed, I can have it redirect to my permalink. Does this seem reasonable? I can report back after trying this out.
Another solution is to use a pre-rendering service, like https://prerender.io/. It seems a bit bulky and black-boxed, but it might be more robust and reliable that my S3 solution above. Any ideas?
I am open to feedback and other solutions, and any suggestions would be great.
other relevant info:
This answer seems interesting, which involves activating the Facebook Javascript SDK:
https://stackoverflow.com/a/34178987/1884158
And I am aware of tools like Twitter's Card Validator and Facebooks Share Debugger, here:
https://cards-dev.twitter.com/validator
https://developers.facebook.com/tools/debug/
which will be useful for testing any solutions.
And if it helps, my site is a React app that is bundled in HTML/CSS/JS and rendered entirely on the client.
I haven't found a proper solution to this problem, but I did come up with a workaround/hack that involves setting up a separate service. Here is the service that I came up with: https://github.com/mapseed/sharing/blob/master/share.js
If our static site is hosted at example.com, we can spin up a server running at sharing.example.com that accepts requests and will either redirect the request from sharing.example.com/my/route to example.com/my/route. But if the request has a user-agent HTTP header matching a social media crawler, as we are doing here, then we return an html page containing just the meta tags, as we are doing here.
This approach has a couple of restrictions, however:
The links that we want to share on social media need point to our sharing.example.com subdomain. This will make it possible for our service to return an HTML page with the proper meta tags if the request is coming from a social media bot, or otherwise redirect the request to our example.com website otherwise.
In order to generate the content of our meta tags, our shareable links will have to have query params to pass all of the information to populate our meta tags. For example, our shareable link would look like this: sharing.example.com/post/my-post?title=my-title&desc=my-description. This means that our shareable links can get quite long. You can see how we extract the information from our query params and inject it into our HTML template with the meta tags here: https://github.com/mapseed/sharing/blob/master/share.js#L18-L27
If these restrictions are acceptable, then this solution works quite well. Note that there is also a downside for SEO, because the links that will be shared are coming from sharing.example.com, and not our example.com website.
Also, we will have to spin up an extra server to run this service. Although we should be able to migrate this implementation into a serverless architecture, like AWS Lambda.
I am looking for a way to show Facebook engagement on from our website on our Facebook page. IE, when someone likes/shares etc. a page on the website, that that activity be reflected by our Facebook page in some way.
I was planning on using the graph API calls to do page updates, but the permissions are granted to users, not to the app itself, meaning this would only be possible for existing administrators, defeating the whole purpose (Perhaps a bit obvious in hindsight).
Is there a good, clean way of posting page likes/shares of our web pages to our Facebook page feed?
Notes:
I'm working in PHP and/or client side JS
A high volume of posts drowning our regular content is not likely at the moment, however, advice about how to manage such a beast in the long run might be helpful
If I understood correctly and want to share content from Facebook into your Website, the behavior you mention used to exist via the Activity Feed or Recommendations Feed. However, it has been deprecated since Graph API version 2.3.
If what you want is to update comments from people in your Website to your FB Page, you could implement something in your backend which listens to content uploaded and uses your Page Access Token to create custom stories using your user's data. As you mention, it won't happen in the name of people, but you could be creative and make the text narrate what people did on your website. Maybe even use OpenGraph for this.
Is there a way for me in javascript to enable a user to parse a html page as they would see it.
So imagine a button on my website and if they click on it, I get a javascript string which contains the entire html page of e.g. bbc.co.uk, as that user sees it.
Is that possible?
Arbitrary 3rd party websites? No. If you could do that you could read people's bank statements from their online banking, the email from web mail services and so on. This security measure is called the same origin policy.
You can read data from co-operating websites via CORS (for HTTP requests) and postMessage (for frames).