Google Docs viewer returning 204 responses, no longer working, alternatives?

Question

UPDATE 2016-11-16 9:53am EST

It appears many people are still seeing 204 responses even though Google has claimed to have "fixed" the problem. When I myself tested the loading of a document 50 times, 3 of those times Google returned a 204 response.

Please visit this URL and post a comment of your unhappiness so that we can finally get Google to address and fix the issue once and for all: https://productforums.google.com/forum/?utm_medium=email&utm_source=footer#!msg/docs/hmj39HMDP1M/SR2UdRUdAQAJ

UPDATE 2016-11-04 6:01pm EST

It looks like the service is up and working again! Thanks to Google Docs for addressing the issue and answering my tweets. Hope it's working for all of you too.

UPDATE 2016-11-04 3:33pm EST

There was an update published to https://productforums.google.com/forum/#!msg/docs/hmj39HMDP1M/X6a8xJwLBQAJ which seems to indicate support for the service might be returning and/or there was an issue on their end which caused unintended results. Stay tuned. See comment immediately below:

Original Post on Stack Overflow Starts Here

Our web software used and relied on the Google Docs viewer service to embed documents into our website (via iframe) and to give our customers the ability to view docs without having to open separate applications (via visiting the URL). This functionality was provided by Google for quite some time and had worked perfectly!

Example viewer URL:

https://docs.google.com/viewer?url=http://www.pdf995.com/samples/pdf.pdf

We began to notice, however, that files we were trying to load would only load very rarely. We initially thought there was an issue with their servers so began investigating the header responses we were getting. Particularly, we noted that nearly every request made was returning a 204 No Content response. Very occasionally we got a 200 response.

Here's an example of one of the 204 responses we got:

Here's an example of one of the 200 responses we got (very rare):

After that I searched Google for 204 issues associated with the Google viewer service. I ended up on this page https://productforums.google.com/forum/#!msg/docs/hmj39HMDP1M/X6a8xJwLBQAJ which seems to indicate that Google has suddenly and abruptly discontinued the service. Here's a screenshot of that discussion (as of the time of this post).

Given the fact that a Google "expert" replied to the person's similar inquiry; it seems that they've officially and totally abandoned support for the viewer service.

My questions are the following:

1. Does anyone else know for certain whether Google officially ended its support of the Google viewer service?

2. Does anyone know of an updated similar Google product/service (perhaps Google Drive?) that allows a person to do the exact same thing as the viewer service referenced above? Ideally, I'd like a simple URL where I can reference an external document that doesn't have to exist on a Google server but can still reside on my server.

3. What are some other comparable and free services you can suggest to allow me to embed documents such as Word docs, Excel docs, PowerPoint docs, and PDFs into a website that allows the user to view the documents within the browser without having to have those applications actually installed on their system.

As a final note, I just want to say that for all the good Google does it's incredibly infuriating, frustrating, and annoying that they can offer a service that people rely on for a long time and suddenly pull the plug on it. I'm sure there are many others besides just myself that will never bother voicing concerns over that type of decision. Google corrected the issue and is still good in my book :-)

Thanks ahead of time for your answers!

Solution 1

I run a service that also relies on embedding the Google Doc Viewer and I have also encountered this issue. I could not find any other comparable service (free or otherwise).

I have come up with a 'hack' that can help you get away with using the Google Doc Viewer. It does require JQuery though. What I do is keep refreshing the iframe every 2 seconds until it finally loads correctly. I also cover the iframe with a loading gif to hide the constant refreshing. My code:

<style>
.holds-the-iframe {
    background:url(/img/loading.gif) center center no-repeat;
}
</style>

<div class="holds-the-iframe">
      <iframe id="iframeID" name="iframeID" src="https://docs.google.com/viewerng/viewer?url=www.example.com&embedded=true"></iframe>
</div>

<script>
function reloadIFrame() {
    document.getElementById("ifm").src=document.getElementById("iframeID").src;
}

timerId = setInterval("reloadIFrame();", 2000);

$( document ).ready(function() {
    $('#iframeID').on('load', function() {
        clearInterval(timerId);
        console.log("Finally Loaded");
    });
});
</script>

Solution 2

Here is a react example in functional component

import React, {useEffect, useRef, useState} from "react";

