Как форма SO запоминает предыдущие входные значения? - PullRequest
13 голосов
/ 01 мая 2010

Я заметил, что часть Заголовок или Тело запоминается, если я возвращаюсь на страницу Задать вопрос , нажав Назад кнопка моего браузера.

Эта функция доступна во всех протестированных мной браузерах, но не существует для форм в моих собственных проектах.

Как мне подойти к этому эффекту?

UPDATE

Я до сих пор не имею никакой подсказки, но угадайте, что какой-то клиентский кеш включен заголовками http или javascript?

Ответы [ 4 ]

6 голосов
/ 03 мая 2010

Это связано со свойствами кэширования вашей страницы.

1) Если браузеру разрешено кэшировать вашу страницу, он также запомнит поля формы.

2) Если не разрешено кэшировать страницу, она все забудет.

Обычно динамически генерируемые страницы попадают в категорию 2, поэтому вы не видите кеширование. Это действительно определяется заголовками HTTP (особенно Cache-Control и Last-Modified или использованием E-Tags ). Для объяснения того, как ваш браузер определяет кэширование (нетривиально!), Смотрите, например:

http://www.webscalingblog.com/performance/caching-http-headers-last-modified-and-etag.html

Но проще всего поместить форму на статическую HTML-страницу, тогда ваш веб-сервер все обработает.

4 голосов
/ 03 мая 2010

Вам нужно найти механизм для установки параметров Cache-Control на страницах, которые вы обслуживаете.

Вы не указываете, как вы обслуживаете веб-страницы. Но вот пример страницы ASP, которая приводит к исчезновению содержимого формы при возврате на страницу с помощью кнопки «назад» (это поведение, которое вы испытываете в настоящее время):

<% Response.CacheControl = "no-cache" %>    
<% Response.AddHeader "Pragma", "no-cache" %>    
<% Response.Expires = -1 %>    
<HTML>    
<HEAD>    
<TITLE>Test page</TITLE>    
</HEAD>      
<BODY>    
Type some text into this box, click SO followed by the BACK button:   
<input type="text" name="title" value="" />   
<a href="http://www.stackoverflow.com">SO</a>    
<p>    
When you get back the text you typed will be gone.   
</BODY>    
</HTML>    

Обратите внимание на верхние 3 строки, сделайте пару небольших изменений ...

<% Response.CacheControl = "private" %>    
<HTML>    
<HEAD>    
<TITLE>Test page</TITLE>    
</HEAD>      
<BODY>    
Type some text into this box, click SO followed by the BACK button:   
<input type="text" name="title" value="" />   
<a href="http://www.stackoverflow.com">SO</a>    
<p>    
When you get back the text you typed will still be there   
</BODY>    
</HTML>    

Теперь содержимое поля ввода сохраняется. Это поведение, которое вы пытаетесь достичь. Там могут быть дополнительные параметры, которые вам нужно установить в зависимости от вашего конкретного потребности и значения по умолчанию, применяемые вашим сервером.

Более подробная информация о Cache-Control доступна по адресу:

Контроль кэша в ASP . Как и в большинстве вещей Microsoft, это только обсуждает IE.

Это руководство по Кэшированию представляет собой хорошее введение с примером кода для нескольких различных веб-серверов, включая PHP.

w3.org является ссылкой, которую вы действительно нужно учиться, особенно раздел 14.9 о Cache-Control.

Ключ к получению Вы ищете поведение при обслуживании страниц с правильной параметризацией управления кэшем.

1 голос
/ 03 мая 2010

Хотя я не могу дать много советов, заголовки http страницы «Задать вопрос» выглядят так:

HTTP/1.1 200 OK
Cache-Control: private
Content-Type: text/html; charset=utf-8
Content-Encoding: gzip
Vary: Accept-Encoding
Server: Microsoft-IIS/7.5
Set-Cookie: [EDITED AWAY}
Date: Mon, 03 May 2010 16:04:44 GMT
Content-Length: 4800

Я бы сравнил это с вашими собственными страницами / формами, особенно с любыми заголовками, касающимися кэширования и истечения срока действия.

0 голосов
/ 03 мая 2010

Там нет магии. Просто попробуйте следующий HTML:

<?xml version="1.0"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
    "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="en" lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
    <title>Test</title>
</head>
<body>
    <input type="text" name="title" value="" />
    <a href="http://www.google.com">Google</a>
</body>
</html>

Откройте его в браузере, введите текст, нажмите ссылку, а затем кнопку «Назад», и она запомнит значение. Протестировано и работает на IE8, FireFox 3.6, Chrome 4.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.
...