刷新后就报404,应该要怎么改?
工具换成 roadhog 。
@sorrycc
我用的最新版本的dva-cli创建的项目,本身就是用的roadhog,但还是有这个问题
roadhog 专门做了处理的,理论上不会有这个问题才对。package.json
贴出来看下?
@sorrycc
{
"private": true,
"scripts": {
"start": "roadhog server",
"build": "roadhog build",
"lint": "eslint --ext .js src test",
"precommit": "npm run lint"
},
"engines": {
"install-node": "6.9.2"
},
"dependencies": {
"animate.css": "^3.5.2",
"antd-mobile": "^0.9.14",
"babel-runtime": "^6.9.2",
"dva": "^1.2.1",
"moment": "latest",
"path-to-regexp": "latest",
"qs": "latest",
"rc-form": "^1.3.0",
"react": "^15.4.0",
"react-dom": "^15.4.0",
"weixin-js-sdk": "^1.2.0"
},
"devDependencies": {
"babel-eslint": "^7.1.1",
"babel-plugin-dva-hmr": "^0.3.2",
"babel-plugin-import": "^1.1.0",
"babel-plugin-transform-runtime": "^6.9.0",
"eslint": "^3.12.2",
"eslint-config-airbnb": "^13.0.0",
"eslint-plugin-import": "^2.2.0",
"eslint-plugin-jsx-a11y": "^2.2.3",
"eslint-plugin-react": "^6.8.0",
"expect": "^1.20.2",
"husky": "^0.12.0",
"redbox-react": "^1.3.2",
"roadhog": "^0.5.2"
}
}
package.json
看起来没问题。。你可以试试 dva-example-user-dashboard 有没有问题,没问题的话对比下差异点。
@sorrycc
试了一下,像 http://localhost:8000/users 这种路径可以随便刷新,但是如果路径是像 http://localhost:8000/users/users 这样多了一级的话,就只能通过Link跳转过去,直接请求就请求不到了。是我的写法不对还是什么原因?
看了一下chrome的调试界面 ,报的是 Uncaught SyntaxError: Unexpected token <
dva-example-user-dashboard 也有一样的问题
我试了下刷这个没有问题的。
@sorrycc
这个路径是可以刷新的,但如果把 /users 改为 /users/users 的话就不能刷新了,只能通过Link跳转
修改history就可以解决此问题,但是,URL中存在一个#的问题。
参考:https://github.com/dvajs/dva-knowledgemap#切换-history-为-browserhistory
browserHistory 时就不应该有 #
吧。
@sorrycc
以下是代码:
import dva from 'dva';
import 'antd/dist/antd.css';
import { useRouterHistory } from 'dva/router';
import { createHashHistory } from 'history';
import message from 'antd/lib/message';
// 1. Initialize
const app = dva({
history: useRouterHistory(createHashHistory)({ queryKey: false }),
onError: (e) => {
message.error(e.message);
}
});
在浏览器中输入 http://localhost:8000/
后,自动变成了
http://localhost:8000/#/
如果将#去掉,无法打开相应的路径。
我也尝试了,多级路由时 刷新浏览器地址栏:hashHistory可用,browserHistory不可用
(按需加载)
browserHistory 不可用是报 404 还是空白页,空白页的话检查下控制台,如果是 js 未载入的话,应该是 publicPath 没配对。
使用browserHistory 时,将html的js引入方式改为从根下引入。
如下:
<script src="/index.js"></script>
@sorrycc 可以关了这个问题了
@kairi1227
感谢,确实是这个问题
@kairi1227 感谢~ 从根引入,已解决
实话说,不如自己花时间搭一个react+redux的环境
我搭建了一个dva的初始化项目。
开发时,可以将html引资源时,修改为 /
打包后,将其修改为 ./
这里面解决了如何使用publicPath的问题,以及APP高清的问题。有兴趣的可以了解一下。
我也遇到这个问题,二级域名时,用Link跳转可以,刷新不可以。
我使用上面的方式,也在js文件加了 '/',但还是无效。
是不是我路由写法有问题呢?
<Route path="/" component={ CreateRelevance }>
<Route path="bg/create" component={ CreateRelevance } />
</Route>
</Router>
@sorrycc
@sorrycc
这个问题已解决。
browserHistory模式下,因为是spa模式;
需nginx配置: try_files $uri $uri/ /index.html;
@18559909452 如果服务器是apache而非nginx,该怎么配置?
没看到koa相关的配置方式,贴一下供参考:
const fs = require('fs');
const router = require('koa-router')();
router.get('/*', async (ctx) => {
const html = fs.readFileSync(path.resolve(filePath));
ctx.type = 'html';
ctx.body = html;
})
...
Most helpful comment
使用browserHistory 时,将html的js引入方式改为从根下引入。
如下:
<script src="/index.js"></script>
@sorrycc 可以关了这个问题了