Cocos Creator 3.x接入Facebook Instant Games

由于Cocos官方在2.4之后就不在内置FB Instant Game，所以需要接入就需要开发者自己手动接入。本人第一次接入，将接入流程记录如下。

1.Cocos 发布 web-mobile

2.修改index.html，本人因为要接入banner，所以用了编辑此文时较新的FB SDK版本

<script src="https://connect.facebook.net/en_US/fbinstant.7.0.js"></script>

3.修改application.js中的onGameStarted函数

1.  
   function onGameStarted(cc, settings) {
2.  
   window._CCSettings = undefined;
3.  
   cc.view.resizeWithBrowserSize(true);
4.  
   var launchScene = settings.launchScene; // load scene
5.  
   FBInstant.initializeAsync().then(function(){
6.  
   cc.director.preloadScene(launchScene, function(completedCount,totalCount) {
7.  
   FBInstant.setLoadingProgress(100 * completedCount / totalCount);
8.  
   }, function(){
9.  
   FBInstant.startGameAsync().then(function(){
10.  
    cc.director.loadScene(launchScene, null, function () {
11.  
    cc.view.setDesignResolutionSize(1080, 1920, 1);
12.  
    console.log("Success to load scene: ".concat(launchScene));
13.  
    });
14.  
    });
15.  
    });
16.  
    });
17.  
    }

4.增加fbapp-config.json，以下配置只是随意的示例，具体请参考官方说明

Json配置官方说明

1.  
   {
2.  
   "instant_games":{
3.  
   "platform_version" : "RICH_GAMEPLAY",
4.  
   "orientation": "PORTRAIT",
5.  
   "override_web_orientation": "PORTRAIT",
6.  
   "navigation_menu_version": "NAV_FLOATING"
7.  
   }
8.  
   }

Facebook本地测试环境搭建：

Cocos官方文档

FB官方文档

搭建测试环境时遇到一个问题，cert.pem的文件在windows上生成失败，本人在Linux上生成的

广告接入参考资料：

激励视频与插屏广告接入示例

banner接口

本地测试测试环境中遇到广告看不到的情况，先在FB后台发布测试环境，手机上看到广告后本地测试就能正常看到广告了。

这篇好文章是转载于：学新通技术网