type IframeGoogleDocsProps = {
    url: string,
    className?: string
};
export default function IframeGoogleDoc({url, className}: IframeGoogleDocsProps) {

    const [iframeTimeoutId, setIframeTimeoutId] = useState(undefined);
    const iframeRef = useRef(null);

    useEffect(()=>{
        const intervalId = setInterval(
            updateIframeSrc, 1000 * 3
        );
        setIframeTimeoutId(intervalId)
    },[]);

    function iframeLoaded() {
        clearInterval(iframeTimeoutId);
    }
    function getIframeLink() {
        return `https://docs.google.com/gview?url=${url}&embedded=true`;
    }
    function updateIframeSrc() {
        if(iframeRef.current){
            iframeRef.current.src = getIframeLink();
        }
    }

    return (
        <iframe
            className={className}
            onLoad={iframeLoaded}
            onError={updateIframeSrc}
            ref={iframeRef}
            src={getIframeLink()}
        />
    );
}

Solution 3

I found that solution from Byron Dokimakis is worked.

However, some of you maybe get this error when try to access iframe of cross origin.

DOMException: Blocked a frame with origin from accessing a cross-origin frame.

I found a hackish way to fix this. I noticed that the cross-origin exception not showed if the google docs page is empty (204).

So we can use try catch here

Here is the example of my codes:

const PdfViewer = ({ url }) => {
  const iframeRef = useRef(null);
  const interval = useRef();

  const pdfUrl = createGdocsUrl(url);

  const [loaded, setLoaded] = useState(false);

  const clearCheckingInterval = () => {
    clearInterval(interval.current);
  };

  const onIframeLoaded = () => {
    clearCheckingInterval();
    setLoaded(true);
  };

  useEffect(() => {
    interval.current = setInterval(() => {
      try {
        // google docs page is blank (204), hence we need to reload the iframe.
        if (iframeRef.current.contentWindow.document.body.innerHTML === '') {
          iframeRef.current.src = pdfUrl;
        }
      } catch (e) {
        // google docs page is being loaded, but will throw CORS error.
        // it mean that the page won't be blank and we can remove the checking interval.
        onIframeLoaded();
      }
    }, 4000); // 4000ms is reasonable time to load 2MB document

    return clearCheckingInterval;
  }, []);

  return (
    <div className={css['pdf-iframe__wrapper']}>
      <iframe
        ref={iframeRef}
        className={css['pdf-iframe__inside']}
        frameBorder="no"
        onLoad={onIframeLoaded}
        src={pdfUrl}
        title="PDF Viewer"
      />

      {!loaded && (
        <div className={css['pdf-iframe__skeleton']}>
          <Skeleton height="100%" rectRadius={{ rx: 0, ry: 0 }} width="100%" />
        </div>
      )}
    </div>
  );
};

Solution 4

A simple solution/hack with Reactjs, though can be easily implemented to any other library/vanilla.

Used with a basic concept : tries to load - if onload accomplish, clear interval, otherwise try to load again every 3 sec. works perfectly

