Googleドライブに保存されているファイル(画像など)をWebサイトに表示する


289

公開ウェブサイトのGoogleドライブに保存されている画像などのファイルにアクセス/表示できるかどうか疑問に思っていました。


4
質問を作成したユーザーはSOを使用したことがなく、この質問は回答を受け入れずに残しています(有効な回答が1つ以上ある場合)。コミュニティの編集者はそれを修正できますか?
rufo 2013年

6
これは廃止されているように見えます:Googleドライブで卑下ウェブホスティングサポート
dumbledad

代替案を含む2016年7月のGoogleからの最終更新は次のとおり
developers.googleblog.com

@wescpy、私はこのソリューションが私のG Suiteアカウントで
y2k-shubham

回答:


200

回避策は、を取得しfileIdGoogle Drive SDK APIからこれを使用することUrlです:

https://drive.google.com/uc?export=view&id= {fileId}

これは、Googleドライブ内のファイル(画像など)への永続的なリンクになります。

注:このリンクはクォータの影響を受けるようです。したがって、パブリック/大規模な共有には理想的ではありません。


ただし、このURL(少なくとも「表示」のもの)は、それを表示しているユーザーがGoogle(ドライブ?)にログインしている場合にのみ機能するようです。匿名のブラウジングウィンドウで、リクエストした(公開で共有された)画像の代わりにログインページが表示されました。
2013

1
3月27日の私のコメントを参照してください。また、リンクのあるユーザーについては、制限を超えることはできません。
rufo

1
これは、パブリックフォルダーを使用しなくても機能します。画像自体は「公開」として共有する必要があります。ファイルを共有すると、fileIdが表示されます(URLに埋め込まれています)。
ジムフレッド

4
こんにちはRufo、割り当ての量など、割り当てに関する情報を共有していただけますか?割り当てとは、1か月あたりの帯域幅の表示を意味しますか?割り当てのないリンクはありますか?パブリック/マスシェアリングを探しています。
Noitidart 2016

1
@JimFredのような重要なメモによると、ファイルは公開として共有する必要があります
datdinhquoc

163

更新:発表されたように、Google は2016年8月にこの機能を廃止しました。代替案を含むGoogleから最終更新は次のとおりです。

はい、可能です。ファイルをパブリックフォルダーに配置すると、次のURLでフォルダー内の任意のファイルを取得できます。

https://googledrive.com/host/<folderID>/<filename>

