Auto Save（自动保存）案例和情景分析

来人人都是产品经理【起点学院】，BAT实战派产品总监手把手系统带你学产品、学运营。

auto save 这个看似小小的功能也有丰富的设计点。以下，通过对几款产品auto save的使用情况来总结分析auto save该如何使用。

首先，不妨先考虑不同的使用场景，带着问题来看案例。哪些场景下需要auto save?

• 编辑文档->保存草稿/完成/提交；
• 编辑文档（不需要提交的文档）；
• 编辑文档->跳转到其他页面；
• 编辑文档->出事故（电脑死机/断电等）。

特殊情况：两个用户在不同地方编辑同一个文档。

案例分析：

以下先从几个官方设计文档出发，看看其他产品是怎么做的，再从个人使用角度分析几款产品，最后总结分析结果。

一，Mac OS X Lion:

自动保存：

• 在工作暂停间隙间自动保存；
• 如果没有连续工作没有暂停，则每隔5分钟自动保存一次；
• 在后台默默地保存，没有提示和进度条，不会干扰用户；

恢复版本：

• 自动保存的版本排列成左右两部分，左边是目前的版本，右边是之前自动保存的版本，方便用户做对比；
• 可以回退到之前的任何一个版本或者将之前版本中的一部分（如图/文字等）复制到当前版本中。

上图为Mac OS X Lion中的Versions Browser，用于恢复自动保存的文件，其中：

1. 为当前版本；
2. 为一系列的历史版本：用户可以从历史版本中复制所需的任何元素（如图和文字）到新的版本中；
3. 为恢复按钮：按下可以用历史版本替换当前版本；
4. 为时间轴：历史版本的时间轴。点击时间轴上的日期可以查看该日期的历史版本；

参考：

二，Microsoft：

自动保存：

1. 修改文档30秒后会自动保存。如果没有修改动作，则自动保存不会发生；
2. 如果你在编辑文档时，另一个人在同步编辑它（如在线文档），则任何一个人的修改都会在自动保存发生后更新在另一个人正在编辑的文档中;（附上原文，以免翻译错： If someone else has updated the same record while you’re editing it, those changes will be retrieved and displayed in the form when auto-save occurs.）

参考：

三，WordPress:

自动保存：

• 每隔几秒自动保存一次；
• 可以看到上次自动保存的时间，并且可以手动保存；
• 所有自动保存的版本都留着，可以随时回退到其中的任何一个版本；

对于已发布的内容：

• 对于已发布的内容，自动保存仍然运行，但是不会覆盖已发布的内容；
• 直到点击“更新”按钮才会将更改内容发布到网上；

编辑中：

• 当你编辑文档时突然断网，或者不小心点进另一个页面，WordPress.com会自动将你编辑的内容存到浏览器的本地存储（local storage）中，这样当你再次打开编辑器的时候就会看到上次编辑的内容；

参考：

四，Rhino:

自动保存：

• 每隔一段时间自动保存一次；
• 当用户手动关闭文档之后，自动保存的版本会被清空；
• 如果是非正常关闭，如电脑死机或者断电，自动保存的版本会保存在硬盘上；
• 当你打开Rhino时，如果Rhino检测到一个自动保存的文件，它会提示你保存该文件；

参考：

实际体验

以上都是参考的官方设计文档，接下来亲自体验下身边的产品来直观感受下auto save。

一、Lofter

Lofter的自动保存能力让我印象深刻，因为我编辑了内容后没保存直接关掉网页，下次打开lofter点击“文字”按钮时，发现我上次编辑没保存的内容都在。

一般情况下，发文字的按钮如下，点击后进入下面的编辑页面。可以看到发布按钮有更多选项，其中包括“保存为草稿”。如果选择保存为草稿，那么相当于手动保存，文章会出现在草稿箱中。

而如果你没有点击任何按钮，直接关掉网页，那么下次打开lofter时，文字按钮有了一个小小的变化，那就是右上角像折纸一样往里折了一角。此时点击文字按钮，出来的编辑框中有你上次未保存的内容，你可以继续编辑。

选择“保存为草稿”，则保存内容如下：

这时编辑草稿，多写“加几个字加几个字”，然后，再次不保存的情况的关掉网页。猜猜下一次打开草稿是什么样的。

再次打开草稿箱的时候，依然看的是上图，发现“加几个字加几个字”并没有出现在草稿中。但是，当我点击“编辑”按钮调出编辑器的时候，奇迹发生了！！没保存的那几个字出现在了编辑器中！！如下图所示。

整理下Lofter的保存流程，制作流程图如下：

这个案例让我发现，编辑器是个多么神奇的存在，可以保存任何我没保存的内容。

二、简书

简书的自动保存超级简单，比Lofter少了一个层级，流程图如下：

简书中的编辑器即草稿箱，每次修改都会随时保存，“发布文章”按钮自动变成“保存中...”以提示正在保存。

点击“发布文章”按钮，文章发布，按钮变成“已发布”。

