You may have seen app.asana.com. If not you should check it out, it is a very nice designed webapp.
您可能已经看过app.asana.com。如果没有,你应该检查出来,这是一个非常好的设计webapp。
But I can't figure out how they handle the whole URL management. Backbone.js or Knockout.js handles the URL with the #, and everything after that is just generated.
但我无法弄清楚他们如何处理整个URL管理。 Backbone.js或Knockout.js使用#处理URL,之后的所有内容都是生成的。
But asana doesn't have a hash and can modify the URL, how are they doing this?
但是asana没有哈希并且可以修改URL,他们是如何做到这一点的呢?
2 个解决方案
#1
5
Looks like they're using HTML5 history.pushState();
so they don't have to refresh the page and so they don't have to use #
(hashes) in the URL to go to a certain part in a web app.
看起来他们正在使用HTML5 history.pushState();因此,他们不必刷新页面,因此他们不必使用URL中的#(哈希)来访问Web应用程序中的某个部分。
Here's a good tutorial about history.pushState();
: https://developer.mozilla.org/en/DOM/Manipulating_the_browser_history
这是关于history.pushState();的一个很好的教程:https://developer.mozilla.org/en/DOM/Manipulating_the_browser_history
This is the what Google+ and Facebook uses to change the URL without refreshing.
这是Google+和Facebook用来更改网址而不刷新的内容。
I hope this helps.
我希望这有帮助。
#2
3
HTML5 Push State: http://spoiledmilk.dk/blog/html5-changing-the-browser-url-without-refreshing-page
HTML5推送状态:http://spoiledmilk.dk/blog/html5-changing-the-browser-url-without-refreshing-page
The big benefit here is that if you paste an Asana URL directly into the browser (or click on a link from an email), the server sees the full URL and can immediately send the appropriate task data to the client. We used to use url fragments, but we needed to do a second round trip after the application loaded to read the fragment in JavaScript and pass it to the server.
这里的一大好处是,如果您将Asana URL直接粘贴到浏览器中(或单击电子邮件中的链接),服务器将看到完整的URL并立即将相应的任务数据发送到客户端。我们曾经使用url片段,但我们需要在加载应用程序后再进行第二次往返,以便在JavaScript中读取片段并将其传递给服务器。
#1
5
Looks like they're using HTML5 history.pushState();
so they don't have to refresh the page and so they don't have to use #
(hashes) in the URL to go to a certain part in a web app.
看起来他们正在使用HTML5 history.pushState();因此,他们不必刷新页面,因此他们不必使用URL中的#(哈希)来访问Web应用程序中的某个部分。
Here's a good tutorial about history.pushState();
: https://developer.mozilla.org/en/DOM/Manipulating_the_browser_history
这是关于history.pushState();的一个很好的教程:https://developer.mozilla.org/en/DOM/Manipulating_the_browser_history
This is the what Google+ and Facebook uses to change the URL without refreshing.
这是Google+和Facebook用来更改网址而不刷新的内容。
I hope this helps.
我希望这有帮助。
#2
3
HTML5 Push State: http://spoiledmilk.dk/blog/html5-changing-the-browser-url-without-refreshing-page
HTML5推送状态:http://spoiledmilk.dk/blog/html5-changing-the-browser-url-without-refreshing-page
The big benefit here is that if you paste an Asana URL directly into the browser (or click on a link from an email), the server sees the full URL and can immediately send the appropriate task data to the client. We used to use url fragments, but we needed to do a second round trip after the application loaded to read the fragment in JavaScript and pass it to the server.
这里的一大好处是,如果您将Asana URL直接粘贴到浏览器中(或单击电子邮件中的链接),服务器将看到完整的URL并立即将相应的任务数据发送到客户端。我们曾经使用url片段,但我们需要在加载应用程序后再进行第二次往返,以便在JavaScript中读取片段并将其传递给服务器。