研究一下如何下載別人分享的 Canva 簡報和 Google 簡報

Pew Research Center 在 2024/5 發布一項研究報告，指出網路內容常常會不見，在2013年到2023年間，有25%的網頁消失了，16%的網域依然存在，只是網頁打不開，另外的9%是整個網域都失效了。

有些人想下載簡報，也許是為了怕內容不見?
也許是拿來做壞事，洗稿或轉賣?
有些是想要收藏，但是共享的檔案散落在各種雲端服務帳號上，找起來很不方便。

不管動機是什麼，其實最快的是跟檔案的原始主人要看看，搞不好還可以額外交流，獲得一些電子擋上面沒有的東西。

剛好遇到這個小小需求，順手來記錄一下。

下載 Google PDF 簡報

如果是上傳到 Google 雲端硬碟的 pdf 檔，右上角應該會直接看到下載按鈕。

下載 Google Drive 的 PDF

如果沒看到下載按鈕，通常是檔案主人的共用設定沒有勾選「檢視者和加註者可以下載、列印或複製這個檔案」(在共用選項的右上角，齒輪圖案點進去)。

沒有權限的瀏覽者頂多只能一頁一頁擷圖了。

其他嘗試過失敗的方法:
1.檔案有開下載權限時，會有一個專屬的程式網址 drive.usercontent.google.com/uc?id=文件ID&export=download。但是如果是下載按鈕沒出現的情況，用這個網址進去會顯示:

很抱歉，擁有者並未授予你權限，因此無法下載這個檔案。 只有擁有者和編輯者可以下載這個檔案。如要下載檔案，請與擁有者聯絡。

2.使用 Devtool 的 Network 檢查載入內容
會看到 PDF 的每一頁會載入像是 blob:https://drive.google.com/長得像uuid的格式 的網址，但是 URL 複製起來貼到網址列，是無法開啟的。貼到下載軟體或其他地方也不會動。

把 <img src="blob:https://drive.google.com/長得像uuid的格式"> 放在其他網頁，也無法顯示，應該是 Google 在接到資料請求時有做額外的檢查。

3.用瀏覽器的列印功能
印不出來，都是空白。

下載 Google 簡報

這又有分二種，首先要看拿到的網址是什麼模式:

編輯模式

特徵:

  1. 打開簡報後，網址中含有/edit之類的字串
  2. 左上角有檔案、編輯、查看…一排選單。

下載方法:
共用設定有開「檢視者和加註者可以下載、列印或複製這個檔案」的話，點開檔案>下載，裡面應該有將 Google 簡報儲存成各種格式的按鈕。

下載 Google Drive 的 PDF

如果檔案的主人沒開下載權限的話，點開檔案的選單，裡面的所有選項應該都是反灰不能點的(如上圖)，
可以切換到其他模式(見下段)，再自己想辦法擷圖…。

投影播放模式

特徵:

  1. 開簡報後，網址中含有/htmlpresent之類的字串
  2. 網頁背景是黑的。畫面上完全沒有其他按鈕。

下載方法:

  1. 嘗試使用一些網頁下載器，運氣好的下載還可以打開。
  2. 或是網頁另存PDF的瀏覽器套件，需要勾選
    • 配置(列印方向):橫
    • 勾選列印背景圖形
    • 邊界:無
    • 尺寸還要調老半天，以免列印出來內容不會剛好截斷成一頁一頁的。
  3. 使用建立副本模式，把網址中的參數/htmlpresent改成/copy，在自己的雲端硬碟中建立簡報的拷貝副本。

如果檔案沒開下載權限的話，大概只能乖乖擷圖…

  • 選擇列印，會是一片空白。
  • 使用建立副本模式，會跳到 Google 登入畫面。

下載 Canva 簡報

跟 Google 簡報一樣，又有分編輯模式和展示模式，首先要看拿到的網址是什麼模式:

編輯模式

特徵:

  1. 打開簡報後，網址中含有/edit之類的字串
  2. 網頁上面有選單圖示、檔案…之類的一排選單。

下載方法:
點右上角的分享，裡面會有下載按鈕(如下圖)。

下載 canvae 的簡報

