Facebook聊天插件 | NotionNext帮助手册

使用效果

网页右下角弹出一个聊天框，用户可以与站长聊天，可以选择访客匿名、或登录Facebook的Messenger。

站长在pc端的后台，或者app上都可以事实查看消息

配置方式

在NotionNext后台添加两个环境变量即可开启FBChat插件，对应配置文件路径 blog.config.js 。

变量名	变量说明	示例
NEXT_PUBLIC_FACEBOOK_PAGE_ID	你的公共主页ID，类似于公众号ID	`10xxxxxxx215`
NEXT_PUBLIC_FACEBOOK_APP_ID	你的开发者应用ID	`6xxxxxxxxx18`

这两个参数如何获得，请阅读下方的注册方法部分。

开通方法

注册并登录您的facebook账号

www.facebook.com

https://www.facebook.com/login/

一、开通你的公共主页

facebook上创建一个公共主页很简单，按照步骤创建好主页后，即可获得你的PAGE-ID

点击页面左侧的公共主页

点击新建公共主页

填写资料完成注册

填写完成后，会引导你完成一些基础的主页配置，自行选择配置即可。

如何获取PAGE_ID

原先获取PAGE_ID的方式是错误的：

~~完成后，按照提示返回主页。在你的公共主页地址栏URL中可以看到你的~~ PAGE_ID~~；例如此处我的PAGE_ID 就是~~ ~~100095411623547~~

错误截图

正确方式，在公共主页左侧点击设置 → 点击品牌内容

点击品牌内容后跳转的页面中就包含了页面ID PAGE_ID 参数，此处我的PAGE_ID是100411122875215

配置白名单

为了让您的网站允许使用该公共主页的messenger功能，需要如下配置：

点击右上角头像 → 设置与隐私 → 设置；来到你的设置中心

设置中心左侧点击新版公共主页体验

在新版公共主页体验中，点击高级消息功能，并输入您的站点域名，点击添加即可。

二、开通开发者权限

完成此步骤，你就能获得自己的专属应用id，用此id可以调用facebook的功能

点击下方链接，申请开发者

developers.facebook.com

https://developers.facebook.com/async/registration

点击继续

并按照要求验证手机号和邮箱

最后一步，完成注册

这里选择你的属性，可以任选，不影响后续操作

创建一个应用

注册完成自动会来到此开发者首页，您以后也可以随时访问 https://developers.facebook.com/apps/ 来查看您的应用。

点击创建

配置应用

选择facebook，点击继续

填写完应用名字，直接点击创建应用即可。

获取APP_ID

在应用首页即可看到

完成

至此，你已经获取到了APP_ID和PAGE_ID。

在NotionNext后台添加两个环境变量即可开启FBChat插件，对应配置文件路径 blog.config.js 。

变量名	变量说明	示例
NEXT_PUBLIC_FACEBOOK_PAGE_ID	你的公共主页ID，类似于公众号ID	`10xxxxxxx215`
NEXT_PUBLIC_FACEBOOK_APP_ID	你的开发者应用ID	`6xxxxxxxxx18`