从webapp更新url栏以表示当前状态

时间:2021-12-09 18:05:02

I would like to basically do what Jason asked for here

我想基本上做杰森在这里要求的事情

In one sentence, I would like the url bar to represent the state of the AJAX application so that I can allow to bookmark it as well as allow the user to return to the previous state by using the back/forward buttons in the browser.

在一句话中,我希望url栏代表AJAX应用程序的状态,这样我就可以允许它为它添加书签,并允许用户使用浏览器中的后退/前进按钮返回到先前的状态。

The difference for me (From what Jason asked) is that I am using JSF 2.0. I've read that JSF 2.0 added the ability to use get, but I am not sure what the correct way to use this.

对我来说(从杰森那里得知)的不同之处在于我使用的是JSF 2.0。我已经读过JSF 2.0添加了使用get的能力,但我不确定使用它的正确方法。

Thanks for the help.

谢谢您的帮助。

Further Clarification

进一步澄清

If I understand correctly, to be able to bookmark specific states in the AJAX webapp I will have to use the location.hash. Am I correct? I'm trying to achieve a gmail-like behaviour in the sense that, while the app is complete AJAXified and no redirects occur, I can still use Back/Forward and bookmark (And that's why I would like the URL bar to be updated from the AJAX app itself and not through redirection)

如果我理解正确,为了能够在AJAX webapp中为特定状态添加书签,我将不得不使用location.hash。我对么?我试图在某种意义上实现类似gmail的行为,虽然应用程序是完整的AJAXified并且没有重定向发生,但我仍然可以使用后退/前进和书签(这就是为什么我希望从更新的URL栏更新AJAX应用程序本身,而不是通过重定向)

Update

更新

Just found this similar question

刚发现这个类似的问题

2 个解决方案

#1


3  

The difference for me (From what Jason asked) is that I am using JSF 2.0. I've read that JSF 2.0 added the ability to use get, but I am not sure what the correct way to use this.

对我来说(从杰森那里得知)的不同之处在于我使用的是JSF 2.0。我已经读过JSF 2.0添加了使用get的能力,但我不确定使用它的正确方法。

