如何添加Facebook登录到我自己的网站?

问题描述:

*使用不同的方式登录其网站,例如用Facebook登录名.

* uses different ways to login to their website, e.g. with the facebook login.

使用facebook社交插件(请参见社交插件),您可以添加一个赞按钮或Facebook登录名.但是,如何通过*管理将Facebook帐户与*帐户连接起来?

With the facebook social plug-ins (see social plugins) you can add a like button or a facebook login. But how it is managed by * to connect the facebook account with a * account ?

Facebook社交插件: 登录按钮 Facebook提供了许多他们所谓的社交插件.我们感兴趣的一个是登录按钮.以下是将按钮添加到您的网页所涉及的基本步骤:

Facebook Social Plugin: The Login Button Facebook offers a host of what they call social plugins. The one we are interested in is the Login Button. Here are the basic steps involved in getting the button onto your webpage:

您的网站需要一个Facebook应用.转到 https://developers.facebook.com/apps/并单击创建新应用" 按钮.

You need a Facebook app for your site. Go to https://developers.facebook.com/apps/ and click on the "Create New App" button.

您的应用显示名称"可能有意义. 我通常会使用该站点的域名.您将来也可以将此同一个应用程序用于其他目的. 应用程序命名空间"必须是不包含任何特殊字符的内容. 我通常使用我的应用显示名称,不带空格,句点等. 现在,您需要输入应用程序域"和网站站点URL".对于应用程序域,请输入托管您网站的域名. 对于网站URL,请输入您网站的完整URL. 例如,如果您的域名是name.com,则您的站点URL应该类似于 http://www.name.com 一个>. 输入正确的信息后,保存更改. 现在,您将拥有一个页面,显示您的应用程序ID"和应用程序机密". 只需将该页面保持打开状态,因为在将登录按钮代码添加到页面时,您将需要您的应用程序ID. 现在,我们需要从Facebook获取登录按钮代码.转到 http://developers.facebook.com/docs/reference/plugins/login/,然后单击获取代码"按钮. 从第一个框中复制HTML5代码,现在将其放在网页的正文"标签正下方.代码应如下所示:

Your "App Display Name" can be something meaningful. I usually go with the domain name for the site. You can use this same app for other purposes in the future as well. The "App Namespace" needs to be something that does not contain any special characters. I usually use my app display name without spaces, periods, etc. Now you need to enter your "App Domain" and Website "Site URL." For the app domain enter the domain name on which your site is hosted. For the site URL enter the full URL of your website. For example, if your domain is name.com then your site URL should be something like http://www.name.com. Save your changes once you have the proper information entered. Now you will have a page that shows yours "App ID" and "App Secret". Just leave that page open because you will need your app ID when you add the login button code to your page. Now we need to go get the login button code from Facebook. Go to http://developers.facebook.com/docs/reference/plugins/login/ and click the "Get Code" button. Copy the HTML5 code from the first box and for now put it just below the body tab of your webpage. The code should look something like this:

<div id="fb-root"></div>
<script>
   (function(d, s, id) {
     var js, fjs = d.getElementsByTagName(s)[0];
     if (d.getElementById(id)) {
       return;
     }
     js = d.createElement(s); js.id = id;
     js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=APP_ID";
     fjs.parentNode.insertBefore(js, fjs);
   } (document, 'script', 'facebook-jssdk'));
</script>

在代码中,请确保将APP_ID替换为您为Facebook应用创建的应用ID. 现在,将第二个框中的代码粘贴到您希望登录按钮驻留的任何位置.该代码应类似于:

In the code be sure to replace APP_ID with the app id you created for your Facebook app. Now paste the code from the second box in whatever place you want the login button to reside. The code should look something like:

<div class="fb-login-button" data-show-faces="false" data-width="200" data-max-rows="1"></div>

我将data-show-faces属性更改为false,因为将其设置为true,当用户登录时注销按钮将不呈现.

I changed the data-show-faces attribute to false because with it set to true the logout button will not render when the user is logged in.