0

我使用 Routify 在 Svelte 中编写 PWA,并尝试将注释(包含 id、标题和正文)保存在本地 json 文件中。

我一直在关注 Svelte REPL 中的这段代码(Svelte POST 示例),但他们使用的是 Web URL。当尝试使用直接链接时,我得到一个 404,即使路径是正确的。

<script>
    let foo = 'title'
    let bar = 'body'
    let result = null
    
    async function doPost () {
        const res = await fetch('https://httpbin.org/post', {
            method: 'POST',
            body: JSON.stringify({
                foo,
                bar
            })
        })
        
        const json = await res.json()
        result = JSON.stringify(json)
    }
</script>


<input bind:value={foo} />
<input bind:value={bar} />
<button type="button" on:click={doPost}>
    <p>Post it.</p>
</button>
<p>Result:</p>
<pre>
{result}
</pre>

我安装了一个 json 服务器插件,它有点工作,但我想将数据存储为本地文件。

是否可以在不使用任何服务器的情况下使用 POST 写入本地 json 文件?使用fetch时是否可以使用相对路径?还是我应该使用其他东西?

4

1 回答 1

1

通常,您不会在其他任何地方发布数据,而是将数据发布到服务器。话虽如此,如果你绝对想使用 POST 保存数据,你可以在你的应用程序中添加一个 serviceworker 来拦截fetch()请求,然后将数据保存在缓存、indexeddb、localstorage 或类似的东西中。但是仅仅为此而让那个 serviceworker 有点傻,你应该将数据直接存储在缓存、indexeddb 或 localstorage 中。

本地存储示例:

const data = { someKey: { someOtherKey: 'some value' } };
localStorage.setItem('myData', JSON.stringify(data));

但请注意,无论您使用哪种存储,如果用户决定清除浏览器数据或浏览器由于存储不足而自行清理,它们都可能会被清除。

于 2021-07-16T12:02:14.060 回答