用Google Drive雲端硬碟建立HTML網頁 - 龍之家族- 痞客邦

平時要丟個HTML網頁範例檔案，大家都會丟去哪邊呢？ ... 第6步 這時Google Drive雲端硬碟會問您是否上傳到這個共用資料夾，請點﹝上傳並共用﹞。

關閉廣告 龍之家族 跳到主文 歡迎光臨龍之家族 部落格全站分類：休閒旅遊 相簿 部落格 留言 名片 Sep06Tue201615:10 用GoogleDrive雲端硬碟建立HTML網頁 引用網址：https://sofree.cc/google-drive-html/ 平時要丟個HTML網頁範例檔案，大家都會丟去哪邊呢？多數人作法都會去找Hinet免費網頁空間，但是這必須要有租Hinet網路才有得使用，對於使用第四台網路的使用者怎麼辦？其實我們有另外一個選擇，就是利用「GoogleDrive」雲端硬碟來打造專屬於自己的HTML網頁、網站，透過Google免費提供的5GB空間，就已經很足夠建置個人的網頁了。

GoogleDrive雲端硬碟的應用非常多，可以當成5GB免費檔案儲存空間，也可以用來放置文件、表單、免費圖片空間，應用的層面很廣，這回我們要透過GoogleDrive的檔案權限設定部分，讓文件可以公開存取，變成可以顯示在網路上的一個HTML靜態網頁，這個空間可以支援大部分的HTML語法，包含引入圖片、使用javascript或是jQuery等等，最適合拿來當展示網頁。

  現在我們可以透過GoogleDrive雲端硬碟，可以讓我們上傳一些基本的網頁檔案，例如圖片、js、html等等的靜態網頁檔案，而且我們將網頁檔案分享權限設定為公開，這樣就可以讓網路上所有人直接存取你的檔案，瀏覽你的網頁了。

或許透過GoogleDrive來建置網頁很不專業，不過我們可以將它當成第三方資源使用，例如丟一些網頁設計範例檔案在上面，透過雲端自動同步來做管理，本機電腦修改就會直接上傳到網路上了。

網站名稱：GoogleDrive 網站網址：http://drive.google.com 注意！Google將於2016年8月關閉檔案外聯服務，此方法可能會失效。

推薦 Dropbox外連。

第1步 首先來到GoogleDrive雲端硬碟網站，點選左上角﹝建立﹞→﹝資料夾﹞，我們透過一個專用的資料夾來管理我們的HTML網頁檔案。

第2步 接著請將資料夾命一個名稱，並點﹝建立﹞繼續。

第3步  當我們建立好後，請在該資料夾上點選右鍵，選擇【共用】裡面的【共用】設定。

【註】 其實香腸是先建立了一個資料夾叫做「網頁檔案」，然後才再建立「MyWeb」，這樣我可以在「網頁檔案」這個資料夾下面建立很多的網頁資料夾，便於管理。

第3步 這時請將該資料夾做權限變更，預設是私人，請點﹝變更﹞。

第4步  接著權限部分請設定【公開在網路上】，存取權部分，請設定為【可以檢視】，然後點﹝儲存﹞。

第5步 資料夾的建立與權限設定完成之後，請來到您的資料夾內，然後將已經做好的網頁拖曳上傳。

第6步  這時GoogleDrive雲端硬碟會問您是否上傳到這個共用資料夾，請點﹝上傳並共用﹞。

第7步  這時會問你檔案是否要轉格式，在此請不要轉換任何檔案，以確保網頁可以正常運作，請點﹝開始上載﹞。

第8步 當網頁上傳完畢後，右邊會顯示「已上載」。

第9步  接著請點選在你的網頁資料夾中的網頁檔案(html檔案)，使用滑鼠右鍵點一下，點【選擇開啟工具】→【Google雲端硬碟檢視器】。