对于“已发布”的文章，再次编辑时，依然会出现“保存中...”字样提示正在保存。已发布的文章自动保存后，按钮变成如下的“发布更新”，再次点击后才会变成“已发布”。

这个案例让我知道一个保存状态可以有这么多种，自动保存和手动保存也可以结合得如此天衣无缝。

三、Medium

Medium每隔一段时间自动保存一次，并且保留多个版本，可以看到在publish按钮旁边的“...”按钮上，有个“revision history”的选项，点击之后可以看到许多autosaved的版本，用户可以根据需要回退到其中任何一个版本。

这个案例与其他博客的差异点就在于保存了多个版本。这与Photoshop中的“历史记录”差不多，给用户提供更多回退的选择，但也占用更多系统资源。

四、Qzone说说

Qzone发表说说的自动保存内容自动同步到其他页面的发说说文本框，流程图如下：

在“个人中心”中，有个发说说的文本框，输入以下内容：

此时不点击发表按钮（同时也没有保存按钮），直接进入“我的主页”，找到“我的说说”，可以发现这里也有一个发说说的文本框，并且已经填写了我在“个人中心”的文本框中输入的内容。这时，如果在这里修改文本框中的内容，回到“个人中心”，会发现其中的内容也被修改了。这两个文本框的内容保持一致。

这个案例告诉我们，“帮人帮到底，送佛送到西”，自动保存就要让用户在任何一个入口都能看到上次未手动保存的内容。

总结：

一. 自动保存的时间点可以有以下几种情况：

• 每隔一段时间自动保存；
• 在用户暂停工作时保存；
• 每次修改立即自动保存；

二. 自动保存版本的保留：

• 仅保留最近一次自动保存的版本；
• 保留多个自动保存的版本，以便回退到其中任何一个版本；

三. 自动保存版本的清空：

• 在手动保存之后，清空之前所有自动保存的版本；
• 手动关闭文档后清空所有自动保存的多个版本；
• 仅清空最新版本之外的其他版本；

一个小小的功能，也有如此多的设计点。多观察，多分析，多记录和总结，希望可以在交互的道路上越走越远。

#专栏作家#

Snow，微信公众号：用户体验报告。人人都是产品经理专栏作家，东南大学工业设计研究生，每周更新一篇原创产品体验报告，分析产品设计体验的好坏，以此进步。愿与大家共同进步。

WordPress禁用文章历史修订版本、自动保存和自动草稿功能

WordPress后台编辑文章，或修改文章时候经常会不停地自动保存很多修订版本，每一次修订版本都会写入数据库中，这样的好处就是当你在写文章时候，如果没有Ctrl+s保存的习惯，系统自动帮你定时保存，以免意外情况下关闭编辑器而导致文章内容丢失。但缺点是会在数据库产生很多无用的数据，使你的数据库越来越臃肿，给数据库带来不必要的负担，拖慢网站速度。所以，这种功能对中小型网站其实并没有太大的意义，往往我们并不需要这种人性化的功能。

版本修订历史（Post Revisions）是在文章发布后，每次点击“更新”时向数据库添加一条版本修订历史记录。这种方式和wiki很像。会导致数据库臃肿，文章URL不够美观，文章ID不连续等问题。然而，由于个人博客很少需要保留版本记录，这个功能显得有些鸡肋。

自动保存（Auto-Save）就是在你新编辑发布文章之前，系统默认会定时保存编辑的文章内容。默认每1分钟一次，相当的频繁。虽然应该存在，但WordPress的处理方式实在有些奇怪，自动保存居然也要占用文章ID，并且默认60s保存一次，这样会造成一篇文章写下来可能会消耗几十个ID，并且在数据库中存入了大量的无用信息。

自动草稿（Auto-Draft）是在WordPress3.0之后新增的功能，在点击“写文章（新建文章）”后（不确定是否只是这种情况）自动保存的草稿，会被WordPress定期清除，但占据的ID也随之失去。这个功能也没有太大的用处，属于鸡肋功能。

要想关闭WordPress修订版本、自动保存和自动草稿功能，首先我们要知道控制他们的代码在哪里，控制他们的代码是什么。只有精准的定位到问题的所在，才能根据所需进行修改。（注：以下几种方法是在 WordPress 4.9.4 版本实测有效）

WordPress文章禁用版本修订历史（revision）和自动保存（autosave）的四种方法

方法一、通过修改 WordPress 程序根目录下wp-config.php配置文件实现功能禁用

打开根目录下的 wp-config.php 文件，在 “define(‘WP_DEBUG’, false);” 后边添加下面的两行代码：

