什么是Facebook中的shebang / hashbang(#!)和新的Twitter URL?
我刚才注意到,我们习惯使用的漫长而复杂的Facebook网址现在看起来像这样:
http://www.facebook.com/example.profile#!/pages/Another-Page/123456789012345
据我所知,今年早些时候它只是一个普通的URL片段式字符串(以#
开头),没有感叹号。但现在它是一个shebang或hashbang(#!
),我以前只在shell脚本和Perl脚本中看到过。
新的Twitter URL现在还具有#!
符号。例如,Twitter个人资料网址现在看起来像这样:
http://twitter.com/#!/BoltClock
#!
现在在URL中扮演了一些特殊的角色,比如某个Ajax框架或某些东西,因为新的Facebook和Twitter界面现在基本上是Ajax化的吗?在我的URL中使用它会以任何方式使我的Web应用程序受益吗?
没有找到相关结果
已邀请:
7 个回复
茬贺努充尽
这样的网址,Google会检查网址
以获取内容的非AJAX版本。
目浆搽
标识页面,
是锚点。 Facebook和其他Javascript驱动的应用程序(比如我自己的Wood& Stones)使用锚点的原因是他们希望将页面设为可收藏(如对该答案的评论所建议)或支持后退按钮而不重新加载整个页面服务器。 为了支持书签和后退按钮,您需要更改URL。但是,如果您将页面部分(类似于
)更改为其他URL或未指定锚点,则浏览器将从URL加载整个页面。在Firebug或Safari的Javascript控制台中试试这个。加载
。现在在Javascript控制台中,键入:
您将看到从服务器刷新页面。现在输入:
啊哈!没有页面刷新!类型:
仍然没有刷新。使用后退按钮可以查看这些URL是否在浏览器历史记录中。浏览器注意到我们在同一页面上但只是更改锚点,因此它不会重新加载。由于这种行为,我们可以在浏览器中显示一个单独的Javascript应用程序,使其位于一个“页面”上,但是有许多可书签部分,这些部分都支持后退按钮。当用户输入不同的“状态”时,应用程序必须更改锚点;同样,如果用户使用后退按钮或书签或链接来加载包含锚点的应用程序,则应用程序必须恢复适当的状态。 所以你有它:Anchors为Javascript程序员提供了一个机制,用于制作可收起书签,可索引和后退按钮的应用程序。这种技术有一个名称:它是一个单页面界面。 附:这项技术有第四个好处:通过AJAX加载页面内容然后将其注入当前DOM可能比加载新页面快得多。除了速度增加之外,还可以在程序员的控制下执行诸如在后台加载某些部分之类的其他技巧。 p.p.s.鉴于所有这些,“爆炸”或感叹号进一步提示谷歌的网络抓取工具,可以从稍微不同的URL从服务器加载完全相同的页面。请参阅Ajax Crawling。另一种技术是使每个链接指向服务器可访问的URL,然后使用不显眼的Javascript将其更改为带锚的SPI。 这是关键链接:单页界面宣言
辰炔诚薯
角色
仅为Google目的而添加,此符号是Google“标准”,用于抓取密集在AJAX上的网站(在极端的单页界面网站中)。当Google的抓取工具找到带有
的网址时,它知道存在另一个传统网址,提供相同的网页“状态”,但在这种情况下是加载时间。 尽管
组合对于SEO非常有趣,但只有Google支持(据我所知),通过一些JavaScript技巧,您可以构建SPI网站SEO兼容任何网络爬虫(Yahoo,Bing ...)。 SPI宣言和演示不会在哈希中使用谷歌的
格式,这种符号可以轻松添加,SPI爬行可以更容易(更新:现在!使用符号并与其他搜索引擎保持兼容)。 看看这个教程,是一个简单的ItsNat SPI站点的例子,但是你可以为其他框架选择一些想法,这个例子对于任何网络爬虫都是SEO兼容的。 难的问题是生成任何(或选定的)“AJAX页面状态”作为SEO的纯HTML,在ItsNat中非常容易和自动,同一站点在同一时间SPI或基于SEO的页面(或当JavaScript被禁用时)为了可访问性)。使用其他Web框架,您可以遵循双站点方法,一个站点基于SPI,另一个基于SEO,例如Twitter使用这种“双站点”技术。
冕偷淮款
筷啸够对铅
诧不达
刚刚表明后面的哈希片段对应一个URL,
取代了站点根或域。从理论上讲,它可能是任何东西,但Google AJAX Crawling API似乎就是这样。 当然,哈希表示没有发生真正的页面重新加载,所以是的,这是出于AJAX的目的。编辑:Raganwald做了一个可爱的工作,更详细地解释了这一点。
臀夯脖锑
默认做什么... 在“普通”(不是单个页面应用程序)上,您可以使用
锚定到任何具有id的元素,方法是在散列后将元素id放在url中
例: (在Chrome上)单击F12或Rihgt鼠标和
然后拿
并添加到url如下
并且您将获得跳转到页面上该元素的链接 什么是Facebook中的shebang / hashbang(#!)和新的Twitter URL? 通过在上面的答案中描述的方式使用
,你引入了相互矛盾的行为......虽然我不会在它上面失眠...因为Angular它变得有点标准......