如何配置 IIS 以在 HTML5 模式下 URL 重写 AngularJS 应用程序?

2024-04-28

我有AngularJS 种子项目 https://github.com/angular/angular-seed我已经添加了

$locationProvider.html5Mode(true).hashPrefix('!');

到 app.js 文件。我想配置 IIS 7 将所有请求路由到

http://localhost/app/index.html

这样这对我有用。我该怎么做呢?

Update:

我刚刚发现、下载并安装了IIS URL重写模块 http://www.iis.net/downloads/microsoft/url-rewrite,希望这能让我的目标变得容易和明显。

Update 2:

我想这总结了我想要实现的目标(取自AngularJS 开发者文档 http://docs.angularjs.org/guide/dev_guide.services.%24location):

使用这种模式需要在服务器端重写URL, 基本上你必须重写你的所有入口点链接 应用程序(例如index.html)

更新3:

我仍在研究这个问题,我意识到我不需要重定向(有重写规则)某些 URL,例如

http://localhost/app/lib/angular/angular.js
http://localhost/app/partials/partial1.html

因此 css、js、lib 或partials 目录中的任何内容都不会被重定向。其他所有内容都需要重定向到 app/index.html

有人知道如何轻松实现这一点,而不必为每个文件添加规则吗?

更新4:

我在 IIS URL 重写模块中定义了 2 条入站规则。第一条规则是:

第二条规则是:

现在,当我导航到 localhost/app/view1 时,它会加载页面,但是支持文件(css、js、lib 和partials 目录中的文件)也被重写到 app/index.html 页面 - 所以一切都会到来无论使用什么 URL,都会返回到 index.html 页面。我想这意味着我的第一条规则(应该阻止第二条规则处理这些 URL)不起作用......有什么想法吗? ...任何人? ...我感觉很孤单... :-(


我在 web.config 之后写了一条规则$locationProvider.html5Mode(true)安顿好了app.js.

希望,可以帮助别人。

  <system.webServer>
    <rewrite>
      <rules>
        <rule name="AngularJS Routes" stopProcessing="true">
          <match url=".*" />
          <conditions logicalGrouping="MatchAll">
            <add input="{REQUEST_FILENAME}" matchType="IsFile" negate="true" />
            <add input="{REQUEST_FILENAME}" matchType="IsDirectory" negate="true" />
            <add input="{REQUEST_URI}" pattern="^/(api)" negate="true" />
          </conditions>
          <action type="Rewrite" url="/" />
        </rule>
      </rules>
    </rewrite>
  </system.webServer>

在我的 index.html 中我将其添加到<head>

<base href="/">

不要忘记安装IIS URL 重写 http://www.iis.net/downloads/microsoft/url-rewrite在服务器上。

另外,如果您使用 Web API 和 IIS,那么如果您的 API 位于www.yourdomain.com/api因为第三个输入(条件的第三行)。

本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)

如何配置 IIS 以在 HTML5 模式下 URL 重写 AngularJS 应用程序? 的相关文章

  • 提交表单时 ng-required 不起作用

    我在带有 required 属性的输入文本框中包含以下代码 但是当我跳出该字段或提交表单时 它不会阻止表单提交并通知用户该字段是必填字段 div class col sm 8 div
  • Angular-ui State - 多个视图看不到我的解析数据

    由于某种原因 当使用多个命名视图 angular ui ui router 时 控制器看不到我的resolvedData 有人遇到过这个问题吗 stateProvider state page abstract true templateU
  • 如何在 Angular JS 中显示以字节数组形式接收的图像

    我有一个将返回图像的服务器端应用程序 这些是响应标头 Content Disposition attachment filename 8822a009 944e 43f4 999b d297198d302a 1 0 low res Cont
  • 如何在 AngularJS 初始化之前防止元素显示( ng-show )

    在AngularJS中 我想知道如何防止在ng show生效之前页面上显示的元素 我发现一些帖子谈论ng cloak 但在我的情况下似乎不起作用 可能ng cloak是为了防止双花括号而不是 Element 样式 有人谈论的另一种方式是在
  • 如何从 angularJS 模板调用encodeURIComponent?

    我的 Angular JS 模板中有一个块 a href foos foo id foo name a 但是 foo id 属性有时可能包含时髦字符 我想做这样的事情 a href foos encodeURIComponent foo i
  • 经典 asp 和 IIS 应用程序池之间有什么关系?

    asp 是否在为其配置网站的 IIS 应用程序池中运行 或者应用程序池仅适用于asp NET应用程序 这两者之间有何关系 我需要知道什么才能了解 谁在做什么以及他们在哪里做 ASP Classic 应用程序将在分配给它的应用程序池中运行 A
  • 如何更新状态变更指令

    我有一个根状态 它定义了 Angular 模板的整体结构 在根状态下 我包含侧边栏 其中通过根据状态更改的指令具有动态菜单 像这样 state root abstract true url root templateUrl views ro
  • Angularjs 在生产中禁用调试数据

    我正在尝试按照角度文档中的建议禁用生产服务器中的调试数据here https docs angularjs org guide production 补充一点 我并没有真正看到性能和加载时间有任何改进 这是我的代码在 app js 中的样子
  • Chart.js 没有显示在我的视图中

    我有一个使用 angular js 运行的应用程序 我的视图之一应该加载图表 我正在使用 Chart js 但由于某种原因它不起作用 并且我的控制台上没有显示错误 这是我创建图表的函数 scope writeBatteryChart fun
  • AngularUI Router:在调用子状态时将 url 参数传递给“抽象”状态

    我想在调用子状态时访问抽象状态内的 url 参数 stateParam 我很想知道如何做到这一点 代码在笨蛋也 http plnkr co edit L0TXx3DCBOJmh4XydXbV p preview stateProvider
  • 嵌套 ng 网格?

    我们可以制作一个嵌套的 ng grid 像这样的事情 有可能吗 这是笨蛋 http plnkr co edit hYuFfxLR38LA0clIkF48 p preview http plnkr co edit hYuFfxLR38LA0c
  • 如何使用 wampserver 在本地系统上将 URL 从“localhost”更改为其他内容?

    在 Windows 计算机上 有一个系统在本地 wampserver 上运行 但当应用程序在 localhost 上运行时 URL 却另有说明 虽然我希望基于目录结构的 URL 是这样的 http localhost pro include
  • Angular JS - 提交到 $http 时日期发生变化 - 时区问题

    我遇到一个奇怪的问题Date当它通过 http put 传递到 API 时发生变化 我怀疑时区问题 Datepicker 触发 ng change 事件 console log Tue Jun 10 2014 00 00 00 GMT 01
  • Angular 2 变更检测是如何工作的?

    在 Angular 1 中 更改检测是通过对 scope 层次结构进行脏检查来进行的 我们会在模板 控制器或组件中隐式或显式创建观察者 在 Angular 2 中 我们不再有 scope 但我们确实重写了 setInterval setTi
  • 是否可以动态导入模块?

    我有很多角度组件的导入 看起来我可以编写一个函数来简化导入 我只是不知道怎么做 但这应该很简单 进口样本 import DashboardComponent from app components dashboard dashboard c
  • AngularJS 中的嵌套模块

    我有 2 个不同的 AngularJs 模块 一个 widgetContainer 和一个 widget 小部件可以显示为独立的应用程序 也可以包含在小部件容器中 一个 widgetContainer 包含 0 N 个 widget 如果我
  • angularjs - 当 $interval 触发时 ng-show 不会更新类

    尝试使用 Angular 中的 interval 来使用 ng show 更改列表中当前可见的项目 检查 html 我注意到角度将 ng show 从 true false 更改 但它并没有删除 ng hide 类 html 很简单 h1
  • 如何在 IIS 8 中远程停止/启动应用程序池

    注意 每条线使用一行 我在 IIS 6 中使用了这些命令 它们工作得很好 Start get wmiobject namespace root MicrosoftIISv2 computername REMOTE SERVER class
  • AngularJS 服务在控制器之间传递数据

    当使用 AngularJS 服务尝试在两个控制器之间传递数据时 我的第二个控制器在尝试从服务访问数据时总是收到未定义的消息 我猜这是因为第一个服务执行了 window location href 并且我认为这是清除服务中的数据 有没有办法将
  • AngularJS 服务并承诺最佳实践

    我有一个 AngularJS 应用程序services 调用 http资源并返回promise我在控制器中解决了这个问题 这是我正在做的事情的示例 app service Blog function http q var deferred

随机推荐