如何克服'#'，通过 Ionic 2 中的深度链接进入 URL？

我试图在Ionic 2中实现导航。我尝试了深链接，并且得到了结果，但是'＃'符号在URL中开始。当"＃"符号将在URL中出现时，Google Analytic将无法识别该网站，这就是为什么我试图以不同的方式实现导航，例如Angular 2路由，这两个支持（HTML5或Hash url样式），但无法实现离子2.

ex- http：//localhost：8100/＃/注册 - 这个工作正常，但我希望没有'＃'。像http：//localhost：8100/登记

感谢您的帮助

我为 @ionic/app-scripts 3.2.5放入PR来补救以下操作：https://github.com/ionic-team/ionic-app-scripts/pull/1545

与此同时，您可以编辑一些项目和依赖性文件以启用它：

src/app/app.module.ts：

        IonicModule.forRoot(MyApp,
        {
            locationStrategy: 'path'
        },
        {
            links: [
                { component: RegistrationPage, name: 'registration', segment: 'registration' },
                { component: LoginPage, name: 'login', segment: 'login' },
                { component: HomePage, name: 'home', segment: '' }
            ]
        })

src/index.html：

<head>
    ...
    <base href="/" />
    ...
</head>

node_modules/@ionic/app-scripts/dist/dev-server/http-server.js：

function createHttpServer(config) {
    var app = express();
    app.set('serveConfig', config);
    app.get('/', serveIndex);
    app.use('/', express.static(config.wwwDir));
    app.use("/" + serve_config_1.LOGGER_DIR, express.static(path.join(__dirname, '..', '..', 'bin'), { maxAge: 31536000 }));
    // Lab routes
    app.use(serve_config_1.IONIC_LAB_URL + '/static', express.static(path.join(__dirname, '..', '..', 'lab', 'static')));
    app.get(serve_config_1.IONIC_LAB_URL, lab_1.LabAppView);
    app.get(serve_config_1.IONIC_LAB_URL + '/api/v1/cordova', lab_1.ApiCordovaProject);
    app.get(serve_config_1.IONIC_LAB_URL + '/api/v1/app-config', lab_1.ApiPackageJson);
    app.get('/cordova.js', servePlatformResource, serveMockCordovaJS);
    app.get('/cordova_plugins.js', servePlatformResource);
    app.get('/plugins/*', servePlatformResource);
    if (config.useProxy) {
        setupProxies(app);
    }
    app.all('/*', serveIndex);
    return app;
}

行app.all('/*', serveIndex);是将任何404个文件或目录重定向到index.html。然后，位置："路径"设置可以在这种情况下正常使用深链接和重定向。

尝试使用pathlocatationsty而不是Hashlocationstrategy。

在app.module.ts

中添加它

import { LocationStrategy,
         PathLocationStrategy } from '@angular/common';
...
@NgModule({
...
providers: [
{
   provide: LocationStrategy,
   useClass: PathLocationStrategy
},
...

或其他方式是

   IonicModule.forRoot(MyApp, {
        locationStrategy: 'path'
    })

并确保具有有效的基础HREF。

，这是我所做的事情列表。希望这会有所帮助。

我们需要在每个URL的路径中删除＃，因为Google Analytics（Google Analytics）拒绝使用＃中的URL。在应用模块中，将{locationstrategy：'path'}添加到您的应用模块：
```
IonicModule.forRoot(MyApp, {
  locationStrategy: 'path'
})
```

2 .now＃从URL中删除。但是，当您刷新或直接访问URL时，此不起作用，因为这是任何水疗中心的预期行为。当您刷新页面时，服务器试图在上述位置找到页面。如上面的@parth ghiya所述：如果您击中Localhost/abc，则服务器尝试查找实际上不存在的ABC/index.html。因此，解决此问题，您已经在我的服务器上写了配置请求index.html。我正在使用Node Express Server部署该应用程序。使用以下代码将每个请求路由到index.html-

var express = require('express');
var path = require('path')
var app = express();
app.use(express.static(path.resolve(__dirname, "www")));
app.use('/*', function(req, res){
   res.sendFile(__dirname+ '/www' + '/index.html');
});
app.set('port', process.env.PORT || 3000);
app.listen(app.get('port'), function() {
  console.log("listening to Port", app.get("port"));
});

相关内容

最新更新

热门标签：