微信读书笔记与图书列表无法对应问题解决

src/App.vue

@@ -1,49 +1,54 @@
 <template>
   <div id="app" v-loading="loading" :element-loading-text="loadingText">
-    <options
-      :list="contentList"
-      :tmp-list="tmpList"
-      @submit="submit"
-      @parse="confirmFirstParse"
-      @reverse="reverseList"
-      @list-update="listUpdate"
-      @update-tag="updateTag"
-      @reset="reset"
-    />
-    <div class="editor radio flex-v">
-      <selected-text
-        :selected="checkedMemo.length"
-        :total="contentList.length"
-        :import-count="importCount"
-        :disabled="disabled"
-        @change="checkAllChange"
+    <div v-if="isElectron" id="taskBar">
+      Kindle To Flomo
+    </div>
+    <div class="app-body">
+      <options
+        :list="contentList"
+        :tmp-list="tmpList"
+        @submit="submit"
+        @parse="confirmFirstParse"
+        @reverse="reverseList"
+        @list-update="listUpdate"
+        @update-tag="updateTag"
+        @reset="reset"
       />
-      <div class="flex-1 overauto">
-        <draggable
-          v-model="contentList"
-          class="list-group"
-          tag="ul"
-          v-bind="dragOptions"
-          :disabled="dragDisabled"
-          @start="drag = true"
-          @end="drag = false"
-        >
-          <transition-group
-            type="transition"
-            :name="!drag ? 'flip-list' : null"
+      <div class="editor radio flex-v">
+        <selected-text
+          :selected="checkedMemo.length"
+          :total="contentList.length"
+          :import-count="importCount"
+          :disabled="disabled"
+          @change="checkAllChange"
+        />
+        <div class="flex-1 overauto">
+          <draggable
+            v-model="contentList"
+            class="list-group"
+            tag="ul"
+            v-bind="dragOptions"
+            :disabled="dragDisabled"
+            @start="drag = true"
+            @end="drag = false"
           >
-            <content-card
-              v-for="(item, index) in contentList"
-              :key="item.text + index"
-              class="list-group-item"
-              :input.sync="item.text"
-              :check.sync="item.checked"
-              :edit.sync="item.isEdit"
-              :info="item"
-              :disabled="disabled"
-            />
-          </transition-group>
-        </draggable>
+            <transition-group
+              type="transition"
+              :name="!drag ? 'flip-list' : null"
+            >
+              <content-card
+                v-for="(item, index) in contentList"
+                :key="item.text + index"
+                class="list-group-item"
+                :input.sync="item.text"
+                :check.sync="item.checked"
+                :edit.sync="item.isEdit"
+                :info="item"
+                :disabled="disabled"
+              />
+            </transition-group>
+          </draggable>
+        </div>
       </div>
     </div>
   </div>
@@ -77,6 +82,7 @@ export default {
         animation: 200
       },
       importCount: 0,
