2016-04-28 30 views
2

Ich arbeite daran, einen Bildbetrachter zu implementieren und React Router zu verwenden. Hochgeladene Bilddateien haben das Format <name>.<type-suffix>-<date-tag>, mit einem Punkt und einem Häkchen als Trennzeichen.Punkt und Bindestrich nicht erlaubt React Router URL Parameter?

Angesichts dieser Route: <Route path="zoomer/:imageId" component={ Zoom }/> und diese URL http://localhost:8080/zoomer/medMain.tif-1461839237863 es scheint nicht, dass der Router eine Übereinstimmung findet.

Wenn ich den Punkt entfernen und der Bindestrich (z. B. http://localhost:8080/zoomer/medMaintif1461839237863) Routing funktioniert gut, aber ich muss wirklich diese Trennzeichen aus semantischen Gründen beibehalten. Und URLEncode() wird mir auch hier nicht helfen.

Gibt es etwas, was ich mit der Route-Spezifikation tun muss, um das zu beheben?

Antwort

2

Ich hatte das gleiche Problem als Webpack-Dev-Server mit History-Api-Fallback aktiviert konnte diese URLs auf die Reactive-App übergeben. Gehackte Webpack-Konfiguration, um diese zu übergeben:

... 
devServer: { 
    proxy: { 
    '/*.*': { // Match all URL's with period/dot 
     target: 'http://localhost:8080/', // send to webpack dev server 
     rewrite: function(req){ 
     req.url='index.html'; // Send to react app 
     } 
    } 
    } 
} 
... 
Verwandte Themen