GoogleドライブにCSSやJavascriptファイルを置く方法

  • 投稿 : 2013-04-05
  • 更新 : 2016-08-18
追記:2016/08/18
注: この機能は、2016 年 8 月 31 日以降はご利用いただけなくなります。
2016 年 8 月 31 日までは Google ドライブでウェブページをホストできますが、それ以降は googledrive.com/host/ID はご利用いただけなくなります。
Google ドライブでウェブページをホストする - ドライブ ヘルプ

2016/08/31以降は、当記事の方法は使えなくなります。

Googleドライブ
https://drive.google.com/

htmlファイル以外はプレビューが出ないですが、以下のようにすれば公開されているURLが判明します。
あと、格納するフォルダ自体が、「ウェブ上で一般公開」でないとダメなようです。

参考:
・Host webpages on Google Drive
https://googledrive.com/host/0B716ywBKT84AMXBENXlnYmJISlE/GoogleDriveHosting.html
・GoogleドライブにWebホスティング機能が追加
http://www.itmedia.co.jp/enterprise/articles/1302/06/news139.html

やり方

ファイルをアップロードするところまで

1.新規にフォルダを作成する。今回は「web」というフォルダ名にした。
2.「web」フォルダを右クリックで「共有」を選択して、「ウェブ上で一般公開」の設定をする
3.「web」フォルダにファイルをアップロードする

htm,htmlファイルの場合

1.ファイルを右クリックで、「開く」->「Googleドライブビューア」を選択
この時のURLが
https://docs.google.com/file/d/英数字A/edit
2.プレビューボタンを押すと公開されるURLがわかる
https://googledrive.com/host/英数字B/0000.html

「0000.html」はアップロードしたファイルそのままです。
英数字Aと英数字Bは別物です。

上記のURL以外にも
https://googledrive.com/host/英数字A/
でアクセスしても、同じものが表示されます

CSSやJavascriptファイルの場合

1.ファイルを右クリックで、「開く」->「Googleドライブビューア」を選択
この時のURLが
https://docs.google.com/file/d/英数字C/edit

プレビューボタンなどはないのです。
以下のURLでアクセスすればOKです。
https://googledrive.com/host/英数字C/

今後は・・・

アメブロとかBloggerとか無料系ブログでのファイル置き場に困ることがあったわけですが、今後は、Googleドライブを使用しようかなと思っています。

スポンサーリンク