I'm able to post a status on the users wall using GRAPH API - https://graph.facebook.com/me/feed/. But I have problem with the image associated with the post.
In my case, the picture URL looks like this : https://images.XXXXXX.com/Images.aspx?imageId=??? , retrieves image based on request parameter . If I mention the URL as above I don't see the images displayed . Whereas if I mention the picture URL as a static URL (i.e. https://digitalpictures/test.gif), it works . Please help me to resolve this problem
You could save the image from the picture URL as a file with a static URL, then delete it once it's been uploaded to Facebook.
Make sure the https://images.XXXXXX.com/Images.aspx?imageId=??? can be seen by the facebook linter tool. Use it as an og:image tag on a public url. If facebook can't lint it, you can use it as the Picture URL in your graph API call.
Add Open Graph tags to the GRAPH API request, specifically "og:image", "https://images.XXXXXX.com/Images.aspx?imageId=??" for your image.
Facebook Open Graph Protocol 1
Related
I am displaying around 20 thumbnail images at a time from google drive using the following link syntax, the thumbnail links are stored in a database and are grabbed using ajax POST request. I am testing this on localhost and every time i clear the cache and reload i get a 403 no response from server error on at least a few images. The images are public and are made accessable to anyone and visiting the link manually opens the image every time.
Heres the link i use:
"https://lh3.googleusercontent.com/d/" + imgid + "=s500?authuser=0"
Why are you using this link to get the files?
Try to get one of the links in the File resource:
webContentLink Link for downloading the content of the file in a browser. This is only available for files with binary content in Google Drive.
webViewLink Link for opening the file in a relevant Google editor or viewer in a browser.
iconLink Static, unauthenticated link to the file's icon.
thumbnailLink A short-lived link to the file's thumbnail, if available. Typically lasts on the order of hours. Only populated when the requesting app can access the file's content.
Choose one of the attributes that best fit your needs after that. Make the necessary request
GET https://www.googleapis.com/drive/v3/files/<yout-file-id>?fields=webContentLink&key=[YOUR_API_KEY] HTTP/1.1
Authorization: Bearer [YOUR_ACCESS_TOKEN]
Accept: application/json
After that you can use your retrieved link to show the image.
There is on person having your problem if you want to look over the final result of the img tag.
I'm working with the Trello API. I want to attach an image to a newly created card. I have no problem POSTing the new card and getting the card id to then PUT the attachment.
My project is made in Laravel 5.4 and I'm using Guzzle to make the HTTP requests.
The image I want to attach is from the Google static maps API and I'm using an encoded polyline (which I generate using this script) to draw a figure over some area.
This is how the card should look like:
But it ends up looking like this:
If I go to Trello and attach the image (as an URL) manually everything works perfectly but when I do it through a HTTP request it looks like the second image above.
After doing some research I think the problem resides in the polyline string because it usually contains some characters that HTTP does not support. I've tried using PHP's urlencode() without any result.
I send the image URL as an URL encoded param since that is the only way the Trello API accepts it (even though the official Trello API docs say otherwise).
Do you guys have any other ideas | work-arounds | experience with this issue?
I think you can try to use Google URL Shortener or similar service to convert the complicated URL with encoded polyline to something really simple.
For example, I have the following static maps URL with polyline
https://maps.googleapis.com/maps/api/staticmap?size=512x512&scale=2&maptype=terrain&style=feature:all&path=weight:3%7Ccolor:0xff0000ff%7Cgeodesic:true%7Cenc:}sp}Gmrkl#m#wIiAaB_BaA}IcCmLoFqG_DuFkAyN[mEiBqN}MqFsLqUoxAyG{#qGqJwDkBeJMod#lScMzFcFvAwHn#wH[oGwAwI{EwFqGaHwKcS{e#mKkd#iGsi#wKem#iKg[aPg[_N_RiE{EoUaR{f#}X}d#sWo[mN}]_KqYcDePyCcQaGeUuM{PoO_SsWcLeTiSsi#{Ka[yRgb#sN{S}RaS_XkRiX{OiO{GgMiEoc#aDwq#{Eig#qHyhAeQ{n#Nqj#uOqp#qTcZmNyZkUcRkSsIiL{Qq[qHuPuLk]wIe]mLqd#sLm\kf#yAiRm^oXwe#uAazA}JgR{Qeb#yHsX}Gg\uDyViEwn#wHup#w#sCyT~AaKgo#qJmg#kGaT}Qud#cZch#y{#{gB_OeTaPkQkf#ae#kQcQ}MwPoQu[{GgPkJiZiEoRaIgh#_Gm[oQyj#kPk\iPkTi[cYuOyIqQsGcYuFm]gCug#g#cU{G}IaGeHcH}IsMyFaMsKi]eLw#qKab#kIwe#eDkLyKwRiGsFoOuGcGkAuQm#uH_#{W}DmOkFcJ}E_MkJ{WgTkLgL}I_KwJgGcHoBeGMaIjBuDhA_GRab#aEoKuCqFaEoIsQaG}NkDuL_#qR~BmNdR{b#zEaW~Cee#vEsv#vA}JfEeNpG_Q|A_HfAwOq#qQ{DeRgSou#eb#i|AyJc^aKcOeHyEm_#aNeOsFkDiCmEaGiIiV}e#__B}Kkc#{Q{fAg\wpBkLqrAeWuiDyUuwCqGak#aA_SFeNjCwWhI_WMaRjFgLbVueAdHa[fP}w#fAqT_BoVoHi}#{Hq{#yF}QyFaImH_FaQqGmQcJqH}IuWag#yFkQ{FyZcVcmAeJ_W{LcRqOaNgK{KeI{PeFoW}#eTp#qp#e#oRqHkr#gx#{|IwA_St#iSbAgNnGsXhRks#pNwk#bQsp#tVu|#zF}PhN}\rDoH~BaCvDqEn]el#fP_VrDiFbDaCdXoMbIgErCcDpCaFdCqIpFil#vFsq#ViQ}#qS{Bop#uCkaA{#o[\yVN{t#~W{zAdVowAZeNvA_MbEmTxHeZb#}IpCwQbIe#jMgp#tC_PvFkT~CgMdAaGeAGq#xDkAhEaBdHsBvIcESG|OsAlKaDlF{ErBgFg#}CoCaDcI{EcQ}F{FcHaDiNiGwGoDwGgEgOkEca#mQmVaLyFgEcIiOaG_QiDuLsBuCuJkIgWsT_m#uj#iPgNqSaEoKc#cBRgFpB_DdCqMjHyJxCsJv#aW_AcNsGuF}J&key=AIzaSyDztlrk_3CnzGHo7CFvLFqE_2bUKEq1JEU`
Now I apply the shortener service and get this URL: goo.gl/iytwvS
So, I can use the latter as src of the image as shown in the following example
http://jsbin.com/quridub/edit?html,output
I hope this helps!
Unsplash prefers that users of their API hotlink images from urls that they provide.
Seems almost silly to be asking this, but for some reason this simple piece of code is not working when trying to hotlink an image, whose url I grab from the Unsplash API:
<img src="https://images.unsplash.com/photo-1484995342839-a9eb42974616?ixlib=rb-0.3.5&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=400&fit=max&s=3c7ad78ab40416cdfae002147d8b8003">
This url comes is found in their GET photo response under: photo.urls.small
It is probably a minor oversight on my part, anyone see my mistake?
Problem was an extension called Privacy badger on Chrome that is blacklisting the link.
When I test the code it works. Possibly a cache issue?
<img src="//images.unsplash.com/photo-1484995342839-a9eb42974616?ixlib=rb-0.3.5&q=80&fm=jpg&crop=entropy&cs=tinysrgb&w=400&fit=max&s=3c7ad78ab40416cdfae002147d8b8003">
It is because of the parameter in that image URL. Do try by eliminating the parameters after "?" and just pass the remaining URL as below:
https://images.unsplash.com/photo-1484995342839-a9eb42974616
I have a requirement where in I have to to send an email to customer, I have an email template coming in from database (blob data). And there is an header image which should be displayed in the email when customer opens the email.
The image will not be available on server
The image will not be available online (i.e in any website online).
This image is a client header. How can I embed the static image without referring to any location or any online website.
Yes this is possible by encoding the image in Base64
For more info see this Displaying images in webpage without src URL
Finally you will end up with something like this in your html message:
<img src="data:image/png;base64,iVBORw0KGgoAA.........very_long_string....." />
The general solution to this problem is multipart MIME. You add the image as a part of the email message and use a cid reference in the <img> tag.
However, you're probably using some library to send this email, in which case it probably has an API for creating multipart MIME messages.
in case you don't want to load images from the server then only embeding of image with base64 can workout.
Please refer the link below for more reference.
http://www.bigfastblog.com/embed-base64-encoded-images-inline-in-html
I have an image :
<img id="img1" src="http://igyaan.in/wp-content/uploads/2013/03/Nvidia-580x362.jpg" />
The image from the url is getting cached, but image is not getting displayed.
I analysed it using firebug, where I could see a GET request to the image, and image is returned. And in addition, there is a request to some facebook pic which I never requested (firebug: Bad request):
http://a1.sphotos.ak.fbcdn.net/hphotos-ak-snc7/424831_319096764809781_1948053300_n.jpg
jsFiddle: http://jsfiddle.net/Qb6YX/5/
Any idea why this is happening? And how do i solve this issue?
MoreInfo : iam working on a Rss feed reader , it displays images of posts . I had trouble with this specific website.
It is likely that the image is hotlink-protected. That's why it gets redirected when you try to load it on your page. In this case you should use a server-side proxy to retrieve the image and load it from there.
Using an external service from Images.weserv.nl:
<img src="http://images.weserv.nl/?url=igyaan.in/wp-content/uploads/2013/03/Nvidia-580x362.jpg" />
See jsFiddle
It would be better if you host the proxy script on your server for this purpose so that you have fewer dependencies for your RSS feed reader.
However, there are times when we should respect the site owner's decision of hotlink protection. One way to go about it is to replace an image that cannot be loaded with a default one.