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

Posted 2023-02-22

【中文标题】ngRoute 动态 url 作为路径的第一部分

【英文标题】：ngRoute dynamic url as first part of path

【发布时间】：2017-08-10 07:18:11

【问题描述】：

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

mysite.com/home

mysite.com/about

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

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

无法获取 /whateverUrl/

我尝试创建类似 /station/whateverURL 的路线并且成功了！但我希望 URL 尽可能短。

我的代码如下：

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
    );
]);

【参考方案1】：

这里的问题与您的前端无关，而是与后端有关。

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

根据您发布的错误：

Cannot GET /whateverUrl/

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

你只需要添加一个为你所有的 url 提供 index.html 的中间件。

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

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

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

【讨论】：

我正在使用 django 并且后端是正确的。本地运行时一切正常

好的，检查后端是否存在问题的最佳方法是检查源代码打开 view-source:mysite.com/whateverUrl/ 如果您看到“Cannot GET /whateverUrl/”，那么如果您看到它就是您的后端一些html然后它的角度

当我打开 mysite.com/whateverUrl/ 时，我得到一个空白页，无法获取 /whateverUrl/。现在我将所有内容都设置在 mysite.com/w/whateverUrl 之类的路由中并且可以正常工作，但正如我所说，我希望 URL 尽可能短。

我认为是后端控制器/动作导致了您的问题，我在 django 方面没有任何经验，所以我无法为您提供帮助。也许你可以在这个问题上添加一个 django 标签或开始一个新的。