1

This is part of the data I receive from Google's Calendar API:

{  
    "fileUrl":"https://drive.google.com/file/d/1q-cSkADjUnD0PGOamZKI44oIL_cXDJlg/view?usp=drive_web",
    "title":"2.png",
    "iconLink":"",
    "fileId":"1q-cSkADjUnD0PGOamZKI44oIL_cXDJlg"
}

How do I achieve the direct link to the file (using JavaScript) so I can use it as datasource? example:

https://something.com/2.png

Edit: This link (right click & copy image adress) works as datasource, I just don't know how I would dynamically create it.

Loufs
  • 1,596
  • 1
  • 14
  • 22
Barskey
  • 423
  • 2
  • 5
  • 18

1 Answers1

0

You need to make a GET request to fileUrl, since permanent "direct" links will not exist.

Directly from these google docs:

Using alt=media To download files, you make an authorized HTTP GET request to the file's resource URL and include the query parameter alt=media. For example:

GET https://www.googleapis.com/drive/v3/files/0B9jNhSvVjoIVM3dKcGRKRmVIOVU?alt=media

URLs do not need file extensions for their server to understand what it is you are requesting. However, sometimes servers want an extra query parameter to decide what to send back.

So it also seems you may need to append ?alt=media onto the end of your endpoint url, fileUrl.

Then just use ajax, or a similar requesting method, and send a GET request to the endpoint.

Using the Drive API and JS:

var fileId = '0BwwA4oUTeiV1UVNwOHItT0xfa2M';
var dest = fs.createWriteStream('/tmp/photo.jpg');
drive.files.get({
  fileId: fileId,
  alt: 'media'
})
    .on('end', function () {
      console.log('Done');
    })
    .on('error', function (err) {
      console.log('Error during download', err);
    })
    .pipe(dest);
Loufs
  • 1,596
  • 1
  • 14
  • 22
  • Keeps giving me this error:`Failed to load https://drive.google.com/file/d/.../view?usp=drive_web&alt=media: Redirect from 'https://drive.google.com/file/d/.../view?usp=drive_web&alt=media' to 'https://accounts.google.com/ServiceLogin?service=wise&passive=1209600&continue=https://drive.google.com/file/d/.../view?usp%3Ddrive_web%26alt%3Dmedia&followup=https://drive.google.com/file/d/.../view?usp%3Ddrive_web%26alt%3Dmedia' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost:8080' is therefore not allowed access.` – Barskey Jan 12 '18 at 16:11
  • So congrats you're now loading correctly! You fixed your problem! However, now you have a CORS issue. These come up when you try to load assets externally as if they are coming from your server or localhost. This is blocked by default for security. Since this is a whole separate issue, please approve/close this answer and begin your search. Here's a good post to help you get started configuring your requests correctly: https://stackoverflow.com/a/5753269/5749093 – Loufs Jan 12 '18 at 16:34