Question

我想在我的网站上创建动态网址。我在前端使用Angular和ngRoute。我想要基本的URL：

mysite.com/home

mysite.com/about

mysite.com/（电台名称）/ - 这是我创建的每个电台的页面

但是当我访问像 whateverUrl 这样的电台页面时，我收到错误：

无法GET / whateverUrl /

我尝试创建像 / station / whateverURL 这样的路线并且工作了！但我希望网址尽可能短。

我的代码如下：

angular.module("app").config(['$routeProvider', '$locationProvider', function ($routeProvider, $locationProvider) {
    var apiVersion = "/api/v2/";

    $routeProvider.when("/", {
        templateUrl: "/static/app/view/home.html",
        controller: "HomeController",
        resolve: {
            userData: function(commonService) {
                return commonService.get(apiVersion + "users/");
            }
        }
    }).when("/home/", {
        templateUrl: "/static/app/view/home.html",
        controller: "HomeController",
        resolve: {
            userData: function(commonService) {
                return commonService.get(apiVersion + "users/");
            }
        }
    }).when("/about/", {
         templateUrl: "/static/app/view/about.html"
    }).when("/:stationId/", {
        templateUrl: "/static/app/view/station.html",
        controller: "StationController",
        resolve: {
            stationData: function(commonService, $route) {
                return commonService.get(apiVersion + "stations/" + $route.current.params.stationId + "/");
        }
    });

    $locationProvider.html5Mode({
        enabled: true,
        requireBase: false
    });
}]);

Answer 1

此处的问题与您的前端无关，只与后端有关。

Angular将在服务器发送文件后启动并由浏览器处理，但是当您在/whateverUrl/请求资源时，您的服务器不知道如何处理它并以404响应和标准的404消息。

根据您发布的错误：

Cannot GET /whateverUrl/

~~我想我可以假设你后端有一个Node / Express服务器。~~

~~您只需要为所有网址添加一个为index.html提供服务的中间件。~~

var express = require('express');
var app = express();

app
    .route('/*')
    .get(function (req, res) {
        res.sendFile("index.html")
    });

基于以下评论，后端服务器基于django，imo需要一些修复。我没有删除答案，但显然我发布的内容并没有解决问题。

ngRoute动态URL作为路径的第一部分

1 个答案: