Deno_Fresh_writeFile
※Freshの導入については省略
routesフォルダ下にapi(=fetchでリクエストを送ってサーバーサイドで処理する手段)を作ることができる
ローカルファイルに書き込みたい理由
ローカルサーバーで動かしている状態でアプリケーションとして実用するため
Deno.writeTextFileSyncにファイルパスと本文が必要なので、その二つをPOSTリクエストで渡すようにしてみる
必ずhandlerという変数名でハンドラをexportする
code:routes/api/writeFile.ts
// ファイル名はなんでもいい
import { Handlers } from "$fresh/server.ts";
type Body = { // type名もなんでもいい
filepath: string,
content: string,
}
export const handler:Handlers<Body> = {
async POST(req, _ctx){
const body = (await req.json()) as Body;
Deno.writeTextFileSync(body.filepath, body.content);
console.group(new Date()); // ターミナルに表示
console.log(${body.filepath} に書き込みました。, body.content);
console.groupEnd();
return new Response(JSON.stringify(body));
},
}
code:islands/Hoge.tsx
// クライアントサイド
function writeFile(filepath: string, text: string) {
fetch("/api/writeFile", { // 上のファイル名
method: "POST",
body: JSON.stringify({
filepath: filepath,
content: text,
}),
})
.then(() => {
console.group(new Date()); // ブラウザのコンソールに表示
console.log(${filepath} に書き込みました。, text);
console.groupEnd();
});
}