為什麼我將知乎文章保存在本地後不能打開?

我將知乎文章的網頁保存在本地後，以html的形式打開，發現直接跳轉到404了，這是為什麼？怎麼解決這個問題?

---

因為知乎文章是兩步載入帶JS的，保存只是原封不動的把源代碼弄下來而已，跑不起來的。正確做法是列印成PDF。

---

實際上知乎自己就沒設計過文章的剪藏性。

一個認為自己應該被列印的網頁會具有 @media print，以便讓自己列印的時候顯示起來符合列印的規格，例如隱藏導航元素（比如「+ 寫文章」）、廣告、刪除一些邊距、改變題圖大小（沒必要 = 100vh）等。

無論是 clip to OneNote 還是複製到 OneNote，都會有或多或少的問題，例如圖片在 OneNote 裡面總是佔一行；此外複製到 OneNote/Word 會導致一些格式的丟失，例如你可能會發現某些看不見的元素顯示出來；用「全文」模式（網頁變截圖）會損失索引便利性，而且這個功能會導致字體非常噁心。

下面讓我們進入私貨模式，推薦一種非常棒的剪藏到 OneNote 的方式，你需要 Windows 桌面版本的 OneNote。

1. 打開你要剪藏的網頁；
2. 如果必要，使用 F12 開發者工具把不必要的元素去掉並調整好縮放比例；
3. 使用「列印」功能，列印到 OneNote；
4. 此時 OneNote 會讓你選擇列印位置，選擇某個分區，列印內容會以 xps 轉換的圖片被放到頁面上；
5. 此時全選（Ctrl+A），然後打開上下文菜單（滑鼠右鍵或者鍵盤菜單鍵），選 Set Picture as Background。

完成，這樣做的好處是：

• OCR 是免做的，這些內容由列印驅動提供，也就是網頁上的文字都不會丟失，可搜索，且不存在目前漢字 OCR 自動加空格的天坑；
• （設置為背景）列印結果的圖片不容易誤操作導致位置亂掉，使用筆批註十分方便；這一點是對「列印到紙上的內容無法修改」（但是鉛筆寫的內容可以塗掉）的電子化模擬；此外，OneNote 隨處可寫的優勢馬上就來了，可以在圖片上覆蓋著作筆記，包括墨跡和（設為背景後才比較方便的）文字、表格、公式等；
• 你可以隨時獲得列印的 XPS 文檔，通過圖片的上下文菜單（但是似乎你設置為背景之後就不會出現那個選項了，雖然取消設置背景之後還在。

壞處是：

• 折行處的文字會被斷開，這對被折行的漢語詞語來說比較蛋疼，會導致搜索不靈，實際上可以發現列印到 PDF/XPS 也會這樣；
• 會丟掉超鏈接。

例子：列印 為什麼函數簽名相同的委託不是同一個類型

注意下圖中標題裡面被斷開的「一個」沒有被搜索到。

---

下載HTML後用wps word打開，然後你就能看到保留了格式的文檔了，然後整理一下，刪除不要的東西(評論區，點贊，以及知乎的一堆東西啥的)，導出為PDF就好了。

我就是這樣列印@梨梨喵 的知乎文章的。

---

最優的解決辦法，歡迎使用印象筆記?剪藏

https://www.yinxiang.com/webclipper/

---

為啥都用這麼麻煩的辦法。。。誠然用第三方工具也是個辦法。。。

其實把app開頭的js文件甚至所有的js文件刪掉就可以了啊。。。注意，不要刪掉app開頭的css文件

當然，在保存網頁之前，一定要先把頁面慢慢拉到最下面，來讓為載入的圖片載入過來，否則圖片就不容易保存到了。

======== 簡單分析一下原因 =========

Chrome按F12，在默認的Elements選擇404提示，可以發現class名稱為：「NotFound ErrorContainer」

接下來，全局搜索 Search all files (Ctrl+shift+F)，會發現NotFound就藏身在app開頭的js文件里，幹掉這個文件就好咯。

這裡的js文件對頁面有個判定，404的頁面替換就是從這裡來的。

畢竟用的是webpack打包，格式化源碼後2w多行，這變數名看的眼花。於是下斷點開始跟蹤：

.catch(function(t) {
if (t instanceof P.NotFoundError) {
var n = S.default.pageConfig;
(0,
_.applyConfig)(n),
(0,
l.render)((0,
w.createElementWithStore)(S.default, {}, r), o)
} else {
if (!(t instanceof P.RedirectError))
throw t;
e.href = t.location
}
})


斷點在第二行，應該就是這裡啦~

到這裡傳過來的t就已經是404了。。。。然後就跟了一段。。最後發現第一行就是。。。

webpackJsonp([1], [, function(e, t, n) {}])


這裡的t就已經是404了。。。

對應的 common 這個js文件有這個：

window.webpackJsonp = function(r, i, a)


嗯，找到那個t在哪裡了。。。

最後得到t是個Object，部分內容：

apiRoot:"",
debug:false,
instance:"column",
name:"production",
paySDK:"https://pay.zhihu.com/api/js"


這個pay是個什麼鬼。。。打賞？是怕https下打賞被劫走所以不讓看頁面嘛？[疑惑臉]

也就是說呢，在幹掉common這個js後，把這段內容以t這個變數給app這個js文件就好啦~

算了，還是老老實實的刪掉js文件吧。。。Orz...

---

因為部分資源（js？）沒有下載下來。

正確打開姿勢：

1.參考輪子哥的方法。

2.使用網站鏡像工具，直接把網站或者網站的部分拷貝出來。

下面這2個回答中有具體的操作方法

有沒有辦法實現知乎整站下載？ - 知乎

如何把維基百科完整地拷貝下來？需要多大的存儲空間？ - 知乎

---

沒有遇到過這種狀況，但是根據我多年之前的測試，知乎確實挺難保存的。我試過各種瀏覽器的保存網頁功能、印象筆記、為知筆記、scrapbook等，發現firefox的擴展scrapbook保存效果最好。

不過時間也有點久了，目前的狀況可能會有 變化。

---

ctrl s保存後刪掉一個js就可以了。

我實驗過，只不過忘了那個js是什麼文件名了，試驗一下就好了

---

你用notepad就行了

---

用IE，裝OneNote桌面版，然後工具欄有一個發送到OneNote，建議默認發送到本地的筆記本。（Edge的發送到OneNote，以及OneNote UWP 經常同步出問題，可能和我網路環境有關）

---

推薦閱讀：