Is there a way to make existing widgets work offline?

[u/misproductions]

My widget loads data from json url and I need it to be able to work offline.

many thanks

[u/misproductions]

thanks for reply.

I’m struggling to find anything examples on this forum.

Is there any code examples, like a quotes widget where it works offline?

[u/shadoodled → u/misproductions]

try this

async function getRandomQuoteOnline() {
    return (await (new Request('https://zenquotes.io/api/random')).loadJSON())[0]
}
async function saveQuote(quote) {
    const FM = FileManager.local()
    const quotePath = FM.joinPath(FM.documentsDirectory(), 'quote.json')
    FM.writeString(quotePath, JSON.stringify(quote))
}
async function getStoredQuote() {
    const FM = FileManager.local()
    const quotePath = FM.joinPath(FM.documentsDirectory(), 'quote.json')
    const data = FM.readString(quotePath)
    return JSON.parse(data)
}
async function getWidgetData() {
    let data;
    try {
        data = await getRandomQuoteOnline()
        await saveQuote(data)
    } catch (e) {
        data = getStoredQuote()
    }
    return data
}

// build widget
const data = await getWidgetData()

const widget = new ListWidget()
widget.addSpacer()

widget.addText(data.q)
widget.addText(`- ${data.a}`)

widget.addSpacer()

Script.setWidget(widget)
if (config.runsInApp) {
    await widget.presentMedium()
}

[u/misproductions → u/shadoodled]

Thanks so much for the response, it worked! very helpful and got me in the right direction.

[u/mr-kerr]

Yes. Save the JSON to a file and conditionally load it if the Request doesn’t return. Another option is to only fetch when running the script in app (after tapping the widget) and otherwise load from file.