1回答
我正在使用Firebase和下一个JS的are应用程序，您必须登录才能访问任何其他页面(所有路由都是受保护的)。我首先做的是在_app.js中设置一个提供程序，以便我可以访问用户的状态(登录或未登录)。然后，当请求一个受保护的页面时，我检查用户状态，并在需要时重定向到登录页面，如下所示： import Users from "../components/users/Users";
import Layout from "../components/general/Layout";
import { useEffect, useContext } from &
浏览 21提问于2021-09-10得票数 0
回答已采纳
我正在尝试为我的应用程序构建一个仪表板视图，我正在使用redux来管理身份验证。因此，如果用户未通过身份验证，我希望将他们重定向到登录，否则重定向到主页。 我有一个CustomLayout和一个主页组件，登录组件，注册组件。 首先处理从app.js到routes.js的路由 这是我的App.js import React, { Component } from "react";
import { BrowserRouter as Router } from "react-router-dom";
import { connect } from "rea
浏览 12提问于2020-04-18得票数 0
我正在使用React Redux为我的Express API构建一个用户界面，我想知道如何处理通过身份验证和未经身份验证的用户。有两个应用程序组件是一个好主意，一个用于经过身份验证和未经身份验证的用户-如果JWT在用户登录后成功调度到redux状态，这两个组件将有条件地呈现在主组件(app.js)中。这是处理问题的好方法还是坏方法？
浏览 12提问于2020-10-11得票数 0
我创建了一个包含3个主要组件/页面的简单项目。
主页(路径："/")带有is登录页。一旦我们点击登录按钮，就会创建一个动态URL“admin/random_ LogIn.js”
import { Link, Route } from "react-router-dom";
import Dashboard from "../Admin/Dashboard";
export default function Login(props) {
return (
<div>
<h1>Login form&l
浏览 1提问于2021-05-17得票数 2
回答已采纳
2回答
我对此反应很新，在我的App.jsx中，我和国家有一个问题。我的反应路由器代码在App.js中，在默认页面(HomePage)登录后会加载。如果有用户在状态中加载，我希望在登录后读取状态，以呈现我的标题页面。我的问题是，App.jsx中的状态仍然是空的。
登录后，我的状态显示用户已被填充，但App.jsx始终为null。我尝试从道具和状态中提取" user“，并尝试将用户添加到mapState中。
以下是我在我的App.jsx中拥有的内容：
import React from "react";
import { Router, Route } from "rea
浏览 1提问于2019-08-17得票数 0
回答已采纳
2回答
我正在使用react-router在我的应用程序中的组件之间进行路由。如何在应用程序之外创建登录页面的路线？例如，用户登陆页面，LandingPage路由到应用程序，然后应用程序可以相应地路由导航栏中的组件/视图。
我遇到的问题是导航栏也一直填充在登录页面中。
以下是路由：
// React
var React = require("react");
var Router = require("react-router");
var Route = Router.Route;
var NotFoundRoute = Router.NotFoundRoute;
v
浏览 2提问于2015-06-28得票数 0
app.js
const [isLoggedIn, setIsLoggedIn] = useState(false);
useEffect(() => {
fetch('http://localhost:5000/usersystem/user/isloggedin', {
method: 'GET',
credentials: 'include',
mode: 'cors'
}).th
浏览 5提问于2021-02-26得票数 1
回答已采纳
当涉及到共同使用的ReactJS和Symfony2时，您能分享您的经验和最佳实践吗？通常如何检测登录或未在React组件中的用户?假设我们需要显示一个"Delete“按钮，或者在用户登录时向他/她问好。你有什么建议？在全局范围内存储用户证书？
const ExampleBox = React.createClass({
maybeSayHi: function () {
if (USER.IS_AUTHENTICATED_FULLY) {
return <div>Hi, user</div>;
浏览 3提问于2015-11-02得票数 0
我使用“React Context”将状态user传递给子组件。 问题:每次重新加载页面时，状态user的值都是空的。这会导致页面在重定向到'/dashboard`‘之前短暂地重定向到/login。这将防止用户手动访问页面。 目标:如何在渲染之前等待状态user？ App.js function App() {
const [user, setUser] = useState(null);
useEffect(() => {
firebase.auth().onAuthStateChanged((user) => {
if (user) set
浏览 30提问于2020-08-23得票数 1
回答已采纳
1回答
今天，我遇到了一个问题，在API验证用户的JWT令牌是否有效之前，react加载路由。当使用EJS时，我可以将中间件传递到路由，而中间件将不包含下一个()参数。因此，服务器不会呈现EJS，这正是我希望使用react实现的。另外，在导航特定路由时，是否可以使useNavigate不重新加载？
我目前在App.js中的路线如下所示：
<Route element={<ProtectedRoute access={access}></ProtectedRoute>}>
<Route
path="/login"
exact
浏览 2提问于2022-06-01得票数 4
回答已采纳
我正在使用Firebase和原生反应来验证用户。我的主文件是App.js，我将用户发送到登录组件，我有两个组件来管理路由。用于创建switchNavigator的Appnavigator.js和用于createDrawernavigator的DrawerNavigator.js。在身份验证之后，我希望将用户发送到一个内部组件(Admin)。 以下是特定页面的代码， Login.js export default class Login extends React.Component {
state = {
email:"",
password: "
浏览 17提问于2020-03-04得票数 0
回答已采纳
我试图在Reactjs中创建登录功能，如果用户没有登录，我希望用户被重定向到健康页面。
Login.jsx
import './Login.css';
import { PropTypes } from 'prop-types';
import React, { useState } from 'react';
import { useHistory } from 'react-router-dom';
const Login = (props) => {
let history = useHistory();
c
浏览 2提问于2021-09-11得票数 1
在我的react本地App.js文件中
我想控制用户的登录状态。由于我使用react native async storage将用户登录状态保存在本地存储中，因此我希望根据该值更改初始屏幕。
在app.js useEffect钩子中，我有类似这样的东西
const [initialRoute, setInitialRoute] = useState('AuthChoice');
useEffect(() => {
async function getStorageValue() {
let value;
try {
v
浏览 0提问于2021-10-12得票数 0
我正在学习redux，并想知道在下面从redux获取的截图中，动作创建者是如何传递调度的。
学习应用程序代码可在这里获得：
按照课程讲师的要求，下面的mapDispatchToProps代码使用user.action.js更新标头组件状态。即使在阅读了redux文档之后，我也无法理解这一切是如何工作的。
const mapDispatchToProps = dispatch => ({
setCurrentUser: user => dispatch(setCurrentUser(user))
});
头组件中的currentUser的初始状态是使用redux文件夹中的us
浏览 3提问于2020-10-15得票数 0
回答已采纳
基本上，我是理解别人的代码和修改。在App.js中，如果用户登录，则必须呈现仪表板。
App.js
<Switch>
<Redirect exact path="/" to="/dashboard"/>
<Route path="/login" component={GuestBoard} />
<EnsureSignedIn>
<Switch>
<Ro
浏览 0提问于2018-05-31得票数 0
回答已采纳
当我在登录后打开和关闭应用程序时，我希望再次打开同一个页面，这样用户就不会再次登录。除非用户注销，否则在打开应用程序时不要打开登录页。我要他在我退出时打开登录页面。当我不结账/回家时，我想打开。
index.js
import {AppRegistry} from 'react-native';
import App from './App';
import {name as appName} from './app.json';
AppRegistry.registerComponent('ReactNativeAuth',
浏览 5提问于2019-10-25得票数 0
回答已采纳
4回答
我正在尝试使用react创建一个登录流。路线按预期运行。但是当我尝试介绍导航条时，它在所有路线上都是可见的。我想显示导航条只在选定的组件(仅在配置文件和回家路线)。
如有任何建议，将不胜感激。
这是Routes.js：
export default class Routes extends Component {
render() {
return (
<Switch>
<Route
exact
path='/*/home'
component={Home}
浏览 0提问于2018-11-01得票数 5
回答已采纳
2回答
简要说明 因此，我想要实现的是:在确认用户的电子邮件地址和密码正确之后，登录状态必须从false更新为true。但是，登录实例是在我App.js中设置的，登录确认是在我的Login.js中设置的。 代码 在我的App.js中，我有以下代码： <UserProvider value={{
loggedIn: this.state.loggedIn,
actions: {
logIn: event => {
this.setState({ loggedIn: true })
}
}
}}>
浏览 11提问于2019-01-13得票数 1
回答已采纳
1回答
如果用户没有登录，我想导航到签名页面。但是，如果用户是登录，那么它将自动导航到主页，但我不能导航到登录页面时，用户没有登录。我正在粘贴下面的代码。如果可以的话请帮帮我。
这是我的App.js代码
import React from "react";
import { BrowserRouter, Routes, Route } from "react-router-dom";
import "./App.css";
import { Home } from "./containers/Home";
浏览 6提问于2022-11-21得票数 1
1回答
我有一份反应申请。如果用户在未经过身份验证的情况下，我将显示任何路径的登录组件。以下是代码：
function App() {
userDetails = getUserDetails();
return (
<React.Fragment>
<Router>
{ userDetails !== '' ?
(
<MyComponent />
) : (
<Login />
浏览 6提问于2022-01-25得票数 0
Hiii，我的问题是，假设我有一个登录页面，用户可以在登录页面和注册页面之间切换，但我想要的是，当用户登录或在注册页面中创建新帐户时，所有历史记录都将被删除。或者，如果这是不可能的，什么是最好的方法来处理这些情况，以避免用户已经登录，然后当他点击后退按钮时，他将发现自己再次在两个页面之一(登录或注销)。我当前使用的是React路由器v4。如果有人能帮助我，并给我这方面的最佳实践，那就太好了。谢谢。 <BrowserRouter>
<Switch>
<Route path="/" component={SignI
浏览 9提问于2019-01-05得票数 3
1回答
我正在做一个应用程序的认证，我有点卡住了。我有两种不同的导航方式。一个显示用户是否已登录，另一个显示未登录。基本上是屏幕上的标志。如果我在开始时手动更改该值，它就能正常工作。但是，例如，当用户登录时，我无法找到改变状态的方法。即使auth模块中的值发生了变化，它也不会在App.js中更新，所以我如何从屏幕上的登录更新App.js的状态呢？
import React, { Component } from 'react';
import { AppRegistry, Platform, StyleSheet, Text, View } from 'react-native
浏览 3提问于2019-03-04得票数 2
回答已采纳
我是localStorage的新手，我的目标是:当用户登录时，将他重定向到"/dashboard“，当他被注销时，重定向回'/home‘。当然，如果他没有登录，当然也不允许他去“仪表板”。由于某些原因，我在App.js中的代码无法工作：
function App() {
let userLogged;
useEffect(() => {
function checkUserData() {
userLogged = localStorage.getItem("userLogged");
}
window.ad
浏览 6提问于2022-06-01得票数 2
回答已采纳
我正试图在我的App.js中添加一个脚注。我已经将导航添加到App.js文件中。我想把页脚添加到每一页，而不是将它添加到每一页的底部。
App.js文件
import React from "react";
import { BrowserRouter as Router, Route, Switch } from "react-router-dom";
import "./App.css";
import DocumentTitle from "react-document-title";
import Home from &#
浏览 3提问于2020-07-06得票数 1
1回答
我已经使用passport.js在我的React中构建了授权，我想在我的App.js文件中获取我的授权路径，以查看用户是否登录到应用程序中，或者是否没有人登录。
为了帮助解决这个问题，我共享了React的App.js文件和Index.js文件的精简版本。
// App.js File
// Import React Libraries, Routes, Container Pages
import React, { Component } from 'react';
import { connect } from 'react-redux';
import {
浏览 1提问于2019-04-01得票数 0
登录时，重定向比从onAuthStateChanged()更新状态更快。你是如何处理这种行为的？ // firebase/index.js
import React, { createContext } from 'react'
import * as firebase from "firebase/app";
import "firebase/firestore";
import "firebase/auth";
const firebaseConfig = {
apiKey: process.env.REACT_A
浏览 18提问于2020-06-14得票数 0
回答已采纳
我在我的应用程序中使用Firebase认证和redux。我将firebase.auth().onAuthStateChanged添加到App.js的componentDidMount函数中，以检查整个应用程序的用户登录状态。我尝试将App.js连接到redux操作的getUserProfile函数，如下所示：
App.js
import React from 'react';
import { createStackNavigator, createAppContainer } from 'react-navigation';
import { Provider
浏览 0提问于2019-03-24得票数 1
我已经创建了一个带有标头和简单授权的简单react.js，所以如果用户已经登录(用户对象设置在本地存储中)-导航栏显示，如果没有-导航栏隐藏。THe代码如下： #App.js
import React from 'react';
import { connect } from 'react-redux';
import LoginPage from "./components/loginPage/loginPage";
import MainPage from "./components/dashboard/mainPage";
浏览 37提问于2020-03-25得票数 1
我怎样才能阻止用户登录到登录页面，我已经设法迫使用户在访问主页之前登录，但是我有一个问题，即使他/她已经登录，用户仍然可以设法登录页面，
Protected.jsx
import React from 'react'
import {Outlet, Navigate} from 'react-router-dom'
import { useSelector } from 'react-redux'
const Protected = ({children, ...rest}) => {
const item = JSON.parse(
浏览 4提问于2022-10-12得票数 1
我有两个文件，一个App.js，我在其中设置了React导航StackNavigator和我的firebase实例，还有一个Login.js，我在那里登录用户。
我试图检测用户是否已经登录(通过防火墙持久登录)，但由于某种原因，在Login.js的componentDidMount()中没有检测到我的防火墙实例。这对我来说没有任何意义，因为在我的Login.js的其他地方，我在防火墙实例上调用fxns，就像在Google上登录一样。
我应该如何安排防火墙初始化/ auth检查，以确保在持久化auth检查的同时正确地检测到了firebase实例？
我已经看过这个了，但是这个人似乎有一个不同的问题
浏览 2提问于2018-05-03得票数 0
回答已采纳
1回答
我正在尝试使用碳设计的组件。我遵循这个安装所有库、依赖项等。
下面是我的代码：
import {UIShell} from 'carbon-components-react';
import React from 'react';
import logo from './logo.svg';
import './App.css';
function App() {
return (
<div className="App">
<header className="App-head
浏览 0提问于2019-05-28得票数 0
我希望应用程序检查是否有一个用户登录(防火墙身份验证)。如果存在，请导航到一个页面(isn导航v5)，如果没有，导航到另一个页面。
我有以下代码：
在App.js中
//import navigation + screens
const Stack = createStackNavigator();
const MaterialBottomTabs = createMaterialBottomTabNavigator();
class App extends React.Component {
AuthStack = () => {
<Stack.Navi
浏览 1提问于2020-12-30得票数 2
回答已采纳
我开始学习React.js了。因此，我编写了登录表单，我们将在用户访问页面时显示该表单，主页将显示用户成功登录的时间。
基本上，我的项目结构是：
node_modules
公共的
钢筋混凝土
组件
Login.jsx
- App.js
- index.js
守则如下：
index.js
import React from 'react';
import ReactDOM from 'react-dom';
import App from './App';
import { BrowserRouter
浏览 2提问于2017-09-13得票数 0
回答已采纳
在我正在开发的React应用程序中，我遇到了一个问题。当用户登录时，它存储有关用户的信息，如他们的姓名和角色。我们使用它来显示用户的名字，并且很明显地使用他们的角色来显示或隐藏组件。 我很难弄清楚的问题是，如果用户的名字改变了，或者他们的角色在登录时改变了，信息就不会更新。现在我可以在每次用户编辑他们自己的配置文件时刷新数据，但是如果管理员用户编辑登录的用户名或角色怎么办？它在下次登录之前不会更新。 我考虑过使用withRouter，执行history.listen，并在加载到基本App.js上的每个页面上更新用户信息。我看到的问题是，它经常被调用两次，先是REPLACE，然后是PUSH，所
浏览 18提问于2019-01-15得票数 0
回答已采纳
1回答
在我的应用中，如果用户转到
http://localhost:3000/#/auth
默认情况下，页面中的登录将呈现。
当用户转到注册页面时，url是
http://localhost:3000/#/auth?form=signup
但是，每当我刷新页面时，url就会自动返回到
http://localhost:3000/#/auth
用户现在看到了登录页面。
有办法在刷新后保留url查询吗？换句话说，如果用户在注册页面上并刷新，我希望呈现注册页面，而不是登录页面。
我正在使用react-router@3和hashHistory。这是路线
<Route path="/auth&#
浏览 1提问于2017-06-14得票数 1
回答已采纳
2回答
我正在用Reactjs创建一个应用程序。我有app.js，dashboard.js和login.js。
在我的app.js中，我有一个登录页面的链接。我想从登录页面跳转到仪表板页面。在我的登录中，我正在调用后端服务并验证用户凭据。我在login.js中有以下代码
request.post(
options,
function (error, response, body) {
if (!error && response.statusCode === 200) {
console.l
浏览 2提问于2017-10-11得票数 0
1回答
认知/瓶/反应:如何登录后端？
、、、、
我的web应用程序在前端使用，在后端使用。
我想为用户管理添加。根据，这只需要在前端包装export语句，即更改行
export default App;
在App.js文件(定义主应用程序React组件)中
export default withAuthenticator(App, true);
加上添加所需的import语句。
这个小小的改变让我得到了生产中使用的任何合理的web应用程序所需要的以用户为中心的所有功能。
用户注册
电子邮件验证
登录/注销
遗忘密码
等. pp
包括
主题用户界面
电子邮件发送服务
联合登录(如Google、Faceb
浏览 0提问于2018-12-13得票数 5
回答已采纳
我使用了一个react应用程序，并且已经完成了登录和注册表单，并且在app.js中有私有路径。每个人都有登录和注册的权限。其余的页面都受到保护。我有登陆注册页面，使用css中的HTML标记呈现背景图像，但我无法让它切换到另一个组件中的另一个图像。此外，我不希望导航栏显示在登录和注册页面。
<main>
<Switch>
<PrivateRoute path="/user/home" component={Home} />
<PrivateRoute path="
浏览 2提问于2021-12-05得票数 1
1回答
在我react应用程序中，我有登录页面和仪表板。我想要显示用户名，从登录页面获取到仪表板使用上下文API。 以下是我的App.js代码： import React from 'react';
import {
BrowserRouter as Router,
Route
} from 'react-router-dom';
import Dashboard from './Dashboard';
import Login from './Login'
import {UserContextProvider} from
浏览 8提问于2021-01-17得票数 1
回答已采纳
我无法在我的app.js中设置上下文状态，我在其中得到了一些空值，但是可以在子组件中访问它。
每当用户访问页面时，我都希望在app.js中设置上下文状态，以便我可以在整个应用程序中使用它，例如，根据用户是否登录显示不同的标题。
请求的SandBox URL ->
我在跟踪
app.js
// import installed dependencies
import React, { useEffect, useContext } from 'react';
import { BrowserRouter as Router, Switch, Route } from &
浏览 3提问于2020-06-30得票数 2
1回答
我有一个react.Component，它有一个供用户登录的表单。 如何将应用程序重定向到成功登录的新页面？ import React from "react";
import {
Link
} from "react-router-dom";
import { withRouter } from "react-router";
import {Header} from './layout/Header.js';
export class Signin extends React.Component {
constru
浏览 19提问于2021-01-22得票数 0
回答已采纳
我有一个登录页，其中包含一个标志。我正在尝试让这个徽标触发状态值的更改。这样做的目的是在单击时从登录页面更改为主页。我已经设置它，使登录页面在一个确定的时间清楚，但我想做这一点上点击。这是我的splash.js文件，其中包含单击功能以及徽标和登录页面：
import React, { Component } from 'react';
import Woods from './woods.jpeg';
import Logo1 from './whitestar.png';
export default class Splash extend
浏览 0提问于2017-06-01得票数 0
当运行"npm测试“时，我得到以下信息：
不变违反:无法在“连接(AddTodo)”上下文中找到“存储”。或者将根组件包装在连接选项中，或者将自定义的React提供程序和相应的React使用者(AddTodo)传递给连接选项。
我确信它来自组件/addTodo.js内部的行：
export default connect()(AddTodo);
但是，我不确定应该修改什么才能使测试在不破坏应用程序的情况下成功运行。
这是一个失败的测试，它在App.test.js中：
import React from 'react';
import ReactDOM from
浏览 3提问于2020-01-01得票数 0
回答已采纳
我遵循这个来实现嵌套路由。
以下是相关代码：
App.js
<PrivateRoute
exact
name="Home"
path="/home"
component={DefaultLayout}
/>
DefaultLayout.js
const Users = React.lazy(() => import("../../views/Users/Use
浏览 4提问于2020-02-18得票数 1
2回答
所以，当我尝试使用react-router-dom时，我有点困惑。如何在导航到新路径时替换以前的路径。因为代码太长，所以我会简化它。
例如，我们在http://localhost:3000/register的一个组件中，当用户按下按钮或使用useNavigate()逐步更改为http://localhost:3000/login的另一个组件时。当我编码和使用navigate时，它会出错，因为http://localhost:3000/register/login/没有匹配的路由。
App.js
import './App.css';
import Login from '
浏览 9提问于2022-08-01得票数 1
回答已采纳
3回答
我正在用React构建一个应用程序，我使用的是React路线。
我有三条主要路线：
如果用户已登录，请显示仪表板。
如果用户未登录，请显示SignIn页面。
如果用户单击ForgotPassword页面上的SignIn，请更改url并显示ForgotPassword页面。
index.js
ReactDOM.render(
<Provider store={store}>
<BrowserRouter>
<Suspense fallback={<div>Loading...</d
浏览 4提问于2021-08-02得票数 3
回答已采纳
我在我的应用程序中集成了redux。问题是它与其他组件一起工作得很好，但它在特定的一个组件上有问题。我得到了以下错误 ExceptionsManager.js:86 TypeError: _this.props.changeAlertedNetworkError is not a function
This error is located at:
in NetworkService (at App.js:21)
in Provider (at App.js:20)
in App (at renderApplication.js:40
浏览 10提问于2020-06-27得票数 0
回答已采纳
3回答
我有一个应用程序，用户可以像往常一样先登录。我的应用程序有几个屏幕，由react-native-navigation导航。
在除登录之外的每个屏幕上，我都需要知道哪个用户在使用我的应用程序，因为内容是由他/她的uniqueID专门指定的。当用户成功登录时，我得到了这个uniqueID，但我不知道如何将这个uniqueID传递给其他屏幕。
我是否需要使用Redux或context API来处理这个问题，或者是否有另一种方法可以在屏幕之间来回传递数据而不更改项目？
这是我的App.js：
import React, { Component, PropTypes } from 'react&
浏览 1提问于2019-04-19得票数 3
回答已采纳
1回答
我已经尝试实现，如下所示
在authorization.js中，将检查是否允许具有其角色的登录用户访问该页面：
import React from "react";
const Authorization = (WrappedComponent, allowedRoles) => {
return class WithAuthorization extends React.Component {
constructor(props) {
super(props);
this.state = {
user: {
浏览 17提问于2019-12-18得票数 0
2回答
我对此非常陌生，我试图编写一个应用程序，该应用程序将一个组合输出到页面的某个部分，并根据用户与该组合的交互，在DOM的其他部分的lightbox/模式中显示一些信息。
这要求我的两个呈现的组件具有某种共享状态，而我的理解是使用Redux实现这一点的最佳(或最好的)方法之一。然而，作为新的反应，现在添加了Redux的混合，我有点超出了我的深度。
我已经创建了一些动作创建者和还原器(目前非常愚蠢)，我最初要做的就是获取一些JSON并将它添加到我的商店中。但是，我无法从组件内部访问调度，而且我也不太清楚自己哪里出了问题。
如果我从组件中console.log this.props，就会得到一个空对象
浏览 4提问于2017-09-12得票数 1
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