/**  WordPress 编辑器关闭自动保存和历史修订版本选项。  本项注释掉即可开启。 */
define(\'WP_POST_REVISIONS\', false);//禁用历史修订版本post_revision
define(\'AUTOSAVE_INTERVAL\', 86400);//设置自动保存时间设置为一天

// 不保存任何版本（除了自动保存的版本）
define(\'WP_POST_REVISIONS\', false);
//保存所有修订版本
define(\'WP_POST_REVISIONS\', true);
// 保存 n 个修订版本
define(\'WP_POST_REVISIONS\', n);
//禁用自动保存间隙时间
define(‘AUTOSAVE_INTERVAL’, false);
//自动保存10小时一次
define(\'AUTOSAVE_INTERVAL\', 36000);
//设置自动保存间隔/秒
define(‘AUTOSAVE_INTERVAL’, 120);

方法二、找到 wp-includes/defaut-contants.php 文件，修改如下代码：

注意：下次升级WordPress程序时，更新后会导致代码被覆盖掉，需要重新添加。

//禁用版本修订历史和自动保存
// 修改前
if ( !defined( \'AUTOSAVE_INTERVAL\' ) )
define( \'AUTOSAVE_INTERVAL\', 60 );  //这个是自动保存
if ( !defined(\'WP_POST_REVISIONS\') )
define(\'WP_POST_REVISIONS\', true ); //这个是版本修订历史
// 修改后
if ( !defined( \'AUTOSAVE_INTERVAL\' ) )
define( \'AUTOSAVE_INTERVAL\', false ); //禁用自动保存
if ( !defined(\'WP_POST_REVISIONS\') )
define(\'WP_POST_REVISIONS\', false ); //禁用版本修订历史

其中 autosave 的60为自动保存时间间隔，单位为s，可以修改为更大的数值或修改为false禁用。

以上二种方法并没有 完全禁用掉自动保存 。因为在没有点击“更新”文章之前就离开编辑的页面时，会弹出“系统可能不会保存你所做的更改”的提示窗口。所以还需要修改 wp-admin/post-new.php和wp-admin/post.php 这两个文件。将这两个文件中的 wp_enqueue_script( \'autosave\' ); 注释掉。其中post.php还要把前面一行的if语句注释掉。

打开 wp-admin/post.php 文件，搜索并注释

//if ( \'attachment\' !== $post_type )
//  wp_enqueue_script(\'autosave\');

打开 wp-admin/post-new.php 文件，搜索并注释

//wp_enqueue_script( \'autosave\' );

方法三、当前使用主题文件夹下的 functions.php 文件php结束标记 ?> 前加上如下代码

//禁用文章自动保存（方法一）
add_action( \'admin_print_scripts\', create_function( \'$a\', \"wp_deregister_script(\'autosave\');\" ) );
//禁用文章自动保存（方法二）。注：方法一与方法二任选其一
add_action(\'wp_print_scripts\',\'fanly_no_autosave\');
function fanly_no_autosave(){
wp_deregister_script(\'autosave\');
}
//禁用文章修订版本
add_filter( \'wp_revisions_to_keep\', \'fanly_wp_revisions_to_keep\', 10, 2 );
function fanly_wp_revisions_to_keep( $num, $post ) { return 0;}

另外你如果有自己定义的文章类型，可以使用下面这段代码来禁止特定文章类型的修订版本。

//只禁用某种文章类型的修订版本
add_filter( \'wp_revisions_to_keep\', \'fanly_wp_revisions_to_keep\', 10, 2 );
function fanly_wp_revisions_to_keep( $num, $post ) {
if ( \'post_type\' == $post->post_type ) { //post_type为你要禁止修订版本的文章类型
return 0;
}
return $num;
}

方法四、使用“ Super Switch ” 插件禁止修订版本和自动保存

1、在 “安装插件”页面的搜索框中，输入 Super Switch ——》 回车 ——》 找到 Super Switch ——》 点击“现在安装” ——》 启用“ Super Switch ” 插件。

2、打开 Super Switch（超级开关）插件，将修订版本和自动保存的选项设置为“禁止”。

WordPress文章禁用自动草稿（auto-draft）功能

打开 wp-admin/includes/post.php ，找到如下代码：

/*
$post_id = wp_insert_post( array( \'post_title\' => __( \'Auto Draft\' ), \'post_type\' => $post_type, \'post_status\' => \'auto-draft\' ) );
$post = get_post( $post_id );
*/

将其注释，并添加以下代码：

/* 修改开始*/
global $wpdb;
global $current_user;  // 获取当前登录管理用户
$post = $wpdb->get_row( \"SELECT * FROM $wpdb->posts WHERE post_status = \'auto-draft\' AND post_type = \'$post_type\' AND post_author = $current_user->ID ORDER BY post_date ASC, ID ASC LIMIT 1\" );  // 获取最早一条自动草稿
if ( !$post ) {        
//没有记录添加一条草稿记录 
$post_id = wp_insert_post( array( \'post_title\' => __( \'Auto Draft\' ), \'post_type\' => $post_type, \'post_status\' => \'auto-draft\' ) );
$post = get_post( $post_id );
}
/* 修改结束 */

ok，到这里，差不多结束了，如果你还想删除数据库早期已经保存的文章数据，可以参考下面的文章。