2009-02-20 19 views
19

Như đã biết, trong các ứng dụng web XHR (aka AJAX) không có lịch sử cho ứng dụng của bạn được xây dựng và nhấp vào nút làm mới thường di chuyển người dùng ra khỏi hoạt động hiện tại của họ. Tôi tình cờ gặp location.hash (ví dụ: http://anywhere/index.html#somehashvalue) để phá vỡ vấn đề làm mới (sử dụng location.hash để thông báo cho ứng dụng của bạn về trạng thái hiện tại của nó và sử dụng trình xử lý tải trang để đặt lại trạng thái đó). Nó thực sự tốt đẹp và đơn giản.Là vị trí theo dõi.hash một giải pháp cho lịch sử trong các ứng dụng XHR?

Điều này khiến tôi suy nghĩ về việc sử dụng location.hash để theo dõi lịch sử ứng dụng của tôi. Tôi không muốn sử dụng các thư viện hiện có, bởi vì họ sử dụng iframe vv Vì vậy, đây là niken và đồng xu của tôi: khi tải trang ứng dụng tôi bắt đầu này:

setInterval(
     function(){ 
      if (location.hash !== appCache.currentHash) { 
       appCache.currentHash = location.hash; 
       appCache.history.push(location.hash); 
       /* ... [load state using the hash value] ... */ 
       return true; 
      } 
      return false; 
     }, 250 
); 

(AppCache là một đối tượng được xác định trước có chứa các biến ứng dụng) Ý tưởng là kích hoạt mọi hành động trong ứng dụng từ giá trị băm. Trong các trình duyệt phong nha, thay đổi giá trị băm sẽ thêm một mục vào lịch sử, trong IE (< = 7) thì không. Trong tất cả các trình duyệt, điều hướng trở lại hoặc chuyển tiếp đến một trang có giá trị băm khác không kích hoạt làm mới trang. Đó là nơi mà chức năng intervalled mất hơn. Với chức năng mỗi khi thay đổi giá trị băm được phát hiện (lập trình, hoặc bằng cách nhấp vào trở lại hoặc chuyển tiếp) ứng dụng có thể thực hiện hành động thích hợp. Ứng dụng có thể theo dõi lịch sử riêng của nó và tôi sẽ có thể trình bày các nút lịch sử trong ứng dụng (đặc biệt là đối với người dùng IE).

Theo như tôi có thể nói điều này hoạt động qua trình duyệt và không có chi phí về bộ nhớ hoặc tài nguyên bộ vi xử lý. Vì vậy, câu hỏi của tôi là: đây có phải là giải pháp khả thi để quản lý lịch sử trong các ứng dụng XHR không? Những ưu và khuyết điểm là gì?

Cập nhật: vì tôi sử dụng khung homebrew của mình, tôi không muốn sử dụng một trong các khung công tác hiện có. Để có thể sử dụng location.hash trong IE và có nó trong lịch sử của nó quá, tôi tạo ra một kịch bản đơn giản (có, nó cần một iframe) mà có thể được sử dụng cho bạn. Tôi đã xuất bản nó on my site, vui lòng sử dụng/sửa đổi/phê bình nó.

Trả lời

5

Tôi nghĩ bạn sẽ có một thời gian khó khăn khi biết người dùng đã đi tiếp hay quay lại. Nói url bắt đầu/myapp # page1 để bạn bắt đầu theo dõi các trạng thái. Sau đó, người dùng thực hiện điều gì đó để tạo url/myapp # page2 Sau đó, người dùng thực hiện điều gì đó để làm cho url/myapp # page1 một lần nữa. Bây giờ lịch sử của họ là mơ hồ và bạn sẽ không biết những gì để loại bỏ hay không.

Các khung lịch sử sử dụng iframe để tránh xung đột với trình duyệt mà bạn đã đề cập. Bạn chỉ cần sử dụng iframe trong các trình duyệt cần chúng.

Con trỏ khác là người dùng sẽ luôn quay lại trình duyệt của họ trước khi họ quay lại nút tùy chỉnh của bạn. Tôi có cảm giác sự chậm trễ trong việc đọc lịch sử mỗi 250ms cũng đáng chú ý. Có lẽ bạn có thể làm khoảng thời gian thậm chí còn chặt chẽ hơn, nhưng sau đó tôi không biết nếu điều đó sẽ làm cho mọi thứ hoạt động kém.

Tôi đã sử dụng trình quản lý lịch sử của yui và mặc dù nó không hoạt động hoàn hảo trong tất cả các trình duyệt (đặc biệt là6), nó được nhiều người dùng và nhà phát triển sử dụng. Các mô hình họ sử dụng là khá linh hoạt quá.

+0

Tôi đã nghĩ về điều đó. Có lẽ lịch sử lộn xộn cũng là vấn đề về kiểm soát ứng dụng - đảm bảo người dùng kết thúc ở nơi ứng dụng dẫn dắt anh ta/cô ấy, vì vậy vị trí của anh ấy/cô ấy rõ ràng không? – KooiInc

8

Có 3 vấn đề mà có xu hướng để có được munged cùng bởi hầu hết các giải pháp:

  1. nút quay lại
  2. bookmarkability
  3. nút refresh

Các window.location.hash giải pháp dựa có thể giải quyết tất cả ba cho hầu hết các trường hợp: giá trị trong các bản đồ hash đến trạng thái của ứng dụng/trang web, do đó, người dùng có thể nhấn một trong "quay lại"/"chuyển tiếp"/"làm mới" và jum p đến trạng thái bây giờ trong băm. Họ cũng có thể đánh dấu vì giá trị trong thanh địa chỉ đã thay đổi. (Lưu ý rằng cần có iframe ẩn đối với IE liên quan đến băm không ảnh hưởng đến lịch sử của trình duyệt).

Tôi chỉ muốn lưu ý rằng một giải pháp iframe chỉ có thể được sử dụng mà không cần theo dõi window.location.hash để có giải pháp rất hiệu quả.

Bản đồ của Google là một ví dụ tuyệt vời về điều này. Nhà nước bị bắt cho mỗi hành động của người dùng là quá lớn để được đặt vào window.location.hash (bản đồ centroid, kết quả tìm kiếm, vệ tinh vs xem bản đồ, cửa sổ thông tin, vv). Vì vậy, họ lưu trạng thái vào một biểu mẫu được nhúng trong một ẩn iframe. Ngẫu nhiên điều này cũng giải quyết được vấn đề "làm mới". Chúng giải quyết riêng tính năng đánh dấu trang qua nút "Liên kết tới trang này".

Tôi chỉ nghĩ rằng đáng giá khi biết/tách các miền vấn đề bạn đang nghĩ đến.

+0

4 vấn đề thực sự. Bạn đã bỏ lỡ "trạng thái". – T9b

2

Tất cả nội dung đó đều quan trọng để hỗ trợ đầy đủ các trình duyệt, nhưng hy vọng nhu cầu cho nó sẽ biến mất. IE8 và FF3.6 đều giới thiệu hỗ trợ cho onhashchange. Tôi tưởng tượng rằng những người khác sẽ làm theo. Nó sẽ là một ý tưởng tốt để kiểm tra sự sẵn có của chức năng này trước khi sử dụng timeouts hoặc iframe, vì nó thực sự là giải pháp đẹp nhất hiện nay - và thậm chí nó hoạt động trong IE!

Các vấn đề liên quan