3
デッドリンク:(誰かが新しいものを手に入れましたか?
ランバティーノ2017年

@LeoLuanElezi編集が適切である間は、「デッドリンクを削除」することで、より良い編集の要約が得られます。
Nissa

152

簡単なビューのリンクは次のとおりです。

https://drive.google.com/uc?id=FILE_ID

例:https : //drive.google.com/uc?id=0B9o1MNFt5ld1N3k1cm9tVnZxQjg

MP3、PDFなど、他のファイルタイプでも同じことができます。


13
できます!(共有リンクはにhttps://drive.google.com/file/d/2B8NbrE732XHNLThjZWZzMMVCDeVFpLVVXUkFjT3h2Qloweslz/edit?usp=sharing 変わりました https://drive.google.com/uc?id=2B8NbrE732XHNLThjZWZzMMVCDeVFpLVVXUkFjT3h2Qloweslz)。
cbh2000 2014

ビデオビューでビデオファイルをパーリーにする方法は?
chiru 2014

ファイルのアップロードが完了すると、ドライブのAPIの応答メッセージに次のリンクが含まれますdata.response.webContentLink。これは&export=download最後に削除する必要があるだけです。
Bill Hoag

この回答は、ESPN Fantasy-Footballチームのロゴの画像をホスト/使用しようとしたときにうまくいきました。
NateJ 2014

1
@pabloverd:「そのアクションを1つずつ実行する必要がありますか」はい。

61

@ https://productforums.google.com/forum/#!topic/drive/yU_yF9SI_z0/discussionからの方法

1- ur画像をアップロード

2-右クリックして「共有可能なリンクを取得」を選択

3-次のようなリンクをコピーします

https://drive.google.com/open?id=xxxxxxx

4をに変更しopen?uc?、次のように使用します

<img src="https://drive.google.com/uc?id=xxxxx">
  • を削除するhttp:https:、ウェブから何かを参照するときに、urサーバーの問題を回避することをお勧めします。

@ ctf0「urサーバーの問題を回避するためにWebから何かを参照するときは、http:またはhttps:を削除することをお勧めします」drive.google.com
HoCo_

うまく機能し、シンプル
Perera

26

更新:発表されたように、Google は2016年8月にこの機能を廃止しました。代替案を含むGoogleから最終更新は次のとおりです。

2013年4月のように、Chrome / webkitを使用すると、以下が機能しました。

  • 1「public」などの名前のフォルダを作成します

  • 2そのフォルダを選択し、右クリックして[ 共有 ] > [共有 ]を選択します。クリック。「誰でもアクセスできる」を選択

  • 3ファイルをフォルダにドラッグアンドドロップし、アップロードします。

  • 4ファイルを右クリックして、[ 詳細]を選択します。Details-Fieldsetの行の1つに「Hosting」と表示されます。その下にURLがあります。

https://googledrive.com/...

  • そのURLを新しいタブにドラッグアンドドロップします。URLをコピーして貼り付け、共有したり、好きな場所に埋め込んだりします。

1つの制限は、HTTPに関する限り、安全なHTTPアクセスのみが可能と思われることです。

更新:
別の制限として、Googleドライブで開くことができるファイルにアクセスできなくなります
つまり、「詳細」をクリックしても、GoogleドライブのURLは表示されません。

これを克服するには:

  • 問題のファイルを右クリックして、[アプリケーションから開く]> [アプリの管理]を選択します。

ここに画像の説明を入力してください

  • ここでファイル関連のアプリのチェックを外します
  • オプション:Googleドライブを再読み込み
  • ファイルを右クリックして「詳細」を選択します
  • 手順4と同様に続行します。

注:上記の手順の代わりに、Googleドライブで開けない、または関連付けられていない拡張子が付いたファイルをアップロードしています。


2
更新の更新-201 5で非推奨になり、2016 6で
Chris H

したがって、この回答は削除する必要があります
matanster

14

ブラウザでファイルを表示したい場合は、rufoとTorxedが提供する方法と同様の方法を使用することもできます。

https://drive.google.com/uc?export=view&id={fileId}

分かりません。ブラウザでgdocを表示する場合は、URLを入力するだけです。
Phil Goetz 2014

7

それは可能だと思いますが、短期間で

ファイルのアクセス制御リストをパブリック読み取り専用(またはパブリック読み取り/書き込み)に設定する必要があります。これは、Google Document List APIを使用してプログラムで行うか、ドライブ画像ビューアの[共有]ボタンを使用して手動で行うことができます。

次に、Google Document List APIまたはGoogle Drive APIfile.getDownloadUrl()など)を使用して、プログラムで画像のURLを取得できます。 Javaの。また、Googleドライブのデフォルトの画像ビューアで画像を右クリックすると、簡単に手動で画像へのリンクを取得できます。

問題は、このリンクの存続期間が限られているため、しばらくは機能し、その後は機能しなくなることです。

基本的に、ドライブに保存されている画像ファイルのURLは、いったん公開して共有に設定すると、認証なしでアクセスできるようになりますが、そのURLはいつか変更されます。将来的には、これらの変化するURLにリダイレクトする永続的なURLを提供するなどの解決策が見つかるかもしれませんが、約束はありません...


1
リンクの存続期間を事前に知っておくと便利です。それは修正されていますか、それとも他のパラメータに依存していますか?
ドレイク

2
経験上、エンジニアにその値を尋ねると、「現在はXXXですが、いつでも変更される可能性があるので、教えないでください:)」簡単に試して、この値を見つけることができると確信しています;)
Nicolas Garnier

