angularjs - 如何从 Amazon 上的 Angular 应用程序 (Elastic Beanstalk) 中的 url 中删除 #

标签 angularjs amazon-web-services url

我有一个托管在 Amazon Elastic Beanstalk 上的 Angular (1.5.9) 应用程序。

我想从网址中删除 # 并已关注 this guide以及其他类似的东西。

  1. app.js 更新完成:

    $locationProvider.html5Mode(true);
    
  2. index.html 更新完成:

    <head>
        ...
        <base href="/">
    </head>
    
  3. 所有引用文献的更新已完成:

    /#/login ->/login

  4. 我已通过 ssh 连接到我的亚马逊服务器并在那里创建了一个 .htaccess 文件:

    [ec2-user@ip-xxx-xx-x-xxx]$ ll -a/var/www/html 总计 12 drwxr-xr-x 2 根根 4096 22 maj 13.43 。 drwxr-xr-x 6 根 根 4096 1 maj 23.56 .. -rw-r--r-- 1 root root 339 22 maj 13.43 .htaccess

    内容:

    RewriteEngine On  
    # If an existing asset or directory is requested go to it as it is
    RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -f [OR]
    RewriteCond %{DOCUMENT_ROOT}%{REQUEST_URI} -d
    RewriteRule ^ - [L]
    
    # If the requested resource doesn't exist, use index.html
    RewriteRule ^ /index.html
    

我在/src/main/resources/static 目录下有index.html和app.js文件

访问 www.mypage.com 并导航到 www.mypage.com/about 在 url 中没有 # 的情况下效果很好,但刷新页面会出现 404。

我做错了什么?这在亚马逊服务器上通常是如何完成的?

最佳答案

受到迈克的评论和一些链接的启发herehere我选择放弃亚马逊上的 .htaccess 文件、httpd.conf 文件或其他此类重定向。相反,我只是将此 Controller 添加到我的 Java Spring Boot 后端:

package com.example

import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;

@Controller
public class CatchAllController {
    @RequestMapping(value = "/**/{[path:[^\\.]*}")
    public String redirect() {
        return "forward:/";
    }
}

使用 @RestController 对我不起作用,我必须使用 @Controller。

该模式匹配所有没有“.”的内容。因此 .jpg 图像等资源不匹配。此外,所有其他端点仍然首先匹配(我猜是因为它们比这个规则更具体)

与我原来问题中的步骤 1-3 一起,这使得一切都按预期工作,重新加载效果很好,并且任何地方都不需要 #。现在我可以在我熟悉的 Java 上下文中控制它,轻松在本地主机上进行测试,而不会迷失在 mod_rewrite 文档中......

关于angularjs - 如何从 Amazon 上的 Angular 应用程序 (Elastic Beanstalk) 中的 url 中删除 #,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/44114999/

相关文章:

javascript - 表扩展的过渡

java - Amazon S3 - 使用 Java AWS SDK 将区域设置为 EU

ruby - Ruby 1.9.2 是否有一个很好的库来处理 IRI(具有特殊字符的 URL,如 ü )

.htaccess - Codeigniter 产品在没有 index.php 的本地服务器上运行良好,但在服务器上不起作用

javascript - 如何构建 Angularjs/Leaflet/Node.js 应用程序

javascript - AngularJS 一次只显示一个列表项

rest - AWS 缺少身份验证 token

amazon-web-services - 配置 SQS 死信队列以在收到消息时发出云监视警报

java - 高级通配符操作从 URL 中删除逗号?

javascript - 如何在 Angular js 中实现自定义指令?