如何将数据持久化

在实际开发中，上传用户头像，上传文件等是一些很常见的功能，上传的这些文件将如何存储，在Methodot平台，是如何做到这些数据的持久化呢？为此，我们简单改造一下我们的Java + Mysql模板来简单说明一下数据卷的使用方式。

数据卷是Methodot提供的一种存储抽象，使用数据卷可以将您的数据和应用程序相对独立，多个应用程序可使用同一个数据卷来共享数据卷内部的数据。应用本身的状态（起、停或更新）都不会影响到数据卷内的数据。

1. 首先，使用云端编码打开Java代码

   

2. 在src/.../servlet/CTGServlet.java文件中，将class添加@MultipartConfig

   @MultipartConfig
   public class CTGServlet extends HttpServlet {
   
   }

   并改造doPost方法代码段如下(为使用该功能，需要更新一下pom.xml中依赖版本)

   
           javax.servlet.jsp
           javax.servlet.jsp-api
           2.3.0
           provided
   

   protected void doPost(HttpServletRequest req, HttpServletResponse resp) throws ServletException, IOException {
       String path = req.getRequestURI();
   
       OutputStream out = null;
       InputStream in = null;
       if (path.contains("/upload")) {
           Part part = req.getPart("file");
           try {
               File file = new File("/test/download/file/test.html");
   
               out = new FileOutputStream(file);
               in = part.getInputStream();
               int read = 0;
               byte[] bytes = new byte[4096];
               while ((read = in.read(bytes)) != -1) {
                   out.write(bytes, 0, read);
               }
               file.setReadable(true,false);               
           } catch (FileNotFoundException e) {
               e.fillInStackTrace();
           } finally { 
               out.close();
               in.close();
           }
   
       }
   
       if (path.contains("/cloudtogo")) {
           resp.setHeader("Content-Type","application/json;charset=utf8");
           CTGService ctgService = new CTGService();
   
           PrintWriter printWriter = resp.getWriter();
           printWriter.print(ctgService.getShowParam().toString());
       }
   
   }

3. 在webapp/.../index.html文件中添加脚本引入upload.js与上传文件入口

   
       
       
       
       
   
   
   已连接到MySQL(JAVA): #
    #
    #
    #
    #
    #
    #
   
       
   
           
   id
           
   framework
           
   language
           
   create_time
       
   
   上传文件 #
   

4. 在webapp/js/下新建upload.js文件

   $(document).ready(function () {
           var data = new FormData(),
               $file = document.querySelector("#file"),
               $showFile = document.querySelector("#showFile");
           $file.addEventListener("change",function(e) {
                   var files = e.target.files;
                   if (files && files[0]) {
                       data.append("file",files[0]);
                       $.ajax({
                           url: "/upload",
                           type: 'post',
                           data: data,
                           enctype: "multipart/form-data",
                           processData: false,
                           contentType: false,
                           success: function(data)
                           {
                               alert("您的文件已上传");
                           }
                       });
                   }
           });
   
           $showFile.addEventListener("click", function(e) {
               $.ajax({
                   url: "/file",
                   type: "get",
                   data: "",
                   processData: false,
                   contentType: false,
                   success: function(data) {
                       console.info(data.length);
                       //alert(data.data);
                   }
               });
           })
   });

5. 在webapp/WEB-INF/web.xml文件中\<servlet-mapping>添加新的/upload配置

   
       ctg
       /cloudtogo
       /upload
   

6. 代码修改部分就配置好了，在云端编码将以上修改 提交并推送后，修改原有架构图中java组件配置，增加存储路径的配置,这里的路径需要根据步骤2中doPost方法改造（将上传的文件存储于/test/download/file/test.html）,于是在存储路径栏中填入/test/download/file，其余不变，保存此架构图，并发布

   

7. 在发布页配置中，您会发现比默认的模板新增了java>存储路径的配置

   

8. 点击下拉图标，您可以在此新建数据卷，或选择已经创建好的数据卷（数据卷的创建）

   

9. 选择好数据卷后，您就可以发布此架构图，发布成功后查看如下

   

10. 此处我们上传一个本地的test.html文件

    

接下来的步骤将展示如何使用项目内的数据卷,查看我们上传的html文件 #

1. 在此项目内，设计模块下点击新建架构图

   

2. 在蓝图设计中，选择镜像组件拖入右侧区域

   

3. 选择nginx镜像（此处可选择我们平台内部已有的nginx镜像）

   

4. 配置nginx, 配置网络服务监听8080端口，配置存储路径：/test/download/file,配置映射配置文件到/etc/nginx/conf.d/8080.conf

   

   其中8080.conf的内容如下

   server {
       listen 8080;
       root /test/download/file;
       index test.html;
       location / {
       }
   } 

5. 保存蓝图发布，访问时，您就可以看到之前应用上传的test.html的文件内容了