(I've edited my own code it so it will contain minimum code, so not tested)

var React = require('react');

export default class IframeGoogleDocs extends React.Component {
    constructor(props) {
        super();
        this.bindActions();
    }
    bindActions() {
        this.updateIframeSrc = this.updateIframeSrc.bind(this);
        this.iframeLoaded = this.iframeLoaded.bind(this);
    }
    iframeLoaded() {
        clearInterval(this.iframeTimeoutId);
    }
    getIframeLink() {
        return `https://docs.google.com/gview?url=${this.props.url}`; // no need for this if thats not dynamic
    }
    updateIframeSrc() {
        this.refs.iframe.src = this.getIframeLink();
    }
    componentDidMount() {
        this.iframeTimeoutId = setInterval(
            this.updateIframeSrc, 1000 * 3
        );
    }
    render() {
        return (
            <iframe onLoad={this.iframeLoaded} onError={this.updateIframeSrc} ref="iframe" src={this.getIframeLink()}></iframe>
        );
    }
}

Solution 5

I got maybe a dumb question but, why we check if document is loaded? Isn't way easy to catch the response 204 and refresh until we get 200 (then we are sure that document is loaded) :)

View more solutions

Comments

[Eric Koleda]

It's worth noting that Google never offered this as a service for developers, and it's not a part of an official and supported API. Finding an endpoint that works is not the same as Google offering a service, and building upon unsupported endpoints comes with risk.

[Art Geigel]

Fair enough. They tacitly knew, however, that thousands of people relied on the service and integrated it into their applications.

[Art Geigel]

Beyond that, Microsoft offers a similar service and actively promotes it: products.office.com/en-US/office-online/…. It's an inferior product to Google's service because it doesn't support PDF rendering. I simply don't see any reason why Google would turn it off. It's only going to drive people to a competitor's service. I'd gladly pay a monthly fee to continue using Google's.

[l2aelba]

Mar, 2017. Still doesnt fix

[Subash]

July, 2019. Returns 204

[Laurens]

May, 2021. Returns 204

[Jinson Paul]

November 2021. Still Returns 204 occasionally

[link64]

No consistent way to reproduce it, but returning 204 very often

[Art Geigel]

I thought about doing something similar. That solution, however, would take way longer to load and also isn't guaranteed to work in the future given the fact they've indicated they'll phase it out. I'm just completely stumped as to why they'd shut it off knowing people use it. This doesn't apply to me, but there are tons of Wordpress plugins that use it so I'm sure a lot of websites have been impacted.

[Cellydy]

I agree, it's very annoying. Another 'solution' would be to use the Microsoft equivalent https://view.officeapps.live.com/op/embed.aspx?src=[OFFICE_F‌​ILE_URL] (which only works with office documents) to display the DOC and DOCX files and something like PDF.JS to handle PDF's. Or convert all files to PDF and just use PDF.JS.

[Art Geigel]

Thanks. I saw the Microsoft equivalent but also noted it's failure to render PDFs. The Google Viewer was so perfect at what it did though. I've tweeted at [at]GoogleDocs and [at]jrochelle asking for an explanation and to encourage them to give us the service back. Maybe if they see enough outrage they'd consider reversing their course.

[Cellydy]

@ArtGeigel If you don't forget, please let me know if you find anything interesting out!

[Art Geigel]

Of course @Cellydy! Some people have been retweeting my complaint so perhaps we'll end up on their radar. I'll keep you posted.

[Art Geigel]

Check out the most recent post on productforums.google.com/forum/#!msg/docs/hmj39HMDP1M/…. It looks like they might be bringing it back!

[Art Geigel]

Hey @Cellydy I think we're back up and running now. Test it out on your end.

[Cellydy]

@ArtGeigel It works perfectly now! Great job sorting it out! :)

[Art Geigel]

Hey @Cellydy, I updated this Stack Overflow post with new updates at the top. It appears many (including myself) are seeing issues again, albeit not as often as before. Just wanted to update you.

[Garavani]

Only working solution I could find after hours of trying everything! Awesome!

[Russell Ratcliffe]

Had to make a few changes for this to work - gist.github.com/RusseII/62a304c29af402292ef4c57a1cf1a988

[Ihsan Müjdeci]

Be warned this gview is giving us issues at the moment. Users with slow internet will have a forever loading issue. There seems to be no way around it.

[Russell Ratcliffe]

To get rid of the infinite loading issue you can either increase the interval time, or double the wait time every time it fails to load. Not pretty, but will ensure that it eventually works 100% of the time.

[Shimrit Snapir]

was really helpful in my case only there's an issue with safari not activating onError. see solution here: stackoverflow.com/a/62791842/9702000

[HappyFace]

Add the answer to your own post; Do not merely link to it.

[Byron Dokimakis]

Hey @HappyFace. I can't seem to find a specific guideline against sharing an answer via a link (with the appropriate context, of course). I would think this is preferable, to avoid duplicate content and have only 1 point of reference for any potential future amendments to the answer. If you have another view, let me know.

[HappyFace]

meta.stackoverflow.com/questions/251006/…

[mike hennessy]

Tried this code, but not working. Could you share you full component?

[Art Geigel]

Isn’t that just for working with PDFs? The Google viewer supports all common document types which IMO makes it more useful.

[Aimanzaki]

Yes. You are right. Since it is Adobe, they only support PDF.

[Ihsan Müjdeci]

@RussellRatcliffe I think some sort of back off mechanism would be the better approach definitely.

[Luki Centuri]

Check this solution from me stackoverflow.com/a/70093907/8371889. Hope it helps

[Luki Centuri]

Check this solution stackoverflow.com/a/70093907/8371889. Hope it helps