使用Axure+svn+httpd搭建自己的“在线”画图工具

一、为什么要画图？

随着经验、软件复杂程度的提升，我们程序员也一定会越来越注重文档编写，文档写过程中呢，我们就不可避免的要去做一些画图工作以梳理复杂的业务。画图可以直观的展现你的设计思路，从而降低沟通成本。作为架构师，我使用过Axure画过不少架构设计图、功能设计图，甚至通过画图来帮我们消化学习到的新知识。

案例1：那些年，我画的架构图：

案例2：那些年，我学的多线程

本节子涵就来教大家如何搭建自己的“在线”画图工具。本节涉及到的软件包含：

• Axure：众所周知，Axure RP是一款专业的快速原型设计工具，是产品经理最常使用的经典工具之一。设计师们可以利用软件内的组件快速设计出产品原型，本身提供强大的交互支持，设计出的原型和实际产品在交互上体验感几乎没有区别。另外,软件也支持多人协作模式和版本控制管理的功能 。”
• SVN：一款简单的版本管理工具，非常适合普通大众使用。

二、Axure团队项目搭建

​1、Axure打开一个rp文件，选择团队》从当前文件创建团队项目：
​

2、接下来设置存储在SVN上的文件路径，团队项目名称，以及地存放原型的路径。点击“创建”，就可以创建成功了。

​

​​注意事项：svn提供的默认协议是svn（默认端口为3690），在创建Axure团队项目的使用，经过反复折腾，发现无法使用svn协议。因此需要安装Apache完成svn协议的转发。(见本小节第四部分)

三、Axure团队项目拉取

1、打开Axure，点击“团队”》“获取并打开团队项目”；

注意：Team Directory的路径为团队项目创建时的路径+团队名。否则，会提示报错：This is not a valid team project location. Please select a …

四、​搭建Apache服务使用http协议访问svn

[danger] 如果你的svn服务已经支持http访问，则无需进行这个步骤。

安装httpd

使用Apache HTTP服务将svn协议转成http协议，需要安装httpd和mod_dav_svn

yum install httpd mod_dav_svn -y
复制代码

配置httpd

添svn.conf配置

增加配置文件/etc/httpd/conf.d/svn.conf：

#创建并编辑配置文件
vim /etc/httpd/conf.d/svn.conf

# 添加内容
<Location />
        DAV svn
        SVNPath /data/work/svn/
        AuthType Basic
        AuthName "Authorization Realm"
        AuthUserFile /data/work/svn/passwdfile
        AuthzSVNAccessFile /data/work/svn/conf/authz
        Require valid-user
        SVNAdvertiseV2Protocol Off
</Location>
复制代码

配置http用户名密码认证文件 /data/work/svn/passwdfile

htpasswd -cb /data/work/svn/passwdfile user password
复制代码

用htpasswd 创建账号(user)、密码(password)，这里的账号密码需要和svn服务器中/data/work/svn/passwd文件的一致。

配置/etc/httpd/conf/httpd.conf

vim /etc/httpd/conf/httpd.conf
# 这里需要配置Listen和ServerName
Listen = 8369
ServerName = 127.0.0.1:8369
复制代码

设置防火墙和Selinux

# 因为httpd的8369端口不对外开放，所以可以不开放这个端口。如果要放开可以用
firewall-cmd --zone=public --remove-port=8369/tcp --permanent
firewall-cmd --reload

# 设置selinux开放httpd
semanage port -a -t http_port_t -p tcp 8369
semanage permissive -a httpd_t
复制代码

设置完成后重启httpd

systemctl restart httpd
复制代码

设置权限

chown apache:apache -R /data/work/svn
复制代码

测试http方式访问svn

最后，我们使用http协议链接访问svn中的文件：http://ip:8369/doc/codePic/ 。输入账号密码，访问成功页面如下：

五、总结一下

• Axure不仅可以用来画原型，画架构图、流程图也不错哦~
• 使用Axure团队项目，可以借助svn实现多人、多机协作画图；
• 使用Axure+SVN构建团队项目，SVN支持http协议，需要安装并配置httpd。

最后，祝大家画图愉快~