第10步 這時候我們會看到網頁是檢視原始碼的，可能中文有亂碼，但這部分不用擔心，請再點﹝預覽﹞即可， 第11步 最後就會將網頁跳到公開頁面了，這就是HTML網頁呈現頁面，雖然網址很醜，不過我們可以透過Google縮網址服務，把網址變精簡。

範例：https://googledrive.com/host/0B-KzSQ530QU2aUQ0OGlhZnJ0dU0/index.html 縮網址：http://goo.gl/GnbqC 第12步 圖片外連測試，如下，所以也是可以外連的XD。

文章標籤 googledrive web 全站熱搜 創作者介紹 龍之家族 龍之家族 龍之家族發表在痞客邦留言(1)人氣() E-mail轉寄 全站分類：不設分類個人分類：web此分類上一篇：透過Dropbox建立免費HTML網頁空間(Pancake.io) 此分類下一篇：修改apache的httpd服务为root权限 上一篇：透過Dropbox建立免費HTML網頁空間(Pancake.io) 下一篇：CentOS/RHELv6.x:InstallAndConfigureSerialConsole 歷史上的今天 2016:透過Dropbox建立免費HTML網頁空間(Pancake.io) ▲top 留言列表 發表留言 活動快報 畢嘉士中秋禮盒合作 今年痞客邦與畢嘉士基金會合作，募集部落客免費體驗... 看更多活動好康 參觀人氣 本日人氣： 累積人氣： 站方公告 [公告]2022年度農曆春節期間服務公告[公告]MIB廣告分潤計劃、PIXwallet錢包帳戶條款異動通知[公告]2021年度農曆春節期間服務公告 熱門文章 文章分類 工具(3) loadtest(3)ffmpeg(1)securecrt(1) 收藏(7) 料理(2)美髮(1)瘦身(1)語文學習(1)健康常識(6)勵志(0)其它(1) 音樂相關(2) 音樂分享(1)樂理(1) 技術文件(18) ha(10)snmp(3)google(1)snmp(0)web(2)waf(1)drm(0)html5(1)License(1)wifi(1)netflow(1)network(0)pcap(1)streaming(0)dpdk(3)vmware(1)docker(1)SDLC(3) 作業系統(4) linux(16)windows(1)mac(3)gcp(2) 服務器(17) nginx(26)tomcat(7)webrtc(6)sipserver(1)tacacs(1)radius(1)ftp(1)samba(1)vnc(1)web(4)elk(10)ipvs(0)dns(1)https(3)mantis(1)line_bot(3)k8s(2) 程式設計(10) android(4)ios(0)java(2)other(12)eclipse(1)google(5)jqGrid(19)db(3)xcode(2)gis(1) 國內旅遊(0) 國外旅遊(2) 日本(1)旅遊資訊(1) 最新文章 最新留言 文章精選 文章精選 2022五月(1) 2022四月(1) 2022一月(2) 2021三月(3) 2021一月(3) 2020十一月(2) 2020八月(1) 2020三月(1) 2020一月(1) 2019十二月(1) 2019十一月(1) 2019十月(5) 2019八月(4) 2019七月(1) 2019六月(1) 2019三月(1) 2019二月(1) 2019一月(3) 2018十二月(3) 2018十一月(3) 2018十月(1) 2018九月(1) 2018八月(3) 2018七月(3) 2018六月(4) 2018五月(3) 2018四月(1) 2018三月(2) 2018一月(5) 2017十一月(1) 2017十月(9) 2017九月(1) 2017六月(1) 2017四月(1) 2017一月(3) 2016十二月(2) 2016十一月(3) 2016十月(3) 2016九月(4) 2016八月(1) 2016七月(2) 2016六月(3) 2016五月(4) 2016四月(26) 2016三月(12) 2016二月(53) 所有文章列表 文章搜尋 誰來我家 QRCode POWEREDBY (登入) 回到頁首 回到主文 免費註冊 客服中心 痞客邦首頁 ©2003-2022PIXNET 關閉視窗