Please note that this is not the same as maintaining the Ajax state. It usually happens by fragment identifiers (the part starting with # in URL, also known as hashbang). JSF doesn't offer builtin components/functionality for this. As far I have also not seen a component library which does that. You may however find this answer useful to get started with a homegrown hash fragment processor in JSF.

请注意,这与维护Ajax状态不同。它通常由片段标识符(在URL中以#开头的部分,也称为hashbang)发生。 JSF不为此提供内置组件/功能。到目前为止,我还没有看到一个组件库。但是,您可能会发现这个答案对于开始使用JSF中的自行开发的哈希片段处理器很有用。

As to using GET requests, just use <h:link>, <h:outputLink> or even <a> to create GET links. You can supply request parameters in the h: components by <f:param>. E.g.

至于使用GET请求,只需使用 甚至 来创建GET链接。您可以通过 在h:components中提供请求参数。例如。 :param> :outputlink> :link>

<h:link value="Edit product" outcome="product/edit">
    <f:param name="id" value="#{product.id}" />
</h:link>

In the product/edit.xhtml page you can define parameters to set and actions to execute upon a GET request

在product / edit.xhtml页面中,您可以定义要设置的参数和要在GET请求上执行的操作

<f:metadata>
    <f:viewParam name="id" value="#{productEditor.id}" />
    <f:event type="preRenderView" listener="#{productEditor.init}" />
</f:metadata>

In the request or view scoped bean associated with product/edit.xhtml page -in this example #{productEditor}-, you just define the properties and the listener method. The listener method will be executed after all properties are been gathered, converted, validated and updated in the model.

在与product / edit.xhtml页面关联的请求或视图作用域中 - 在此示例#{productEditor} - 中,您只需定义属性和侦听器方法。在模型中收集,转换,验证和更新所有属性之后,将执行侦听器方法。

private Long id;
private Product product;

public void init() {
    product = productService.find(id);
}

#2


0  

Normally you'd use AJAX to prevent complete page refreshes. AFAIK all current browsers would issue a page refresh if you change the base uri. Thus you would have to use the hash part as suggested in the question you provided.

通常,您使用AJAX来阻止完整的页面刷新。如果您更改基本uri,AFAIK所有当前浏览器都会发出页面刷新。因此,您必须使用您提供的问题中建议的哈希部分。

We had a similar problem and did something like this:

我们遇到了类似的问题并做了类似的事情:

  1. We settled for the fact that users cannot bookmark the url.
  2. 我们确定了用户无法为网址添加书签的事实。
  3. For URLs that should be unique/bookmarkable we used different links that issue a redirect. Those URLs are provided in a sitemap.
  4. 对于应该是唯一/可收藏的网址,我们使用了不同的链接来发布重定向。这些URL在站点地图中提供。
  5. For browser back, we added an intermediate page after login. This page does navigation and a redirect to the application. The navigation is stored in the session and when the server gets a navigation request (which can be a history back) the corresponding state is restored. A browser back opens that intermediate page which issues a redirect along with a navigation request on the server side.
  6. 对于浏览器,我们在登录后添加了一个中间页面。此页面可以导航并重定向到应用程序。导航存储在会话中,并且当服务器获得导航请求(可以是历史记录返回)时,恢复相应的状态。浏览器返回打开该中间页面,该页面在服务器端发出重定向以及导航请求。

#1


3  

The difference for me (From what Jason asked) is that I am using JSF 2.0. I've read that JSF 2.0 added the ability to use get, but I am not sure what the correct way to use this.

对我来说(从杰森那里得知)的不同之处在于我使用的是JSF 2.0。我已经读过JSF 2.0添加了使用get的能力,但我不确定使用它的正确方法。

Please note that this is not the same as maintaining the Ajax state. It usually happens by fragment identifiers (the part starting with # in URL, also known as hashbang). JSF doesn't offer builtin components/functionality for this. As far I have also not seen a component library which does that. You may however find this answer useful to get started with a homegrown hash fragment processor in JSF.

请注意,这与维护Ajax状态不同。它通常由片段标识符(在URL中以#开头的部分,也称为hashbang)发生。 JSF不为此提供内置组件/功能。到目前为止,我还没有看到一个组件库。但是,您可能会发现这个答案对于开始使用JSF中的自行开发的哈希片段处理器很有用。

As to using GET requests, just use <h:link>, <h:outputLink> or even <a> to create GET links. You can supply request parameters in the h: components by <f:param>. E.g.

至于使用GET请求,只需使用 甚至 来创建GET链接。您可以通过 在h:components中提供请求参数。例如。 :param> :outputlink> :link>

<h:link value="Edit product" outcome="product/edit">
    <f:param name="id" value="#{product.id}" />
</h:link>

In the product/edit.xhtml page you can define parameters to set and actions to execute upon a GET request

在product / edit.xhtml页面中,您可以定义要设置的参数和要在GET请求上执行的操作

<f:metadata>
    <f:viewParam name="id" value="#{productEditor.id}" />
    <f:event type="preRenderView" listener="#{productEditor.init}" />
</f:metadata>

In the request or view scoped bean associated with product/edit.xhtml page -in this example #{productEditor}-, you just define the properties and the listener method. The listener method will be executed after all properties are been gathered, converted, validated and updated in the model.

在与product / edit.xhtml页面关联的请求或视图作用域中 - 在此示例#{productEditor} - 中,您只需定义属性和侦听器方法。在模型中收集,转换,验证和更新所有属性之后,将执行侦听器方法。

private Long id;
private Product product;

public void init() {
    product = productService.find(id);
}

#2


0  

Normally you'd use AJAX to prevent complete page refreshes. AFAIK all current browsers would issue a page refresh if you change the base uri. Thus you would have to use the hash part as suggested in the question you provided.

通常,您使用AJAX来阻止完整的页面刷新。如果您更改基本uri,AFAIK所有当前浏览器都会发出页面刷新。因此,您必须使用您提供的问题中建议的哈希部分。

We had a similar problem and did something like this:

我们遇到了类似的问题并做了类似的事情:

  1. We settled for the fact that users cannot bookmark the url.
  2. 我们确定了用户无法为网址添加书签的事实。
  3. For URLs that should be unique/bookmarkable we used different links that issue a redirect. Those URLs are provided in a sitemap.
  4. 对于应该是唯一/可收藏的网址,我们使用了不同的链接来发布重定向。这些URL在站点地图中提供。
  5. For browser back, we added an intermediate page after login. This page does navigation and a redirect to the application. The navigation is stored in the session and when the server gets a navigation request (which can be a history back) the corresponding state is restored. A browser back opens that intermediate page which issues a redirect along with a navigation request on the server side.
  6. 对于浏览器,我们在登录后添加了一个中间页面。此页面可以导航并重定向到应用程序。导航存储在会话中,并且当服务器获得导航请求(可以是历史记录返回)时,恢复相应的状态。浏览器返回打开该中间页面,该页面在服务器端发出重定向以及导航请求。