I have used sharethis plugin in my website. When I shared a particular page it does not crawl the correct image in the share popup window. But after sharing it to the facebook, I can see the correct image. It happens for a particular page only.
I have checked the og:image property and the image meets all its requirement. The dimension of the image is 362x550. I have no idea why it doesn't crawl the image.
Please anyone assist me to get resolve this issue.
Here is the link I shared via sharethis.
Page Link:
https://www.getcensored.com/m/photocontest/view/Kassie-Tocko
I can't give you exactly solution, but will try to give you at least some direction.
So what I observed with FB debug tool: https://developers.facebook.com/tools/debug/og/object/
Put initial link https://www.getcensored.com/m/photocontest/view/Kassie-Tocko#st_refDomain=&st_refQuery= and you will see that FB will see your og:image tag
Put some other anchor https://www.getcensored.com/m/photocontest/view/Kassie-Tocko#test1 and click "Fetch new scrape information", you will see a message about parsing error, then try to fetch again and you will see og:image
Try repeat 2. several times with different anchors
I had a similar issue, but the problem was 301 redirect, but you don't have it. May be try disable https and test FB sharing via http, just for test. May be problem is with your SSL negotiation time. Some info related FB and SSL here http://www.webpagetest.org/forums/showthread.php?tid=11788
For facebook to get to your image it needs the total url to your image and not the relative url..
Example of tht url that facebook expects to be in its og:image tag content :
http://www.exmaple.com/images/img1.png
I hope this helps you.
Related
I am trying to create an fb share button in my website.
When user clicks on button(fb image) it gets redirected to http://www.facebook.com/sharer.php?u=.
I m setting url as location.href dynamically through js
url is encoded automatically and when i click on button i see http://www.facebook.com/sharer.php?u=http%3A%2F%2F ...
url has a parameter x. it is in the form http://website.com/?x=
after clicking i get facebook error saying this page isn't working. Unable to handle this request.
i tried encoding location.href through js (encodeURIComponent function) but still it doesn't get affected.
There are ways through fb sdk but i am trying the simpler way.
I am using same on twitter and its working fine. (Twitter url is http://www.twitter.com/intent/tweet?text=).
After searching on internet i am unable to come up with any solution yet.
Also tried opening http://www.facebook.com/sharer.php?u= and putting url manually. Still i get the error.
There was no error in setup. But adding additional tag for og:url which pointed to incorrect url was the problem.
Removing meta tag worked.
I have created a Google Plus share button for my portal user (internal user) where portal user can share the content of the portal using the Google Plus share button but unfortunately while passing the content link from the {url} its not registering the url and in preview popup window. It is showing 'link is not valid'. The link which I wanted to share is something like below:
https://example.force.com/portal/apex/homepage?id=kJ054000000CbSXXXX&l=en_US
I encoded it before passing it in the url tag. The link is basically will redirect to a customer login page and after successful login user will able to see the content.
<a href="https://plus.google.com/share?url=https%3A%2F%2Fexample.force.com%2Fportal%2Fapex%2Fhomepage%3Fid%3DkJ054000000CbSXXXX%26l%3Den_US" onclick="javascript:window.open(this.href, '', 'menubar=no,
toolbar=no,resizable=yes,scrollbars=yes,height=600,width=600');return false;" >
<img src="img.png" alt="Google+"/></a>
I had also faced a similar problem in using google plus share URL. It is also mentioned in the google plus share documentation HERE https://developers.google.com/+/web/share/ that You must properly escape any user-generated content that may occur within {URL}. But when I tested it on live server it just worked! So what I found that it will not work on local server but it will on live! you can also test it on live. My functionality is running perfect now!
I have a JavaScript app which uses the Google Drive API. I read how to open a standard sharing dialog here: https://developers.google.com/drive/web/manage-sharing
<head>
...
<script type="text/javascript" src="https://apis.google.com/js/api.js"></script>
<script type="text/javascript">
init = function() {
s = new gapi.drive.share.ShareClient('<MY_APP_ID>');
s.setItemIds(["<MY_FILE_ID>"]);
}
window.onload = function() {
gapi.load('drive-share', init);
}
</script>
</head>
<body>
<button onclick="s.showSettingsDialog()">Share</button>
</body>
Seems like I do everything right, when I click my share button, the dialog starts loading but it can't be loaded.
In the console I see:
Refused to display 'https://drive.google.com/share?...' in a frame
because it set 'X-Frame-Options' to 'SAMEORIGIN'.
I've googled this error and I've seen that there are some similar questions in SO and other sites, but they don't help. I guess Google doesn't allow itself to be in a frame in a not-google-site (cause of "SAMEORIGIN").
What can I do to open sharing dialog in my app?
The "Launching the Google Drive sharing dialog in your app" page here states:
The URL of the page that launches the dialog must have the same origin
as the Open URL registered for the app.
If you then look at the instructions to "Configure the Drive SDK" here, you can see that the "Open URL" section reads:
There are two important things to keep in mind for the Open URL:
Make sure you give a fully qualified domain name for Open URL -- localhost won't work.
The URL must belong to you. After the app registration is complete, you'll need to verify your ownership of this URL in order to create a
Chrome Web Store listing. For more information, see Site Verification.
Hence your page which is launching the dialog does not have the same origin as the Open URL registered for the app in you Google Drive SDK settings. So to fix your problem correct the Open URL so that it has the correct URL i.e. a URL with the same origin as the Open URL. Note that you can change the Google Drive SDK settings via https://console.developers.google.com/project.
As well as making sure the Open URL is set correctly. You'll also need to substitute your Drive SDK app ID for 'MY_APP_ID'. You can find the App ID by following these instructions:
Goto https://console.developers.google.com
Click your project
Click "APIs and auth" on the left
Click the "Drive SDK" settings cog icon
The "App ID" can then be found under the "Google Drive SDK" title e.g. App ID: 47XXXXXXXX3
The problem was solved thanks to this answer https://stackoverflow.com/a/20742994/1185123
dan-man says in his answer:
Client ID You can find this in the Google Cloud Console - see above.
Mine is a 12 digit number, so yours will probably be too.
Mine client id looks like
175564412906-ui22fsaghkvkkj09j2bprku55m8k3d0d.apps.googleusercontent.com
I've used this id in
s = new gapi.drive.share.ShareClient('<MY_APP_ID>');
After reading the answer, I tried to use only first 12 digits of my client id. I didn't expect it to work, I was just desperate. But the strange thing, it works perfectly!
If somebody can explain why it works and why nothing about this is said in the documentation — you are welcome to answer!
I'm looking to add a "tweet this" button to a site. Simple enough, right? The catch is that the site is meant to run on an embedded platform that doesn't particularly handle popup windows, so I'm trying to do everything inside the page.
I'm able to successfully create my tweet button, attach an onClick handler to it, and construct a proper twitter.com/share URL for the relevant content. All works fine when I open that URL in a new window with window.open. However, if I try to open the URL in an iframe, nothing loads inside the frame. Even loading http://twitter.com into the iframe fails in the same way. However, loading Google or any other website seems to work just fine.
Any thoughts on what I'm missing here? Thanks! --zach
Edit:
Yep, they are detecting the iframe on load and blanking the page:
if (window.top !== window.self) {
document.write = "";
window.top.location = window.self.location;
setTimeout(function(){ document.body.innerHTML='';},1);
window.self.onload=function(evt){document.body.innerHTML='';};
}
Any reasonable way to get around this, or am I stuck writing my own auth pipeline through oauth? I don't need anything from their API, just letting users tweet to their own accounts.
Twitter (like Stack Overflow) is probably using some Javascript to ensure they're not being presented in an iFrame:
if(top!=self){
//hates you
}
I ran into something similar recently, and ended up re-doing part of my app without the iFrame element.
Go and get a developper account on twitter and things are made easy for you :)
Can you simply redirect the the twitter share URL? I'm guessing they want to be careful about opening the window in iframe's to prevent malicious sites from tweeting in a user's account without giving the user a chance to first confirm their intent to send this tweet.
You said window.open worked fine for popping up the url in a new window but have you tried popping it into the parent frame?
twtWindow=window.open([url],'_parent',[specs])
#yuval Unfortunately for you, the twitter url goes to a page that has the X-FRAME-OPTIONS:SAMEORIGIN header set in the response. It's not a Javascript check. The browser will simply refuse to render the page after seeing the header. This is done to prevent a clickjacking attack, usually done to steal a user's password.
So your only other option is really to redirect your current page with window.location.href=url.
I've read several of the questions on this but am still a little confused.
For example: OK, I can't post examples because of hyperlink limitations
Here is my exact situation.
I have a site at mydomain.com
One of the pages has an iframe to another page at sub.mydomain.com
I am trying to prepare an onload script that if the page is not in an iframe or the parent domain of the page containing the iframe is not mydomain.com then redirect to mydomain.com.
After the initial permission issues I realised the problem with sub domains counting as separate domains.
One of the posts above says that "could each use either foo.mydomain.com or just mydomain.com"
So I tried (for testing):
onload="document.domain='mydomain.com';alert(parent.location.href);"
This produced the error (http replaced with lar
Error: Permission denied for <http://sub.mydomain.net> (document.domain=<http://mydomain.net>) to get property Location.href from <http://mydomain.net> (document.domain has not been set).
Source File: http://sub.mydomain.net/?pageID=1&framed=1
Line: 1
Removing the alert produces no errors.
Maybe I am going about this the wrong way since I do not need to interact with the parent just read its domain if there is one.
A nice simple top.domain. For read only there must be a way so that people can prevent their own pages being used within other people's sites.
You can't (easily) do this because of security restrictions.
This answer from #2771397 might point you in the right direction.
OK, while looking at the error console I still had open when I got home a wee lightbulb lit up. I am pretty new to javascript (can you tell ;) but I thought "If it has try/catch"...
well here is a hack at least to get the name of the top domain and an example of how I will use it in my site to show content only if the page is a frame in the correct domain.
Firstly the header will have the following partially PHP generated function:
function getParentDomain()
{
try
{
var wibble=top.location.href;
}
catch(err)
{
if (err.message.indexOf('http://mydomain.com')!=-1)
{
createCookie('IAmAWomble','value')
}
}
}
Basically the value will be something based on the PHP session I think. This will be executed at page load.
If the page is not within the proper site or if javascript is not enabled then the cookie will not be created.
PHP will then attempt to read the correct value from the cookie and show the content or an error message as appropriate.
I do see a slight flaw in this for first visit since page load will run after PHP has generated the content but I'm sure I can work around this somehow. I thought I'd post because this is at least what I was initially asking for and that is a way to read the URL of a parent site if it is in a different domain to the site in the frame.
IIUC you want to use the window.parent attribute: “A reference to the parent of the current window or subframe.”
Assumably, window.parent.document.location.host contains the container page URL domain name.