Question

我正在尝试为Angular2应用实施Google登录。我运行以下命令。

npm i angular-google-signin

我在 node_modules 中找到了 angular-google-signin 文件夹。在index.html中添加了以下脚本。

<script defer src="https://apis.google.com/js/platform.js"></script>

你可以在下面找到我的代码：

app.module.ts

import { NgModule } from '@angular/core';
import { BrowserModule } from '@angular/platform-browser';
import { AppComponent } from './app.component';
import { FormsModule } from '@angular/forms';
import { HttpModule, Headers } from '@angular/http';
import { GoogleSignInComponent } from 'angular-google-signin';

@NgModule({
    imports: [BrowserModule, FormsModule, HttpModule],
    declarations: [AppComponent, GoogleSignInComponent],
    providers: [],
    bootstrap: [AppComponent]
})
export class AppModule { }

app.component.ts

import { Component } from '@angular/core';
import { GoogleSignInSuccess } from 'angular-google-signin';

@Component({
    selector: 'my-app',
    template: `
        <google-signin
         [clientId]="myClientId"
         [width]="myWidth"
         [theme]="myTheme"
         [scope]="myScope"
         [longTitle]="myLongTitle"
         (googleSignInSuccess)="onGoogleSignInSuccess($event)">
        </google-signin>
        <urls></urls>`,
    providers: [GoogleSignInSuccess]
})

export class AppComponent {
    private myClientId: string = 'my-client-id';

    onGoogleSignInSuccess(event: GoogleSignInSuccess) {
        let googleUser: gapi.auth2.GoogleUser = event.googleUser;
        let id: string = googleUser.getId();
        let profile: gapi.auth2.BasicProfile = googleUser.getBasicProfile();
        console.log('ID: ' +
            profile
                .getId()); // Do not send to your backend! Use an ID token instead.
        console.log('Name: ' + profile.getName());
    }
}

的index.html

<!DOCTYPE html>
<html>
<head>
    <title></title>
    <meta charset="utf-8" />
    <script src="node_modules/typescript/lib/typescript.js"></script>
    <script src="node_modules/core-js/client/shim.min.js"></script>
    <script src="node_modules/zone.js/dist/zone.js"></script>
    <script src="node_modules/systemjs/dist/system.src.js"></script>
    <script src="systemjs.config.js"></script>
    <script defer src="https://apis.google.com/js/platform.js"></script>
    <script>
        System.config({
            packages: {
                app: {
                    format: 'register',
                    defaultExtension: 'js'
                }
            }
        });

        System.import('app/boot').then(null, console.error.bind(console));       
    </script>
</head>
<body>
    <my-app>Loading...</my-app>
</body>
</html>

我没有收到任何编译错误。当我运行该网站时，我收到404错误说：

“（SystemJS）XHR错误（未找到404）加载http://localhost:3000/angular-google-signin” 。

见下图。

任何人都可以帮助我。

angular-google-signin模块投掷404

0 个答案: