首页 > 解决方案 > 环回 3 文件存储连接器

问题描述

我是环回的新手,我有一个表单,其中包含一些带有文件上传的字段。现在我可以使用带有 mysql 数据库的 PersistedModel 来存储字段值。

我也想将文件上传保存在某个位置。如何做到这一点任何人都可以举例说明。我已经看过环回 3 存储文档,但我无法获得。我正在使用 dropzone js 进行文件上传。这是我的代码

<form  id="myForm" novalidate>
   <div class="form-row">
      <div class="form-group col-md-6">
         <input type="text" class="form-control" id="firstname" name="firstname" placeholder="First Name" required>
      </div>
   </div>
   <div class="form-row">
      <div class="form-group col-md-6">
         <input type="email" class="form-control" id="email" name="email" placeholder="example@gmail.com" required>
         <div class="invalid-feedback">Please Enter a Valid Email Id.</div>
      </div>
      <div class="form-group col-md-6">
         <input type="text" id="role" name="role" class="form-control" placeholder="Job Role" >
      </div>
   </div>
   <div class="form-row">
      <div class="form-group col-md-12">
         <textarea class="form-control" id="message" name="message" placeholder="Message" required></textarea>
      </div>
   </div>
   <div id="resume" class="dropzone form-control"></div>
   <input type="submit" class="btn btn-primary mt-10" id="item-submit" value="submit">
</form>

脚本

<script type='text/javascript'>
   $("#myForm").submit(function(e) {
      e.preventDefault();
      var parms = {
   firstname : $("#firstname").val(),
   email : $("#email").val(),
   role : $("#role").val(),
   message: $("#message").val()
   };
   $.ajax({
   method: 'POST',
   url:  "http://localhost:3000/api/careers",
   async: false,
   dataType : "json",
   contentType: "application/json; charset=utf-8",
   data: JSON.stringify(parms),
   success: function(data){
   console.log('Submission was successful.');
   // location.reload();
   console.log(data);
   }, error: function (data) {
      console.log('An error occurred.');
      console.log(data);
         },   
      })
   });
</script>

标签: jqueryajaxloopbackjsstronglooploopback

解决方案


我也有类似的实现检查一下

但是,您需要在 datasources.json 文件中指定您正在使用的存储容器这是我对存储连接器的实现。

localstorage: {
    "name": "localstorage",
    "connector": "loopback-component-storage",
    "provider": "filesystem",
    "root": "./files/",
    "nameConflict": "makeUnique",
    "maxFileSize": "104857600"
}

并在 model-config.json 中添加:

"Container": {
    "dataSource": "localstorage",
    "public": true
},

也不要忘记在common/models文件夹中添加Container.json ,如下所示:

{
   "name": "Container",
   "base": "Model"
}

现在您将能够将文件发布到“/api/container”路径


推荐阅读