Question

我正在为React应用创建google auth，刷新页面时收到错误消息，

我正在尝试将auth连接到redux，并尝试将当前用户保存在redux中，但出现以下错误消息

身份验证组件文件

class GoogleAuth extends Component {
    componentDidMount(){
            window.gapi.load('client:auth2', () => {
                window.gapi.client.init({
                    clientId:
                    'clientID',
                    scope: 'email'
                 })
                .then(() => {
                    this.auth = window.gapi.auth2.getAuthInstance();
                    this.onAuthChange(this.auth.isSignedIn.get())
                    this.auth.isSignedIn.listen(this.onAuthChange)
                });
            });
    }    
    onAuthChange = (isSignedIn) => {
        (isSignedIn) ? this.props.signIn() : this.props.signOut()
    }
    onSignIn = () => {
        this.auth.signIn(this.auth.currentUser.get().getId());
    }
    onSignOut = () => {
        this.auth.signOut();
    }
    renderButton(){
        if(this.props.isSignedIn === null){
            return <button>I dont know if we are signed in </button>
        }else if(this.props.isSignedIn) {
            return <button onClick={this.onSignOut}>yes signed in </button>
        }else{
            return <button onClick={this.onSignIn}>I am not signed in </button>
        }
    }
    render() {
        return (
            <div>
              {
                 this.renderButton()
                  }
            </div>
        )
    }
}
const mapStateToProps = state =>{
    return {
        isSignedIn:state.auth.isSignedIn
    }
}
export default connect(mapStateToProps, {signIn, signOut})(GoogleAuth)

减速器文件

const INITIAL_STATE = {
    isSignedIn: null,
    userId:null
}
export default (state= INITIAL_STATE, action) =>{
        switch(action.type){
            case SIGN_IN:
            return{
                ...state, isSignedIn :true, userId:action.payload
            }
            case SIGN_OUT:
                return{
                    ...state, isSignedIn :false, userId:null
                }
            default : return state
        }
}

错误消息

GoogleAuth.componentDidMount src / components / GoogleAuth.js：6 3 |   从'../actions'导入{signIn，signOut} 4 | GoogleAuth类   扩展组件{5 | componentDidMount（）{


6 | window.gapi.load（'client：auth2'，（）=> {7 | window.gapi.client.init（{8 | clientId：9 |
    '688799122512-ddmmitrg4fgcr38lo81l99snpjbbnvbo.apps.googleusercontent.com'，     查看已编译的视图▶17个堆栈框架被折叠。模块../src/index.js     src / index.js：12 9 | 10 | const store = createStore（reducers）
    11 |     12 | ReactDOM.render（，document.getElementById（'root'））; 13 | 14 | //如果您想要     应用程序可以离线工作并且加载速度更快，您可以更改15 | //     unregister（）到下面的register（）。请注意，这有一些陷阱。

如果有人知道，请告诉我

react / redux应用程序中的google auth配置问题

0 个答案: