2

I'm making a small web-app that I want to be able to save onto mobile phone home screens. I've currently have only been trying to get the icon to work on iPhone. Does this not work when deploying onto a iPhone. I created a simple design to use as a place holder till I make my final image.

Here is my doGet:

function **doGet**(request) {
  var html = HtmlService.createTemplateFromFile('HTML')
        .evaluate()
        .addMetaTag('viewport', 'width=device-width, initial-scale=1, 
                    maximum-scale=2.0, user-scalable=yes')
        .addMetaTag('apple-mobile-web-app-capable', 'yes')
        .addMetaTag('mobile-web-app-capable', 'yes')
        .setTitle('....')
        
  return html;
}

and the top of my html file:

<!DOCTYPE html>
<html>
  <head>  
    <link rel="apple-touch-icon.png" href="https://imgur.com/pjRunhf.png" />
    <link rel="apple-touch-icon.png" sizes="57x57" href="https://imgur.com/msEvmfa.png" />
    <link rel="apple-touch-icon" sizes="72x72" href="https://imgur.com/mpyFFCl.png" />
    <link rel="apple-touch-icon" sizes="76x76" href="https://imgur.com/imCLqD7.png" />
    <link rel="apple-touch-icon" sizes="114x114" href="https://imgur.com/p3MpaAR.png" />
    <link rel="apple-touch-icon" sizes="120x120" href="https://imgur.com/s1sXFtn.png" />
    <link rel="apple-touch-icon" sizes="144x144" href="https://imgur.com/OghKpMR.png" />
    <link rel="apple-touch-icon" sizes="152x152" href="https://imgur.com/3aed5Mw.png" />
    <link rel="apple-touch-icon" sizes="180x180" href="https://imgur.com/Zhcnytz.png" />

I've tried many things, what seemed to work the best was moving my meta tags into my doGet function. I also tried to use .setFaviconUrl(url) in the doGet but I had trouble finding a place I could upload an .ico file. I ended up trying to just add the favicon file into my google drive and make the file accessible to anyone and use that URL as the parameter but it didn't like that there wasn't a suffix in that link. Is there a way to be able to access a google drive file with a suffix? Like .setFaviconUrl('https://drive.google.com/file/d/someID/view?usp=sharing.ico'); I tried setting the someID to the folder the ico file is in and then just adding the /favicon.ico at the end but that didn't work.

Rubén
  • 34,714
  • 9
  • 70
  • 166
Brian Searle
  • 21
  • 1
  • Can you try with a [Data URI](https://en.wikipedia.org/wiki/Data_URI_scheme)? Check if [the answer on this SO question](https://stackoverflow.com/questions/5199902/isnt-it-silly-that-a-tiny-favicon-requires-yet-another-http-request-how-to-mak) helps – mTorres Feb 23 '18 at 09:18
  • That's interesting. I've never heard of a URI or URN. I read some of it, and think I kind of get it. I'm not quite sure though if I fully understand how URI works thus most likely implementing it wrong. I Plugged the URL's into https://ezgif.com which returned a URI which I believe is like a combination of URL's and URN's. Could be wrong on that. Anyways I took that gigantic URI and plugged into the href. So I have something like this for each apple-touch-icon: (shortened URI) Is this correct? – Brian Searle Mar 03 '18 at 06:01
  • Yup, that's how I would do it :-) (don't know if it will work though, it was just a wild guess) – mTorres Mar 04 '18 at 12:45

1 Answers1

0

Add "&format=png" at the end of your google-drive url as described here: https://stackoverflow.com/a/67393002/20493400

creat-ing
  • 1
  • 2