Does facebook graph api needs image url for displaying image? - javascript

I have a webpage and a F-Share button. On clicking this button, an image uploaded by the user is posted on facebook. I tried to initially use javascript to set the 'picture' property with image data from fileupload and it didn't work. So, my guess is that, Facebook does'nt save the images to its server but instead fetches them and displays them from the url we provide. Is that the case? If not, please guide me how can I use the image from fileupload in the 'picture' property?

If you mean the thumbnail that is posted on the FB wall when sharing a page, you can control what image is used by defining some META tags. Here are some examples from the docs:
http://developers.facebook.com/docs/share/
Look under "Sharing Rich Media"

Related

How to share a link with image on facebook

I'm trying to make link button that shares the page on facebook, I'm using that url from facebook https://www.facebook.com/sharer/sharer.php?u=. The problem is the page I want to share has a dynamic image, so depending on the parameters in my url the image should be different, for example events.com?id=2, this should bring an image related to event 2 and so on, so I can't put the meta tag on my head. I was trying to add the meta tag after I receive the data from my database using jquery but it doesn't work. any suggestion?
You need to add meta tags to your page. More info in the following documentation

Is there a way that I can autopopulate my webpage with pictures from another website?

I'm making a simple website (think of it as wikipedia without the text), where the users click links to people's names and then go to that person's personal page. I would like to be able to have an image of the person also show up on the personal page, but I don't want to hard code the links to the images or save them on my computer.
Is there a way that I can get the top search result from Google images and then copy that link to put into each page dynamically?
I would suggest using the google api (Google image search api ), pull a search on page load for the user, parse the json for the "unescapedUrl" and use that as your img src attribute.

How to extract all images from a Facebook page?

Consider an example page like this
Now, it displays all the image thumbnails. I click on the thumbnail and then I right click on larger version of image and copy the image location. Is there any way to do it programmatically. I have tried to use goutte to extract links after scraping webpage but it does not extract any link may be because the page is generated dynamically.
Is there some other way to do it?
$crawler = $client->request('GET', 'https://www.facebook.com/TedTheStoner2/photos_stream');
$crawler->filter('.uiMediaThumb')->each(function ($node)
{
echo $node->attr('href').'<br>';
});
You really should use the facebook graph api for reading those pictures.
That way you will be able to get a complete list of images and then read every single image for more details.
You will not be able to crawl the picture gallery the way you've tried without using a javascript-enabled solution as the pages are rendered by JS on pageload.

show contents of link

I've been searching the internet to get some information about how i can be able to detect and show what a url is about.
Facebook has a good example of what i actually want to achieve:
If you create a update on facebook and paste in a URL, facebook will detect some information about it and show a box with some text and often the right picture.
for instance, take: http://www.ebay.com/itm/Mens-Monk-Strap-Loafers-Suede-Lined-Metal-Buckle-Slip-Casual-Dress-Shoes-New-/311170422772 . then it shows the image of the shoe and headline.
Ive found other services which does this with image services and youtube, but what i need is about getting information of products most of the time, so often urls from shops. So the user pastes in a url, and i can detect what that link is about.
any ideer how this can be done ?
Is it backend code, like c# or javascript ?
Hopefully some of you can point me in the right direction. Thanks in advance!
Facebook scrapes pages for specific metadata in the back-end and uses it to generate the snippets you see, which can either be served along with the initial page load or brought in via JavaScript (front-end). From there it's a matter of using CSS and JS to style the popup to your liking.
Depending on how inter-related your site is with the content you want to display, this can be an easy task or a difficult one.

Google image search by image uploader form style

I'm attempting to implement an image upload tool on my website, similar to how Google has done their image upload search. This would need to be able to have images dropped into it; have urls pasted into it; or have a user upload it from their own computer.
Another related question, how does Google have the selection method change when you click 'Paste URL' or 'Upload file'?
images.google.com for idea source.
Thanks in advance.
I believe Google spent several years developing the algorithms behind searching for images with other images, so if this a website you are developing for yourself, I'd explore other options. Otherwise, tell your boss it's impractical.
As for the method change, I imagine (without looking too closely) that they overlay the camera icon on the input, and on click, displays a <div> or other container element over the input field, which can then contain alternative input methods.
When the user clicks on Paste or Upload, it replaces the content of a sub container with the relevant HTML using jQuery or whichever JavaScript library it is that they use.

Categories

Resources