+      isElectron: !!process.env.IS_ELECTRON
     }
   },
   watch: {
@@ -246,12 +252,29 @@ export default {
   font-weight: bold;
 }
 #app {
-  padding: 10px;
-  background-color: #b7e6d6;
-  height: 100%;
-  box-sizing: border-box;
-  color: #2c3e50;
   display: flex;
+  flex-direction: column;
+  height: 100%;
+  #taskBar{
+    background-color: #b7e6d6;
+    height: 20px;
+    -webkit-app-region: drag;
+    text-align: center;
+    font-size: 12px;
+    line-height: 20px;
+    font-weight: bold;
+    user-select:none;
+  }
+  .app-body{
+    -webkit-app-region: no-drag;
+    padding: 10px;
+    background-color: #b7e6d6;
+    height: 0;
+    flex-grow: 1;
+    box-sizing: border-box;
+    color: #2c3e50;
+    display: flex;
+  }
   .editor {
     overflow: auto;
     padding: 10px;

src/components/Options/index.vue

@@ -218,14 +218,18 @@
       >
       </template>
     </div>
-    <el-dialog class="login-dialog" :visible.sync="showDialog" width="270px">
+    <el-dialog class="login-dialog" :visible.sync="showDialog" :close-on-click-modal="false" width="270px">
       <div class="iframe-box" v-loading="loading">
         <iframe
           v-if="showDialog"
           src="https://weread.qq.com/#login"
           frameborder="0"
         ></iframe>
       </div>
+      <div class="text-center" v-show="!loading">
+        <el-button type="text" style="color: #999999;" @click="showDialog = false">取消</el-button>
+        <el-button type="text" @click="getNotebooklist">我已登录</el-button>
+      </div>
     </el-dialog>
   </div>
 </template>
@@ -235,7 +239,7 @@ import readFile from '@/utils/readFile.js'
 import paresClip from '@/utils/paresClip.js'
 import readSQLite from '@/utils/readSQLite.js'
 import { Loading } from 'element-ui'
-import { getBookshelf, getBookMarkList, getReviewList } from '@/utils/weread.js'
+import { getNotebooklist, getBookMarkList, getReviewList } from '@/utils/weread.js'
 import axios from 'axios'
 export default {
   name: 'Options',
@@ -271,8 +275,6 @@ export default {
       showDialog: false,
       cookie: null,
       loading: false,
-      logout: false,
-      firstLoad: false,
     }
   },
   watch: {
@@ -307,43 +309,21 @@ export default {
         this.options.noEmptyLine = true
       }
     },
+    getNotebooklist(){
+      getNotebooklist()
+        .then(res => {
+          this.showDialog = false
+          this.loading = false
+          this.handleBooksData(res)
+        })
+        .catch((err) => {
+          this.loading = false
+        })
+    },
     importWeRead () {
       this.loading = true
       this.showDialog = true
-
-      const { session } = require('electron').remote
-      const filter = {
-        urls: ['https://weread.qq.com/*']
-      }
-      session.defaultSession.webRequest.onBeforeSendHeaders(
-        filter,
-        (details, callback) => {
-          if(!this.firstLoad){
-            const cookie = details.requestHeaders.Cookie
-            this.cookie = cookie
-            if (!this.logout) {
-              getBookshelf(cookie)
-                .then(res => {
-                  this.firstLoad = true
-                  this.showDialog = false
-                  this.loading = false
-                  this.handleBooksData(res)
-                })
-                .catch(({ errmsg }) => {
-                  this.loading = false
-                  this.firstLoad = false
-                  if (errmsg === '登录超时') {
-                    this.logout = true
-                    window.location.reload()
-                  }
-                })
-            } else {
-              this.loading = false
-            }
-          }
-          callback(details)
-        }
-      )
+      this.getNotebooklist()
     },
     importAppleBooks () {
       const loadingInstance = Loading.service({
@@ -368,7 +348,7 @@ export default {
         })
     },
     handleBooksData (bookList) {
-      this.bookList = bookList
+      this.bookList = bookList.reverse()
       const data = bookList[0]
       if(data.bookId) this.selectChange(data.title)
       this.options.book = data.title

src/utils/weread.js

@@ -1,18 +1,43 @@
-import { get_bookshelf, get_bookmarklist, get_reviewlist } from '@/utils/wereadRequest.js'
+import { get_bookshelf, get_bookmarklist, get_reviewlist, get_notebooklist } from '@/utils/wereadRequest.js'
 
-export function getBookshelf(cookie) {
+function clearCookies(){
+  const { session } = require('electron').remote
+  return new Promise((r, j) => {
+    session.defaultSession.cookies.get({ url: 'https://weread.qq.com/' }).then(res => {
+      try {
+        for (var i = 0; i < res.length; i++) {
+          session.defaultSession.cookies.remove(
+            'https://weread.qq.com/',
+            res[i].name,
+            (error) => {
+              //判断是否error
+              console.log('cookie 清除出错')
+            }
+          )
+        }
+        r()
+      } catch (error) {
+        j()
+      }
+    }).catch(() => j())
+  })
+}
+
+
+export function getNotebooklist() {
   return new Promise((resolve, reject) => {
-    get_bookshelf(cookie).then(res => {
-     const list = res.recentBooks.map(i => {
+    get_notebooklist().then(res => {
+     const list = res.books.map(i => {
         return {
-          title: i.title,
+          title: i.book.title,
           loaded: false,
           bookId: i.bookId,
           texts: []
         }
      })
      resolve(list)
     }).catch(e => {
+      if(e === 401) clearCookies()
       reject(e)
     })
   })
@@ -36,9 +61,9 @@ export function getBookMarkList(bookId) {
   })
 }
 
-export function getReviewList(params, cookie) {
+export function getReviewList(params, ) {
   return new Promise((resolve, reject) => {
-    get_reviewlist(params, cookie).then(res => {
+    get_reviewlist(params).then(res => {
       let list = res.reviews.map(i => {
         return {
           text: i.review.abstract,

src/utils/wereadRequest.js

@@ -1,25 +1,27 @@
 import axios from 'axios'
 axios.defaults.baseURL = 'https://i.weread.qq.com'
 
-function getUid (cookie) {
-  let uid
-  cookie.split(';').forEach(ele => {
-    let [key, value] = ele.trim().split('=')
-    if (key === 'wr_vid') {
-      uid = Number(value)
-    }
+function getUserVid() {
+  return new Promise((r, j) => {
+    const { session } = require('electron').remote
+    session.defaultSession.cookies.get({ url: 'https://weread.qq.com/' }).then(res => {
+      if (res && res.length) {
+        const vid = res.find(i => i.name === 'wr_vid')
+        if (vid) r(vid.value)
+        j(false)
+      }
+      j(false)
+    })
   })
-  return uid
 }
 
+
 const headers = {
   Host: 'i.weread.qq.com',
   Connection: 'keep-alive',
   'Upgrade-Insecure-Requests': 1,
-  'User-Agent':
-    'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.103 Safari/537.36',
-  Accept:
-    'text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3',
+  'User-Agent': 'Mozilla/5.0 (Windows NT 10.0; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/73.0.3683.103 Safari/537.36',
+  Accept: 'text/html,application/xhtml+xml,application/xml;q=0.9,image/webp,image/apng,*/*;q=0.8,application/signed-exchange;v=b3',
   'Accept-Encoding': 'gzip, deflate, br',
   'Accept-Language': 'zh-CN,zh;q=0.9,en;q=0.8',
 }
@@ -78,18 +80,23 @@ export const get_bestbookmarks = bookId => {
   })
 }
 // 获取书架上的书籍列表
-export const get_bookshelf = (cookie) => {
+export const get_bookshelf = async () => {
+  const userVid = await getUserVid()
   return axios({
     method: 'get',
     url: '/shelf/friendCommon',
     headers,
     params: {
-      userVid: getUid(cookie)
+      userVid
     }
   })
 }
 // 获取你的所有有笔记本书单
-export const get_notebooklist = () => {
+export const get_notebooklist = async () => {
+  const userVid = await getUserVid().catch(e => {})
+  if (!userVid) {
+    return Promise.reject(401)
+  }
   return axios({
     method: 'get',
     headers,
@@ -109,14 +116,15 @@ export const get_bookinfo = bookId => {
 }
 
 // 获取某本书的批注
-export const get_reviewlist = (params, cookie) => {
+export const get_reviewlist = async (params) => {
+  const userVid = await getUserVid()
   return axios({
     method: 'get',
     url: '/web/review/list',
     baseURL: 'https://weread.qq.com',
     headers,
     params: {
-      userVid: getUid(cookie),
+      userVid,
       ...params
     }
   })