将Firebase 2.x迁移到3.4.1 AngularJS适用于Google OAuth

时间:2016-10-11 07:00:52

标签: angularjs ionic-framework firebase google-oauth firebase-authentication

我是Angular&火力地堡。我目前正在开发一款Ionic应用程序。不知怎的,我开​​始知道,要使用Firebase,我需要设置身份验证系统(我更喜欢Google)。

将代码集成到官方Firebase网站中提到的AngularJS并不容易。所以我只是拿起某人的工作代码并将他的Firebase数据库URL替换为我的,我可以完成它。但这是一个错误。

这是未更改的代码及其输出(按预期工作)。

的index.html

const void* DetourFunc(BYTE* const src, const BYTE* dest, const DWORD length)
{
    BYTE* jump = new BYTE[length + 5];
    for (int i = 0; i < sizeof(detourBuffer) / sizeof(void*); ++i)
    {
        if (!detourBuffer[i])
        {
            detourBuffer[i] = jump;
            break;
        }
    }

    DWORD dwVirtualProtectBackup;
    VirtualProtect(src, length, PAGE_READWRITE, &dwVirtualProtectBackup);

    memcpy(jump, src, length);
    jump += length;

    jump[0] = 0xE9;
    *(DWORD*)(jump + 1) = (DWORD)(src + length - jump) - 5;

    src[0] = 0xE9;
    *(DWORD*)(src + 1) = (DWORD)(dest - src) - 5;

    VirtualProtect(src, length, dwVirtualProtectBackup, &dwVirtualProtectBackup);

    return jump - length;
}

app.js

<script src="lib/angularfire/dist/angularfire.min.js"></script>
<script src="lib/firebase/firebase.js"></script>

<!-- cordova script (this will be a 404 during development) -->
<script src="cordova.js"></script>

<!-- your app's js -->
<script src="js/app.js"></script>
<script src="js/controllers.js"></script>
<script src="js/services.js"></script>

首先,我删除了他的Firebase网址以添加我的并收到此错误:

  

我们检测到您正在将v2.x或更低版本的身份验证SDK与在console.firebase.google.com上创建的项目一起使用。您必须将3.0.0或更高版本的身份验证SDK与在新控制台中创建的项目一起使用。

然后我将angular.module('starter', ['ionic', 'starter.controllers', 'starter.services', 'firebase']) .constant('FirebaseUrl', 'https://ionicle.firebaseio.com/') .service('rootRef', ['FirebaseUrl', Firebase]) 文件更新为3.4.1版本。然后我在浏览器的开发控制台中收到了一个Reference错误: ReferenceError:Firebase未定义

firebase.js

所以我最终需要的是使用Firebase 3.x和AngularJS的Google OAuth。

1 个答案:

答案 0 :(得分:0)

虽然您没有提供足够的代码示例(依赖注入是不够的),但我认为您遇到的主要问题是您使用新的Firebase版本的旧代码示例。

这样的事情:

<div class="container">
<section id="preceding">
  <h2>Content</h2>
  <p>Additional content goes here. The goal is that the striped element below should conform to the size of this element responsively without changing angle or thickness.</p>
</section>
<section id="striped">
  <h2>Heading</h2>
  <div>
    <h3>
    Block o' Content
    </h3>
  </div>
  <div>
    <h3>
    Block o' Content
    </h3>
  </div>
  <div>
    <h3>
    Block o' Content
    </h3>
  </div>
  <div>
    <h3>
    Block o' Content
    </h3>
  </div>
</section>
<section id="further">
  <h1>
  More stuff to follow!
  </h1>
</section>
</div>

改为:

var app = angular.module('app', ['firebase']);
app.controller('Ctrl', function($scope, $firebaseAuth) {
    var ref = new Firebase('https://...');
    $scope.authObj = $firebaseAuth(ref);
    ...
});

然后在 authObj 上,您可以为要用于身份验证的客户端添加提供商(Google / GitHub / Facebook ...):

var app = angular.module('app', ['firebase']);
app.controller('Ctrl', function($scope, $firebaseAuth) {

    var config = {
        apiKey: "***",
        authDomain: "***.firebaseapp.com",
        databaseURL: "https://***.firebaseio.com",
        storageBucket: "***.appspot.com",
        messagingSenderId: "***"
    };
    firebase.initializeApp(config);

    $scope.authObj = $firebaseAuth(firebase.auth());
    ...
});

请注意,您必须在Firebase控制台中启用Google(或任何其他提供商)身份验证。有关详细说明,请查看link