這時候應該可以正常下載了，
但是如果檔案擁有者沒把檔案開放下載，點了之後會出現權限不足的提示訊息:

User is unauthorized to access design for Export

可以參考下段，把網址中的參數/edit改成/view，然後把圖片偷出來…

投影播放模式

特徵:

  1. 打開簡報後，網址中含有/view之類的字串
  2. 網頁背景是黑的。
  3. 滑鼠移到最下面，會跑出一排顯示播放進度和表情符號的選單

下載方法:
1.點右下角的「在網格檢視中開啟」
2.觀察DOM，發現網格檢視中的每頁縮圖都是 AWS S3 pre-signed URL
3.在 console 貼入以下 js code，列出網頁中所有圖片，可以用 chatgpt 寫，例如:

let images = document.getElementsByTagName('img'); let domain = 'document-export.canva.com'; for (let i = 0; i < images.length; i++) { if (images[i].src.includes(domain)) { console.log(images[i].src); } }

4.按 Enter 後會得到圖片網址(如下圖)

取得 Canva 簡報的各頁縮圖

4.直接全選把那些網址複製出來，後面那些 7.16.0.min.js:2 要刪掉，最後挑出一堆像這樣的網址 https://document-export.canva.com/隨機碼/隨機碼/隨機碼/thumbnail/四位數字(0001~N).png?X-Amz-Algorithm=AWS4-HMAC-SHA25後面一大串

5.從圖片編號發現只會有第一個畫面的，要再自己往下繼續捲動。
6.重複步驟3&4。
7.將網址整理成一個 txt 檔，一行一個網址。
8.使用批次下載軟體，以 FDM 為例，點右上角三條線，選擇 paste urls form file。
9.選擇要儲存到自己電腦的哪個資料夾，開始下載。

缺點:

  • 因為是圖片，所以文字無法複製，需要自行 OCR。
  • 抓下來的圖是縮圖，只有 596*335，如果那個簡報是字很多的那種，可能看不清楚。
  • 一定要「在網格檢視中開啟」的那個畫面有出現時，在 console 輸入那串 js code 才找得出圖片路徑。
  • 要自己把網格檢視畫面往下捲動，才會跑出下一頁的路徑，不然永遠只有第一個畫面那幾張，螢幕越小，簡報越多頁，需要操作越多次。
  • 有一些瀏覽器套件也可以做到「一次下載網頁內所有圖片」，但是圖片太多可能會當機，或是漏圖片，我是因為試了兩三款都發現不知為何會漏掉一堆圖，才決定另外在 console 裡面寫 js 程式碼。

結語

本文皆使用電腦操作，以免因為在手機或平板操作，點到連結就強制使用 APP 開啟，然後某些操作按鈕被控管權限。

也許檔案主人有各種原因想保護檔案，請尊重智慧財產權。

Canva 和 Google 雲端硬碟可能會因為改版，上述方法失效，僅供參考。

下載 Canva 簡報的部分， 如果有人想要做一個程式，去把圖片網址撈下來?
除了像我上述的，模擬點開網格檢視，還有往下捲動操作來取得網址
頁面 html 還有一段 js code，依照以下路徑 page.Bj.A.G.images ，會找到一個陣列長得像這樣，僅供參考。

"images": [
    {
        "bucket": "document-export.canva.com",
        "key": "隨機碼/隨機碼/隨機碼/thumbnail/0001.png",
        "page": 1,
        "pageHash": xxx,
        "height": 335,
        "width": 596,
        "url": "https://document-export.canva.com/隨機碼/隨機碼/隨機碼/thumbnail/0001.png?X-Amz-Algorithm=AWS4-HMAC-SHA256後面一大串"
    },
    {
        "bucket": "document-export.canva.com",
        "key": "隨機碼/隨機碼/隨機碼/thumbnail/0002.png",
        "page": 2,
        "pageHash": xxx,
        "height": 335,
        "width": 596,
        "url": "https://document-export.canva.com/隨機碼/隨機碼/隨機碼/thumbnail/0002.png?X-Amz-Algorithm=AWS4-HMAC-SHA256後面一大串"
    },