diff --git a/frontend/src/components/File/FileList.vue b/frontend/src/components/File/FileList.vue
index 2d2fc93c..a289b59a 100644
--- a/frontend/src/components/File/FileList.vue
+++ b/frontend/src/components/File/FileList.vue
@@ -22,6 +22,21 @@
             </el-button>
           </template>
         </el-popover>
+        <el-popover v-model="isShowRename">
+          <el-input v-model="name" :placeholder="$t('Name')" style="margin-bottom: 10px"/>
+          <div style="text-align: right">
+            <el-button size="small" type="warning" @click="onRenameFile">
+              {{$t('Confirm')}}
+            </el-button>
+          </div>
+          <template slot="reference">
+            <el-button v-if="showFile" type="warning" size="small" style="margin-right: 10px;"
+                       @click="onOpenRename">
+              <font-awesome-icon :icon="['fa', 'redo']"/>
+              {{$t('Rename')}}
+            </el-button>
+          </template>
+        </el-popover>
         <el-button v-if="showFile" type="success" size="small" style="margin-right: 10px;" @click="onFileSave">
           <font-awesome-icon :icon="['fa', 'save']"/>
           {{$t('Save')}}
@@ -100,7 +115,8 @@ export default {
       showFile: false,
       name: '',
       isShowAdd: false,
-      isShowDelete: false
+      isShowDelete: false,
+      isShowRename: false
     }
   },
   computed: {
@@ -180,6 +196,24 @@ export default {
       this.$message.success(this.$t('Deleted successfully'))
       this.isShowDelete = false
       this.onBackFile()
+    },
+    onOpenRename () {
+      this.isShowRename = true
+      const arr = this.currentPath.split('/')
+      this.name = arr[arr.length - 1]
+    },
+    async onRenameFile () {
+      let newPath
+      if (this.currentPath === '') {
+        newPath = this.name
+      } else {
+        const arr = this.currentPath.split('/')
+        newPath = arr[0] + '/' + this.name
+      }
+      await this.$store.dispatch('file/renameFile', { path: this.currentPath, newPath })
+      this.$store.commit('file/SET_CURRENT_PATH', newPath)
+      this.$message.success(this.$t('Renamed successfully'))
+      this.isShowRename = false
     }
   },
   created () {
diff --git a/frontend/src/i18n/zh.js b/frontend/src/i18n/zh.js
index f5ed1324..1c345f61 100644
--- a/frontend/src/i18n/zh.js
+++ b/frontend/src/i18n/zh.js
@@ -64,6 +64,7 @@ export default {
   'Item Threshold': '子项阈值',
   'Back': '返回',
   'New File': '新建文件',
+  'Rename': '重命名',
 
   // 主页
   'Total Tasks': '总任务数',
@@ -281,6 +282,7 @@ export default {
   'username already exists': '用户名已存在',
   'Deleted successfully': '成功删除',
   'Saved successfully': '成功保存',
+  'Renamed successfully': '重命名保存',
   'You can click "Add" to create an empty spider and upload files later.': '您可以点击"添加"按钮创建空的爬虫，之后再上传文件。',
   'OR, you can also click "Upload" and upload a zip file containing your spider project.': '或者，您也可以点击"上传"按钮并上传一个包含爬虫项目的 zip 文件。',
   'NOTE: When uploading a zip file, please zip your spider files from the ROOT DIRECTORY.': '注意: 上传 zip 文件时，请从 根目录 下开始压缩爬虫文件。',
diff --git a/frontend/src/store/modules/file.js b/frontend/src/store/modules/file.js
index b5412c20..abdf5638 100644
--- a/frontend/src/store/modules/file.js
+++ b/frontend/src/store/modules/file.js
@@ -63,6 +63,11 @@ const actions = {
     const { path } = payload
     const spiderId = rootState.spider.spiderForm._id
     return request.delete(`/spiders/${spiderId}/file`, { path })
+  },
+  renameFile ({ rootState }, payload) {
+    const { path, newPath } = payload
+    const spiderId = rootState.spider.spiderForm._id
+    return request.post(`/spiders/${spiderId}/file/rename`, { path, new_path: newPath })
   }
 }