現在、パブリック、期限切れであっても、リソースへのリンクが必要です。これは、アプリケーションサンドボックスのほかに、データがACLをいじることなく既にoauth2アプリに属しているためです。
kain

6

以下からのGoogleドライブのヘルプページ

ドライブでウェブページをホストするには:

  1. drive.google.comでドライブを開き、ファイルを選択します。
  2. ページの上部にある[共有]ボタンをクリックします。
  3. 共有ボックスの右下隅にある[詳細]をクリックします。
  4. [変更...]をクリックします。
  5. [オン-Webで公開]を選択し、[保存]をクリックします。
  6. 共有ボックスを閉じる前に、「共有するリンク」の下のフィールドのURLからドキュメントIDをコピーします。ドキュメントIDは、URLのスラッシュの間にある大文字と小文字および数字の文字列です。
  7. 「www.googledrive.com/host/[doc id]のようなURLを共有します。[doc id]は、手順6でコピーしたドキュメントIDに置き換えます。

誰でもあなたのウェブページを閲覧できるようになりました。


5

以前のユーザーの一部は親密でしたが、あちこちに段差がありませんでした。

これは、すべての手順を示すビデオです。

(14年12月2日を編集)
新しいGoogleドライブに関しては、以下の情報が正しくありません。新しいGoogleドライブについては、これらの指示に従ってください。 オプション1を
使用できます。
オプション1は、右上の歯車をクリックして、以前のGoogleドライブに戻します。戻す場合は、「編集の終了」の後にある手順を使用します。
オプション2または私が見つけた回避策に従ってください。これよりも良い方法を見つけた場合は更新しますが、これが機能することがわかりました。


