I’ve been wondering about how Gmail’s web interface manages to show both “preview” and “download” buttons for the same attachment like image files. Usually browsers handle files based on their MIME type or extension, but Gmail seems to give users both choices at the same time. For example, when someone sends a .png file, I can either view it directly in the browser or save it to my computer. How do they implement this dual functionality? Is this handled through specific server settings or are they using some client-side JavaScript tricks to override the default browser behavior?
yeah totally! the way they use blob urls is genius, it makes downloading and previewing files so easy. i love how my browser handles it without any lag - its super smooth and just works, you know? nice job on that Gmail!
From what I’ve seen with web apps, Gmail basically creates two different request paths for the same attachment. Click preview and they serve the file with headers that make it display inline. Hit download and they force your browser’s save dialog instead. The main difference is how they handle HTTP response headers - especially Content-Disposition like someone mentioned earlier. What’s cool is they use their virus scanning as middleware, so they can modify these headers on the fly no matter how the original sender set up their email client. Works every time because they don’t rely on the sender’s setup or your browser’s default file handling.
Gmail does this with server-side headers and JavaScript. Click preview? Gmail serves the file with ‘Content-Disposition: inline’ so your browser displays it directly. Want to download? They switch to ‘Content-Disposition: attachment’ with the filename. JavaScript catches your choice and hits Gmail’s servers accordingly. They also run everything through their own proxy servers to sanitize attachments, giving them complete control over file delivery no matter what the original MIME type was. Works across all browsers since they’re basically hijacking the normal file handling.