如何制作社交网络徽章？
你到处都可以看到它们。就像博客和网站上显示的 Twitter 和 Facebook 按钮一样，显示大量“推文”或“喜欢”。 我需要做的就是根据两个变量（用户名和 ID）显示 MySQL 数据库中的数字。以某种方式加密变量可能会很有用，这样用户就不能仅仅更改徽章的代码并显示另一个用户的号码。 但更重要的是，我只需要知道如何使用 HTML 代码，就像您在社交网络徽章中找到的那样，并让它与我的服务器上的 PHP 脚本对话，该脚本将根据徽章中保存的变量计算数据库中的数字。
有线索从哪里开始吗？
编辑：我不是在谈论像您在 stackoverflow 上找到的那种徽章，我的意思是其他网站允许您粘贴到博客/网站上的那种徽章。就像 Digg 可以让你显示你的网站已经被挖掘了 7000 次，等等。
You see them everywhere. Like the twitter and facebook buttons that show up on blogs and websites that display a number of "tweets" or "likes".
All I need to be able to do is display a number from my MySQL database based on two variables (username and an ID). It would probably be useful to encrypt the variables somehow so that users can't just alter the badge's code and display another user's number.
But more importantly, I just need to know how to use the HTML code like you find in social network badges and have it talk to a PHP script on my server which will calculate the number from the database based on the variables held within the badge.
Any clue where to start?
Edit: I'm not talking about the kind of badges like you find on stackoverflow, I mean the kind other sites let you paste on your blog/site. Like Digg lets you show that your site has been dugg 7000 times, etc.
如果你对这篇内容有疑问，欢迎到本站社区发帖提问 参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱，如果其他用户或者作者回复了您的评论，将不能在第一时间通知您！
发布评论
评论（2）
您可能希望查找 PHP 的 GD 库和相关教程。基本上，所有这些徽章都是由静态图像作为模板，在顶部插入一些动态文本，通常由用户名和数字（喜欢、推文等）组成。
对于 HTML 代码，您将执行类似以下操作：
这将向您的脚本发送 HTTP GET 请求，使其执行。然后，您的脚本可以与数据库通信，获取用户信息，使用 GD 将该文本插入到模板中，然后将其以正确的 mime 类型和内容返回到浏览器。
You may wish to look up the GD library for PHP and related tutorials. Basically, all those badges consist of is a static image as the template with some dynamic text inserted on top, usually consisting of the username and a number (likes, tweets, etc..).
For the HTML code, you would do something similar to:
This will send a HTTP GET request to your script, causing it to execute. Your script can then communicate with the database, fetch the user's information, use GD to insert that text into a template and then return that to the browser with the correct mime type and content.
本质上，您正在谈论调用远程脚本。
我猜你的意思是这样的——
您正在查看您的个人资料。例如，您有一个小部件，它承诺显示您拥有的总点数。
您提供一个“代码”按钮，例如 YouTube 嵌入或 Facebook“喜欢”
用户单击此按钮，获取一段代码，并期望能够将其粘贴到互联网上适用的任何位置，并且该代码将生成一个图标或可能包含用户名及其积分的内容。
首先，您可以通过多种方式做到这一点。在我看来，最具成本效益的方法是在更新时在服务器上生成用户按钮 - 就像你的积分意味着“收到的文章的赞数”一样，所以它将是一个整数值。每次您获得赞许时，您都会重新缓存该按钮并将其写入平面文本文件。如果你擅长的话，你可以将其写入图像并将其拼合为 jpg 或 gif。如果您不知道如何做到这一点，您可以将其写入 html 并将文件保存为用户特定的“slug”，例如 md5(username).'.html' - 这样每次调用服务器时，您就不需要不需要通过冗余查询和帐户查找来增加带宽。您仅提供优化后的图像或 html 文件。
其次 - 您可以为用户提供一个包含 html 的 iframe。这通常是 facebook 对不使用 fbml 方法的人进行“点赞”的方式。问题是，许多网站将 iframe 视为潜在的 xss 攻击，并将其剔除。因此，为了使用 iframe，您需要控制该域，如果您的目的是分享您的个人资料，这可能会违背您的请求目的。
第三，您可以调用服务器上的 js 文件，该文件对数据库进行 ajax 调用并提供结果。这也很可能被视为 xss 攻击，您可能甚至不应该更多地考虑它。
我提到了 iframe 和 js 方法，以防您希望为运行自己网站的其他人提供一个选项。网站所有者使用“喜欢”的方式来显示他们的域被“喜欢”的次数等等。这些人拥有域的控制权，因此 iframe 和 js 方法是合乎逻辑的。
所以 -
这个答案可能没有太多原始代码，但它应该可以帮助您开始。
我会使用图像方法，因为它更安全。您将为用户提供一个图像标签，其 slug 位于 src 属性中。他们可以将其粘贴到任何地方，并且无法在图像中重写数字。大多数论坛和您可以在其他人的网站上发帖的地方都允许使用图像。只需在 google 上搜索一下使用 php 绘制图像，以及使用 imagemagick 库来合并文本和图像即可。
You're talking about calling a remote script, essentially.
I assume you mean something like this -
You are viewing your profile on your side. You have a widget that promises to display the total number of points you have, for example.
You offer a "code" button like youtube embed or facebook "like"
The user clicks this, gets a segment of code and is expected to be able to paste it anywhere on the internet where applicable and the code will generate an icon or something with presumably the username and their points.
First, you can do this several ways. The most cost effective, in my opinion, is to generate the user button on your server on update - like say your points meant "number of thumbs up your articles received" so it will be an integer value. Every time you get a thumbs up, you would re-cache the button and write it into a flat text file. If you're good, you would write it to an image and flatten it to a jpg or gif. If you don't know how to do that, you can write it to html and save the file as a user specific "slug" like md5(username).'.html' - that way every time the server is called, you don't need to pile on bandwidth with redundant queries and account look ups. You only serve the optimized image or html file.
Second - you can give the user an iframe that has the html in it. This is generally how facebook "like" does it for people that don't use the fbml method. Problem is, many sites see iframes as potential xss attack and will strip them out. So, in order to make use of the iframe you would need to have control of the domain, which may defeat the purpose of your request if the intention is to share your profile goodies.
Third, you can call a js file on your server that makes an ajax call to your database and serves the results. This is also most likely going to be seen as xss attack and you should probably not even give it much more thought.
I mentioned the iframe and js methods in case you were looking to provide an option for other people who run their own sites. The way "like" is used by site owners to show how many times their domain has been "liked" and so on. These people have control of domains so the iframe and js methods are logical.
So -
This answer may not have much in way of raw code for you, but it should help you start.
I would do the image method since it is safer. You would give the user an image tag with their slug in the src attribute. They can paste it anywhere and there is no way to re-write the number within the image. Most forums and places where you can just post to other people's sites allow images. Just do a google search on drawing images with php, as well as using the imagemagick library to merge text and images.