相关疑难解决方法(0)

我没有找到这个问题的解决方案，但我已经尝试了各种解决方案，但没有任何效果。我有一个 React JS 应用程序，当部署在测试服务器上并且您在页面上点击刷新时，我收到 404 错误消息。我尝试过 URL 重写，这有助于导航回主页，但这并不能解决刷新问题。请帮忙。

有一些关于 SO 的主题，比如这个建议更改 Webpack，而这个建议设置一个包罗万象的。

我正在使用react-router-dom三个路线；类似的故事，对这里剩余的问题，在/道路工程，但没有/cars或/about不会。

import React, {Component} from 'react';
import {render} from 'react-dom';
import {BrowserRouter, Route, Switch, Link} from 'react-router-dom';


const Home = () => (
  <h1>Home</h1>
)

const Car = () => (
  <h1>Cars</h1>
)

const About = () => (
  <h1>About</h1>
)

render(
  <BrowserRouter>
    <Switch>
      <Route exact path="/" component={Home}/>
      <Route exact path="/cars" component={Car}/>
      <Route path="/about" component={About}/>
    </Switch>
  </BrowserRouter>,
  document.getElementById('container')
);

我试过在我的 webpack 配置中添加一个 …

我在webpack-dev-server上运行了我的单页应用程序.我可以加载和重新加载我的进入路线localhost:8080,它每次都有效.但是,我localhost:8080/accounts/login只能通过应用程序内的链接加载localhost:8080/accounts/login,即每当我从浏览器刷新按钮重新加载我得到

Cannot GET /accounts/login/

作为服务器响应,我得到了控制台

