hash pattern and history model small note

hash mode

  Hash here refers to the number sign and the back of the url character . For example, " www.baidu.com/#hashhash ", which "#hashhash" is what we expected hash value.

  Due to changes hash value will not cause the browser sends a request like server, and hash changes will trigger hashchange event, forward and back browser can also be controlled, so before H5 model's history appeared, basically using hash distal routing mode is achieved.

history mode

  Use the HTML5 History in the new pushState () and replaceState () method, the two methods can add and modify history of records. Only when they perform the modification, although the change of the current URL, but not the browser sends a request to the server immediately.

  history.pushState () and history.replaceState () all three parameters (state, title, url)

  Parameters as follows:

    1. state: a legitimate Javascript object that can be used in the event of popstate

    2. title: now most browsers ignore this parameter, you can instead of directly with null

    3. url: any valid URL, for updating the browser's address bar

  history.pushState difference () and history.replaceState () is comprising:

    • history.pushState () while preserving existing history, url will be added to the history.

    • history.replaceState () the current page url will be replaced with the historical record in the history.

  Since history.pushState () and history.replaceState () can change the url at the same time, do not refresh the page, so in HTML5 the histroy have the ability to implement front-end route.

  But note that, history in the revised url, although the page does not refresh, but we are in a manual refresh, or when entering the application, the server is not recognized by the url directly through the url. Because we are a single-page application, only a html file, the server url in dealing with other path, the situation would appear 404. So, if you want to apply history mode, you need to increase a candidate resources to cover all situations in the service side: if the URL match any static resources, it should return html file one-page application.

to sum up

  • the hash mode, url will carry a hash # symbol , only the hash symbols before content is included in the request, it will not return a 404 error.

  • Under history mode, the front end of the URL must be an actual URL that initiated the request to the backend consistent with the need for server routing configuration , otherwise it will return a 404 error.

Guess you like

Origin www.cnblogs.com/yaokai729/p/11442951.html