How to get the twitter picture of a user?
I am 开发者_StackOverflow中文版making a website in which people put in a twitter username. Now I want to load the twitterimage of the name that is put in. I have searched on the internet already but can't find a good easy way to implement this. Do i need to use some fancy twitter api or something? Any simple API's? (it is only for a simple site) or URL's with name as variable in it?
this works:
<!DOCTYPE html>
<html>
<head>
<script type="text/javascript">
function GetImage(){
var txtBox = document.getElementById("twit");
var imgTwitter = document.getElementById("imgTwitter");
imgTwitter.src = "http://api.twitter.com/1/users/profile_image/" + txtBox.value;
}
</script>
</head>
<body>
<input name="twit" id="twit" type="text"><a href="#" onclick="javascript:GetImage();">Get Image</a>
<img id="imgTwitter" >
</body>
</html>
From this question: https://stackoverflow.com/a/30322178/6539400
https://twitter.com/[screen_name]/profile_image?size=mini
https://twitter.com/[screen_name]/profile_image?size=normal
https://twitter.com/[screen_name]/profile_image?size=bigger
https://twitter.com/[screen_name]/profile_image?size=original
function ClickFunction() {
document.getElementById("content").innerHTML = "";
var frag = document.createDocumentFragment();
var uname = document.getElementById("name").value;
var SRCmini = "https://twitter.com/" + uname + "/profile_image?size=mini";
var SRCnormal = "https://twitter.com/" + uname + "/profile_image?size=normal";
var SRCbigger = "https://twitter.com/" + uname + "/profile_image?size=bigger";
var SRCoriginal = "https://twitter.com/" + uname + "/profile_image?size=original";
frag.appendChild(document.createTextNode(SRCmini));
frag.appendChild(document.createElement("br"));
var IMGmini = frag.appendChild(document.createElement("img"));
IMGmini.src = SRCmini;
frag.appendChild(document.createElement("br"));
frag.appendChild(document.createTextNode(SRCnormal));
frag.appendChild(document.createElement("br"));
var IMGnormal = frag.appendChild(document.createElement("img"));
IMGnormal.src = SRCnormal;
frag.appendChild(document.createElement("br"));
frag.appendChild(document.createTextNode(SRCbigger));
frag.appendChild(document.createElement("br"));
var IMGbigger = frag.appendChild(document.createElement("img"));
IMGbigger.src = SRCbigger;
frag.appendChild(document.createElement("br"));
frag.appendChild(document.createTextNode(SRCoriginal));
frag.appendChild(document.createElement("br"));
var IMGoriginal = frag.appendChild(document.createElement("img"));
IMGoriginal.src = SRCoriginal;
frag.appendChild(document.createElement("br"));
document.getElementById("content").appendChild(frag);
}<input id="name" value="wikipedia" /><br />
<button onclick="ClickFunction()">Click here!</button><br /><br />
<div id="content"></div>
加载中,请稍侯......
精彩评论