内容安全策略:页面的设置阻止了自身加载资源("default-src http:// localhost:8080 ").来源:;(函数installGlobalHook(window){....

这是我在单页应用的index.html上的CSP标题

<meta http-equiv="Content-Security-Policy"
  content="default-src * 'self' 'unsafe-inline' 'unsafe-eval'">

我也没有使用任何devtool我的webpack.config.json.我错过了什么.

我在以下课程中有以下路线：

import { Router, Route } from 'react-router-dom';

class App extends React.Component {
    constructor(props) {
        super(props); 
    }

    render() {
        const { alert } = this.props;

        return (
            <Router history={history}>
                <div>                                  
                    <Route path="/login" component={LoginPage} />
                    <Route path="/administrate" component={AdministratePage} />     
                    <Route exact path='/' component={LoginPage} />   
                </div>
            </Router>
        );
    }
}

对于http：// localhost：12345 /，登录组件正确显示。

但是，当我在浏览器中输入http：// localhost：12345 / login或http：// localhost：12345 / administrate时，我得到的是404。

在导航器中输入“ http：// localhost：12345 / administrate ”会显示404，但如果我输入：

this.props.history.push('/administrate');

在Login组件的render方法中，它会正确重定向，显示administrate组件。

怎么来的？我的F12控制台没有错误。非常感谢你。

我的webpack.config.js：

   module.exports = {
   devServer: {
        historyApiFallback: …

在http:// localhost/about页面刷新时未找到代码报告404 .但是如果将browserHistory更改为hashHistory,它可以正常工作.

这是我的js文件.

import React, {Component} from 'react';
import ReactDOM from 'react-dom';
import { Router, Route, IndexRoute, Link, IndexLink, browserHistory, hashHistory } from 'react-router';
import $ from 'jquery';

class App extends Component {
  render() {
    return (
      <div>
        <h1>APP!</h1>
        <Link to="/about">/about</Link>
        {this.props.children}
      </div>
    )
  }
}

class About extends React.Component {
  render() {
    return (
      <div>
        <h2>About 33</h2>
      </div>
    )
  }
}

var routes = (
    <Router history={hashHistory}>
        <Route path="/" component={App} />
        <Route path="/about" component={About} />
        <Route …

我正在使用从https://github.com/facebookincubator/create-react-app创建的ReactJS SPA

我正在使用S3和Cloudfront来为我的网站服务.一切正常,直到我重新加载页面 - 它会抛出一个错误(在我的情况下拒绝访问),因为没有Hashbang它无法处理.

注意:如果我输入带有hashbang的URL,它可以正常工作

基本上,这可行:https://example.com/#/dashboard(重定向到https://example.com/dashboard)

但是,如果我刷新页面,它会出现如下错误:

我们使用browserHistory来维护路由.我只显示相关代码:

<Router history={browserHistory}>
<Route path='/dashboard' component={Dashboardpage} />
</Router>

我正在学习 React。我有 4 个子页面的页面，我使用 React Router 浏览这些页面。除了重新加载页面外，一切正常。当我从页面“主页”转到“关于”或其他页面时，它可以，但是当我刷新页面时，它会再次呈现“关于”页面一秒钟，然后将页面更改为主页（主页是默认页面/第一页）。希望它停留在当前呈现的页面上，而不是每次刷新后返回主页。在 index.js 文件中有我的代码，我在其中渲染整个应用程序并使用路由器：

<Provider store={store}>
    <Router path="/" history={browserHistory}>
        <Route path="/home" component={App}> 
            <Route path="/" component={Home}/>
            <Route path="/allhotels" component={AllHotels}/>
            <Route path="/addhotel" component={AddHotel} />
            <Route path="/about" component={About} />
        </Route>
        <Route path="/signin" component={SignIn} />
        <Route path="/signup" component={SignUp} />
    </Router>
</Provider>, document.getElementById('root')

在“应用程序”中，我有导航，在那里我呈现来自 Home、AllHotels 等的其余内容。

有来自 App.jsx 的代码

class App extends Component {

render() {
    return (
        <div className="app-comp">
            <Navigation />
            <div> {this.props.children}</div>
        </div>
    )
  }
}

我还附上了显示我的问题的 gif。

https://gifyu.com/image/boMp

在后端，如果重要的话，我会使用 Firebase。

提前致谢。

我有一个部署到Azure的Node应用程序，其中一个测试分支通向一个临时实例，一个master分支指向prod部署。我的应用程序在本地应用程序的所有实例上都能正常工作，但是生产和暂存存在以下问题：如果它们已经被缓存，则无法加载，并且在刷新后将显示为空白，最后在重置缓存后可以正常工作。

每当我在生产环境中刷新页面时，它都是空白。服务工作者正在运行（我可以在chrome serviceworkers-internal工具中看到它），但是该页面从未加载。生成的文件引用正确。您可以在此处看到发生了什么事的示例：Live Site，然后还可以看到测试站点，该站点也因部署了完全相同的代码而失败：Test Site。

整个ServiceWorker实现都是开箱即用的create-react-app。我花了几个小时试图在react-boilerplate和create-react-app存储库下的各种GitHub问题中跟踪此错误，但除了限制页面缓存外，它们都没有真正发挥作用，而我尝试这样做毫无用处与：

Index.html

<meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate"/>
<meta http-equiv="Pragma" content="no-cache"/>
<meta http-equiv="Expires" content="0"/>

您可以在托管所有这些代码的存储库中找到对任何代码有疑问的任何代码。

我只是想用React / Node弄湿我的脚，所以我陷入困境，在不完全取消ServiceWorker注册的情况下，真不知道如何解决这个问题。

编辑：我从index.js文件中完全删除了ServiceWorker代码，现在重新加载视域而没有任何问题。我需要完成一个步骤来使ServiceWorker从缓存或其他内容正确地重新加载页面吗？

我用react-router-dom我的路由和，因为我还使用GitHub的页面，我需要用HashRouter我的Router.jsx，像这样

import React from 'react';
import { HashRouter as Router, Route, Switch } from 'react-router-dom';

import Home from './Home';
import Customer from './Customer';

const MyRouter = () => (
  <Router>
    <Switch>
      <Route path="/customer" component={Customer} />
      <Route path="/" component={Home} />
    </Switch>
  </Router>
);

export default MyRouter;

在我的Home.jsx组件中，我像这样定义了 propTypes

Homepage.propTypes = {
  history: PropTypes.shape({ // set by react-router
    push: PropTypes.func.isRequired,
  }).isRequired,
};

我的问题是，每次我#在我的 URL 中得到 a时，我想知道为什么它一直在那里，为什么我的本地主机没有#将我重定向到相同的 URL 但有#（就像我去 …

我使用create-react-app创建了一个React应用。我正在尝试将其部署在Azure Web应用程序上。我创建了一个构建并使用FTP进行了部署。

当从应用程序进行内部重定向时，我可以看到该网页。但是，当我尝试直接转到URL时，出现此错误。

例如：

如果基本网址是www.example.com，并且应用在内部重定向到/ new，则页面转到www.example.com/new。但是，如果我直接尝试加载www.example.com/new，则会收到上面显示的响应。在本地测试中不会发生这种情况

演示： 我在这里创建了一个演示