何を実現したいのかを書きましょう
プラグイン設定画面に画像ファイルを保存したいです。
発生した問題やエラーメッセージを具体的に書きましょう
現状、アップロードまでは問題ないのですが、保存ボタンを押しても画像ファイルが消えてしまいます。
実行したコードをコピー&ペーストしましょう
// 画像アップロードフィールド(カスタムスタイル付き)
const fileInputContainer = document.createElement("div");
fileInputContainer.classList.add("file-input-container");
const fileInput = document.createElement("input");
fileInput.type = "file";
fileInput.classList.add("image-file-upload");
fileInput.accept = "image/*"; // 画像ファイルのみ受け入れ
fileInput.style.display = "none"; // ボタンのカスタムスタイル用に隠す
fileInput.addEventListener("change", handleFileSelect); // ファイル選択時の処理
// 画像ファイルをアップロードする
const fileData = new FormData();
fileData.append("file", file);
try {
// 画像をKintoneにアップロード
const response = await fetch(kintone.api.url("/k/v1/file.json", true), {
method: "POST",
headers: {
"X-Cybozu-API-Token": "BQf3IBTtomiyC1aAYhZnZEmDmq9RpN4XwUkJP3ju", // APIトークン
},
body: fileData,
});
const data = await response.json();
if (data.fileKey) {
const fileKey = data.fileKey;
// 画像のファイルKeyを設定
fileNameLabel.innerHTML = `アップロードされた画像: ${file.name} (ID: ${fileKey})`;
// 設定に保存するためにファイルキーを一時的に保持
fieldRow.dataset.fileKey = fileKey;
// 設定データを保存する関数
const saveConfig = () => {
const fieldSelections = document.querySelectorAll(".field-select");
const fieldValues = [];
const fieldCodes = [];
// 重複チェック
for (const fieldRow of fieldSelections) {
const select = fieldRow.querySelector(".field-code");
const textarea = fieldRow.querySelector(".field-note");
const fieldCode = select.value;
const note = textarea.value;
const fileKey = fieldRow.dataset.fileKey; // ファイルキーを取得
if (fieldCode) {
// もしフィールドコードが重複していたら
if (fieldCodes.includes(fieldCode)) {
alert("同じ項目が選択されています。");
return; // 重複があれば保存処理を中止
}
fieldValues.push({ fieldCode, note, fileKey });
fieldCodes.push(fieldCode); // 使用済みのフィールドコードを保存
}
}
// 重複がない場合のみ保存
kintone.plugin.app.setConfig({ fields: JSON.stringify(fieldValues) }, () => history.back());
};
コードを抜粋しているため、可読性が落ちているかもしれませんがご容赦ください。
ご教授いただけますと幸いです。