完全なリンクは次のようになります " https://googledrive.com/host/(folder id)
必要なリンクの一部は" https://googledrive.com/host/ "です。後半は必要になります共有したいファイルに移動します。共有したいファイルが
あるフォルダに移動し たら、上のリンクを見て ください
(例1 https://drive.google.com/drive/u/0/ #folders / 0B3UALYkiLexYSXZlcldoU2NpYXM
(例2 https://drive.google.com/drive/u/0/#folders/0B3UALYkiLexYSXZlcldoU2NpYXM/0B3UALYkiLexYRkNnOVhsUVozRU0
上記の両方の例で、共有に必要な「フォルダーID」は、「/」の後の最後の文字と数字のグループなので、例1では「0B3UALYkiLexYSXZlcldoU2NpYXM」です。例2では「0B3UALYkiLexYRkNnOVhsUVozRU0」です

。例では私が使用した例1はドライブ上のフォルダーで、例2は最初のフォルダー内のフォルダーでした。そのため、2番目の前に最初のリンク全体が含まれています。
一番右側の「/」の後のセクションのみが必要です。


これで「フォルダID」がわかったので、上記の式「https://googledrive.com/host/(folder id)」を使用し ます。
例1 https://googledrive.com/host/0B3UALYkiLexYSXZlcldoU2NpYXM
例2 https:// googledrive.com/host/0B3UALYkiLexYRkNnOVhsUVozRU0


これでリンクができたので、新しいページで開きます。共有フォルダに移動します。そこに移動したら、任意のファイルを右クリックして[リンクアドレスをコピー]を選択するか、そのフォルダー内の任意のファイルをクリックしてホストされている画像に移動します。ページ上部のURLがホストURLです。


それがあなたのやり方です。それは非常に迷惑であり、個人的には古いグーグルドライブに戻すだけの方がずっと簡単に思えます。


できるだけ早く新しいチュートリアル動画を作ってみます


これで問題が解決しない場合や、発生している問題をお知らせください。


編集を終了)

https://www.youtube.com/watch?v=QmN22LMPdDk&feature=youtu.be

または、下に書かれたものに従うだけです。

これらの写真は、手順に記載されているものと一緒です。

https://googledrive.com/host/0B3UALYkiLexYSXZlcldoU2NpYXM/

  1. 画像の共有に使用するGoogleドライブにフォルダーを作成します。

  2. そのフォルダを選択し、共有オプションに移動します。[アクセスできるユーザー]オプションを[特定のユーザー]から[ウェブ上で一般公開]に変更します。フォルダに配置されたすべての画像には、ステップ4に示すホスティングリンクがあります。

    (画像:Change Folder Option.pngChange folder option 2.pngChange folder option 3.png

  3. そのフォルダに画像を配置します。

  4. 共有したい画像を選択し、「ホスティング」というラベルの付いたセクションの詳細セクション(通常は右側)を見てください。

    「googledrive.com/host/(そのフォルダーのIDである乱数と数字)/(ファイル名)」

    そのリンクを使用して画像を共有します。そのリンクを使用して、それらを他のWebサイトに埋め込むことができます。

    (画像:フォルダーオプションの変更4.pngおよびフォルダーオプションの変更share.png


2

Vetea、画像のURLからリンクを取得する場合は機能しませんが、「直接リンク」フィールドからリンクを取得する場合は機能します。私はそれを複数回使用してテストしました。


2

Niutechが提供するソリューションは私のために働きました

http://googledrive.com/host/<folderID>/<filename>

しかし、2つの未解決の問題があります

  1. ドライブの同じフォルダーに同じ名前の2つのファイルを含めることはできません。そうしないと、このリンクは機能しません。

  2. まだ明確ではありませんが、Googleはドライブによる画像ホスティングを廃止する予定です。以下のリンクをご覧ください。 https://support.google.com/richmedia/answer/6098968?hl=en


これはいつ廃止されるのかについて、Googleはタイムラインを示していません。私はこれを自分のウェブサイトと統合することを計画していましたが、これを読んだ後は確かではありません!
Shikhar


2

特にG-Suiteユーザー向け。ここのポイント3で報告されているように、画像をホストするためにこのURLを使用できます

https://drive.google.com/a/domain.com/thumbnail?id=imageID

以下の代替品あり

  • domain:次のような会社のGSuiteドメインに置き換えます pikachu
  • imageID:画像ID /ファイルIDに置き換えます

ここでの前提条件は、画像がドライブを介して対象者に共有されていることです(個人ごとに、または組織全体で)。

ここに画像の説明を入力してください


レンダリングされた画像のサイズに問題がある場合は、ここで説明されている次のオプションを使用してください

https://drive.google.com/a/domain.com/thumbnail?id=imageID&sz=w{width}-h{height}

以下の交換あり(domainおよびimageID交換に加えて)

  • {width}:次のように幅をピクセル(中括弧なし)で書き込みます 300
  • {height}:高さを中かっこなしでピクセル単位で書き込みます。 200

1

Google Drive APIにはfiletypeオプションがあります。おそらく、それが有効な画像に解決されるかどうかを確認できます。ファイルタイプで無効な画像が表示された場合に、ファイルの新しい直接URLを取得するオプションを見てみます。私はこれを行う方法を正確に理解していませんが、多分それは試すための道です。


1

ドライブとGmailから直接実行できます。方法は次のとおりです。

1.画像をGoogleドライブにアップロードし、閲覧権限を設定します(公開またはリンク付きの誰でも可能)

  1. Gmail> [作成]に移動します。添付アイコンの横にある+を選択します。

  2. ドライブアイコンを選択(三角形)

  3. 画像に移動し、画像のURLを右クリックしてコピーします

  4. 必要に応じて、Webブラウザーに貼り付けるか、Webページに埋め込みます。


これは、ドキュメント全体へのリンクを提供するだけです。これを行う意味はまったくありません。ドキュメントを編集または表示しているときは、そのドキュメントのURLがすでにあります。皆さん、ドキュメントのURLを見つける方法についての回答を投稿しないでください。そのURLはすでに知っています。
Phil Goetz

1

1.写真の設定を公開します。

2.共有可能なリンクを取得します。

3. このWebサイトにアクセスして、直接ダウンロードリンクを生成します。

私のために働いた!


1

簡単なソリューション

あなたがしなければならないすべてはあなたのファイルを開くことです:

Googleドライブの山の画像

次に、Webインスペクタ(Chromeの場合、Cmd-Shift-IまたはCtrl-Shift-IOSによって異なります)にアクセスして、リンクを取得します。できた!

Webインスペクターに表示される画像のリンクの画像

リンクは機能しますここで試してください


0

ブラウザでJavaScriptを無効にして画像ファイルを開き、ページのソースを表示するか、画像を右クリックすると、画像のリンクが表示されます。(前に共有設定を確認してください)


それはきちんとしたトリックですが、JavaScriptを無効にしてGoogleドキュメントを開こうとすると、「ブラウザでJavaScriptが有効になっていないため、このファイルを開くことができません。有効にして再読み込みしてください」というメッセージが表示されます。
Phil Goetz 2014


0

関数のタイトル:goobox

タグ:画像ホスティング、正規表現、URL、Googleドライブ、ドロップボックス、高度

  • return:string、画像のソースとして直接使用できる文字列URLを返します。
  • GoogleドライブまたはDropboxで画像をホストする場合、ファイルの直接URLを画像ソースとして使用することはできません。
  • このURLを変更して、画像ソースとして直接使用する必要があります。
  • goobox() 画像ファイルのURLを取得し、画像ソースとして直接使用するように変更します。
  • 重要:最初にファイルの権限を確認し、それが公開されているかどうかを確認する必要があります。
  • ライブの例:https : //ybmex.csb.app/
cconst goobox = (url)=>{

    let dropbox_regex = /(http(s)*:\/\/)*(www\.)*(dropbox.com)/;
    let drive_regex =/(http(s)*:\/\/)*(www\.)*(drive.google.com\/file\/d\/)/;

    if(url.match(dropbox_regex)){
       return url.replace(/(http(s)*:\/\/)*(www\.)*/, "https://dl.");
    }
    if(url.match(drive_regex)){
        return `https://drive.google.com/uc?id=${url.replace(drive_regex, "").match(/[\w]*\//)[0].replace(/\//,"")}`;
    }
    return console.error('Wrong URL, not a vlid drobox or google drive url');
}
let url = 'https://drive.google.com/file/d/1PiCWHIwyQWrn4YxatPZDkB8EfegRIkIV/view' 

goobox(URL); //  https://drive.google.com/uc?id=1PiCWHIwyQWrn4YxatPZDkB8EfegRIkIV 

-3

しかし、この答えは単純で、実際は非常に単純で、画像のIDを次のリンクに単に入れるだけだと多くの人が言及していますhttps://drive.google.com/uc?export=view&id= {fileId}

しかし、それがどれほど簡単であっても、コンソールで実行するスクリプトを作成しました。googleドライブからの完全な共有可能なリンクの配列をフィードし、それらを上記のリンクに変換します。その後、それらは単に静的アドレスとして使用できます。

array = ['https://drive.google.com/open?id=0B8kNn6zsgGEtUE5FaGNtcEthNWc','https://drive.google.com/open?id=0B8kNn6zsgGEtM2traVppYkhsV2s','https://drive.google.com/open?id=0B8kNn6zsgGEtNHgzT2x0MThJUlE']

function separateDriveImageId(arr) {
for (n=0;n<arr.length;n++){

str = arr[n]

for(i=0;i<str.length;i++){
if( str.charAt(i)== '=' ){
var num = i+1;
var extrctdStrng = str.substr(num)

}
}
console.log('https://drive.google.com/uc?export=view&id='+extrctdStrng)
window.open('https://drive.google.com/uc?export=view&id='+extrctdStrng,'_blank')
}


}
separateDriveImageId(array)

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.