客户端 Javascript 应用程序 - 不带哈希标签的 url 路由

2024-05-20

我正在使用最新版本的 Ember.js 开发一个新的仅客户端应用程序。有一个 PHP 页面可以构建脚本、CSS、模板文件等,并将其全部传递到 index.php 中。我使用 htaccess 指令,以便所有请求都重写到 /index.php。就我而言,PHP 只是为了方便地打包 Javascript。

目前,浏览器中的路由看起来像这样并且工作得很好。

/#/about 
/#/favorites
/#/etc
/#/posts/5/edit

然而,我希望它们看起来像这样——这不能很好地工作。

/about
/favorites
/etc
/posts/5/edit

第二个选项仍然提供完全相同的客户端代码 - 但它总是命中索引路由处理程序。我以前见过客户端应用程序实现了这一点 - 我错过了什么?我需要在 PHP 端有匹配的路由处理程序吗?

编辑:我正在寻找如何解决这个问题的具体答案。网络上充斥着“哦——你就这样做”的信息,让其他人摸不着头脑。


在 Ember.js(版本 1.0.0rc3)中,这可以通过使用来完成Ember.js 定位 API http://emberjs.com/guides/routing/specifying-the-location-api/:

App.Router.reopen({
  location: 'history'
});

然后设置 Web 服务器将流量重定向到 Ember 应用程序。

这里举一个具体的例子是一个基本的Apache.htaccess将流量重定向到位于 index.html 中的 Ember 应用程序的文件:

RewriteEngine on
RewriteCond %{REQUEST_FILENAME} !-f
RewriteCond %{REQUEST_FILENAME} !-d
RewriteRule ^(.*)$ /index.html#$1 [L]

As 亚历克斯·怀特 https://stackoverflow.com/a/21704913/657661指出 Apache 2.2.16 及更高版本支持更简单的配置,用于将流量重定向到单个目标:

FallbackResource /index.html

The 后备资源 https://httpd.apache.org/docs/trunk/mod/mod_dir.html#FallbackResource是的一部分mod_dir模块和要求AllowOverride Indexes要设置。

确保彻底测试应用路线。一个常见的错误是Uncaught SyntaxError: Unexpected token <,这是由于使用CSS和JS文件的相对链接造成的。在它们前面加上一个/标记以使它们绝对。

这个功能是Internet Explorer . http://caniuse.com/#search=pushstate

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

客户端 Javascript 应用程序 - 不带哈希标签的 url 路由 的相关文章

  • 对客户端 JavaScript 计算器使用 eval 安全吗?

    我正在制作一个计算器 作为用户浏览器的静态 HTML 页面 该页面并非旨在将任何信息提交回服务器 除了这个计算器之外 网页上不会出现任何其他内容 在这种情况下使用 eval 安全吗 或者换句话说 在这种情况下使用 eval 是否会导致额外的
  • 相对于路径匹配路由

    我想要任何以以下结尾的网址 templates filename 使用路由属性映射到特定控制器 例如 public class TemplateController Controller Route templates templateFi
  • Ember.js 处理 View 事件后转换到路由

    Setup 我有一个 Ember 应用程序 支持使用 Imgur API 上传图像 我已经有一个工作路线和模板来处理任何 Imgur ID 但我想在上传新图像后转换到此路线 使用返回的 Imgur ID 这是该应用程序的相关部分 http
  • PHP 是否有可重用的路由器/调度程序?

    我正在使用一个简单的框架 它根据查询参数处理请求 http example com index php event listPage http example com index php event itemView id 1234 我想将
  • 将 css 类添加到 Ember.js 中的

    如何将CSS类添加到特定路线上的body标签 我尝试使用body在车把模板中添加标签但不起作用 Update 经过一番谷歌搜索后 我找到了这个解决方案 不确定这是最好的方法 但它确实有效 App SomeRoute Em Route ext
  • 使用 CXF 通过 HTTP 基本身份验证使用 Web 服务时出现 401 错误

    我正在尝试在 JUnit 测试中使用使用 HTTP 基本身份验证 使用 Apache CXF 的远程 Web 服务 我收到的错误是 javax xml ws WebServiceException Failed to access the
  • Ember Data 中的类继承有很多关联

    我正在尝试让 Ember Data 使用与类继承的 hasMany 关联 Ember 代码示例 var Person DS Model extend name DS attr string animals DS hasMany Animal
  • PHP Laravel 路由问题

    我的设置目前看起来像这样 应用程序 控制器 register php class register Controller extends Base Controller public restful true public function
  • Ember.js - 从计算属性返回 unicode 字符

    我试图从计算属性返回 unicode 字符 但是 不断逃脱 amp 我什至尝试过像这样返回 Handlebars SafeString return new Ember Handlebars SafeString 61573 产生相同的结果
  • 使用 ember.js 无限滚动(延迟加载)

    我有一个视图 其中可能有大量项目供用户滚动 我想实现无限滚动以实现内容的渐进加载 看起来有些人已经做了分页 https stackoverflow com questions 8778259 ember js rendering large
  • Ember 集成测试在访问路线后挂起

    我正在尝试做一个简单的集成测试 我从 ember cli 网站上的集成示例开始 现在 当我在浏览器 localhost 4200 tests 中测试时 以下情况会路由到我期望的位置 但随后它只是挂起并且永远不会成功或失败 import Em
  • 参数绑定到 ASP.NET MVC Core 中的路由或查询字符串

    我正在将 ASP NET MVC NET Framework Web 应用程序迁移到 ASP NET MVC Core 3 1 该应用程序是公司内部的 我们正在借此机会清理一些 API 路由 使它们更加 RESTful 例如 api Val
  • Ember-数据引导模型对象

    当使用非远程 AJAX 调用的现有 JSON 引导 Ember 数据模型对象时 我是否必须进行以下 2 个调用 App store load App Account data var account App store find App A
  • Web 应用程序国际化,是服务器端还是客户端?

    我们正在寻求国际化网络应用程序 最好是在服务器端 用 net 4 C 编写 或客户端 Javascript 输出翻译 我们已经开始通过创建一个 JS 文件在客户端执行此操作 该文件包含一个包含英语短语作为键的对象 以便开发人员了解每条消息在
  • 首选的客户端路由解决方案? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • Ember 数据保存方法,创建与更新

    我不明白 Ember 如何确定是否应该更新或创建记录 我认为它是基于 ID 或商店条目 但它似乎是其他东西 代码示例阐明了 this returns the user without making an api call currentUs
  • 我的 RIA 应该使用什么架构模式? [关闭]

    就目前情况而言 这个问题不太适合我们的问答形式 我们希望答案得到事实 参考资料或专业知识的支持 但这个问题可能会引发辩论 争论 民意调查或扩展讨论 如果您觉得这个问题可以改进并可能重新开放 访问帮助中心 help reopen questi
  • 在路由之间传递参数

    Ember 中将参数从一个路由发送到另一个路由的 适当 方式是什么 例如 我有两条这样定义的路线 this resource activities path activities on date function this route ne
  • less.js - 在解析器回调中获取变量值

    我正在使用 less js 1 3 0 在客户端将 less 解析为 css 在解析器的回调中 我想获取每个变量的值 我尝试了以下方法但没有成功 var data colour red example background color co
  • ember-data:如何制作正在保存/已保存的闪存消息

    为了在我的应用程序顶部制作一个黄色的 正在保存 已保存 指示符消息 我希望有一个布尔属性来指示当前是否有任何余烬数据记录正在运行 我试过这个 App store DS Store create isSaving gt for record

随机推荐