angluar去掉url中#

众所周知,angular项目中路由机制会在地址栏加一个#来实现各个页面的切换,虽然url中有个#号也无伤大雅,但每次看到多一个这个东西总是不舒服(我不是强迫证啊),趁着项目间隙还是决定把它去掉。

去谷哥百度一下,发现用html5的形式也解决这个问题,就一行代码,so easy.

$locationProvider.html5Mode(‘true‘);

我把这行代码加入了app.js的config中然后运行一下,发现并没有什么卵用,还报了错。

好吧,原来还要加index.html的header中加入base标签。

<base href="/">

OK, base标签加上之后果然运行成功,#成功去掉。

等等!

然而并没有那么简单,当我刷新页面时居然报出了404,什么鬼?!

在谷歌的帮助下我找到了原因,我还是太天真了,上边这种形式只适用于客户端的页面跳转,不适用于重新请求服务器。。。这不是坑爹吗?

终于还在谷歌的帮助下,还是让我找到了服务器端的解决方案,修改apache的配置文件,利用rewrite对发过来url地址进行重写(要确保apache中已安装rewrite模块)。

apache配置文件:

<VirtualHost *:80>
    ServerName my-app

    DocumentRoot /path/to/app

    <Directory /path/to/app>
        RewriteEngine on

        # Don‘t rewrite files or directories
        RewriteCond %{REQUEST_FILENAME} -f [OR]
        RewriteCond %{REQUEST_FILENAME} -d
        RewriteRule ^ - [L]

        # Rewrite everything else to index.html to allow html5 state links
        RewriteRule ^ index.html [L]
    </Directory>
</VirtualHost>

重新启动apache,运行成功,完美去掉#。

打完收工。

参考1   https://github.com/yeoman/generator-angular/issues/433

参考2   https://scotch.io/quick-tips/pretty-urls-in-angularjs-removing-the-hashtag

参考3   http://www.tech.theplayhub.com/angularjs_routeprovider_404/

时间: 2024-10-02 09:54:01

angluar去掉url中#的相关文章

nginx去掉url中的index.php

使用情境:我想输入www.abc.com/a/1后,跳转到www.abc.com/index.php/a/1 配置Nginx.conf在你的虚拟主机下添加:  location / {      if (!-e $request_filename){           rewrite ^/(.*)$ /index.php/$1 last;      } } 如果你的项目入口文件在一个子目录内,则: location /目录/ {      if (!-e $request_filename){

Dedecms去掉URL中a目录的方法

本文实例讲述了Dedecms去掉URL中a目录的方法.分享给大家,供大家参考.具体分析如下: 使用dedecms的朋友可能会发现自己的URL目录生成是会自动带有一个/A/目录了,那么要如何去掉URL中/a/目录呢,下面我来给大家介绍. 那么怎么去掉/a/,缩短URL呢,方法有两个: 方法一,如果你是新站我们可以在创建时文章栏目的时,选择网站根目录或者cms根目录,这样就会去掉a/ 1.首选在系统设置那的系统基本参数那,文档HTML默认保存路径,把a去掉. 2.然后在到栏目管理那修改下,文件保存目

PHP CI(CodeIgniter) 如何去掉url中的index.php

1.打开Apache配置文件httpd.conf,找到 1 #LoadModule rewrite_module modules/mod_rewrite.so 去掉前面的# 搜索AllowOverride,将相应Directory下的AllowOverride设置为All 1 AllowOverride All 2.在CI的根目录下,建立.htaccess文件,文件内容如下 1 RewriteEngine On 2 3 RewriteCond %{REQUEST_URI} ^system.* 4

去掉 url 中的 index.php

Apache服务器则开启 mod_rewrite 模块 在 Aoache 配置文件 httpd.conf 中查找  LoadModule rewrite_module modules/mod_rewrite.so  去掉前面 '#' 则为开启 在跟目录创建 .htaccess 文件  内容如下 RewriteEngine On     RewriteCond %{REQUEST_FILENAME} !-f     RewriteCond %{REQUEST_FILENAME} !-d     R

thinkphp在wamp 配置去掉url中index.php方法

调试了好久,才发现把简单的事情搞复杂了. 其实原理很简单. 1.在配置文件中 'URL_MODEL'=>2, 设置为2. 2.在php.ini中 cgi.fix_pathinfo=1 去掉前面的注释 3.在Apache下conf配置文件中, LoadModule rewrite_module modules/mod_rewrite.so 去掉前面的注释 然后重启apache,即可. 尊重原创. 作者:新启科技

ThinkPHP去掉URL中的index.php

1,先确认你有没mod_rewrite.so模块 /usr/lib/apache2/modules/mod_rewrite.so 然后在httpd.conf最后一行加上(我不加也行,自己都奇怪) LoadModule rewrite_module modules/mod_rewrite.so 重启/etc/init.d/apache2 restart 2,将/etc/apache2/sites-enabled/000-default中的 AllowOverride None 将None改为 Al

nginx服务器怎样去掉url中的index.php

server { listen 80; server_name yourdomain.com; root /home/yourdomain/www/; index index.html index.htm index.php; if (!-e $request_filename) { rewrite ^(.*)$ /index.php$1 last; } location ~ .*\.php(\/.*)*$ { include fastcgi.conf; fastcgi_pass 127.0.0

ThinkPHP 利用.htaccess文件的 Rewrite 规则隐藏URL中的 index.php

去掉 URL 中的 index.php ThinkPHP 作为 PHP 框架,是单一入口的,那么其原始的 URL 便不是那么友好.但 ThinkPHP 提供了各种机制来定制需要的 URL 格式,配合 Apache .htaccess 文件,更是可以定制出人性化的更利于 SEO 的 URL 地址来. .htaccess文件是 Apache 服务器中的一个配置文件,它负责相关目录下的网页配置.我们可以利用 .htaccess 文件的 Rewrite 规则来隐藏掉 ThinkPHP URL 中的 in

Thinkphp中取消url中的index.php 和 Home 默认模块

将配置文件中改: <?phpreturn array(    //'配置项'=>'配置值'    'URL_MODEL'=>'2',   //去掉url中index.php 'MODULE_ALLOW_LIST'    =>    array('Home','Admin','User'),  //可访问模块    'DEFAULT_MODULE'       =>    'Home',   //默认模块 );