# レコード新規追加時にファイルアップロードと関連付けを行うと空のエラーが返されます

**URL:** <https://community.cybozu.dev/t/topic/5476>\
**Category:** kintone 開発相談\
**Created:** [2021 年 11 月 17 日午前 9:03 UTC](https://community.cybozu.dev/t/topic/5476 "2021-11-17T09:03:01Z")\
**Posts on this page:** 6\
**Page:** 1

<div class="post-metadata">

**Author:** ![Legacy\_Account415](https://avatars.discourse-cdn.com/v4/letter/l/c37758/32.png) [@Legacy\_Account415](https://community.cybozu.dev/u/Legacy_Account415)\
**Post date:** [2021 年 11 月 17 日午前 9:03 UTC](https://community.cybozu.dev/t/topic/5476/1 "2021-11-17T09:03:01Z")

</div>

kintoneに用意されているアップロードボタンではなく  
スペースにこちらで設けたアップロードボタンから  
ファイルをアップロードした後にレコードを新規追加し  
アップロードされたファイルと追加したレコードとの関連付けを行いたいのですが  
[こちらのページ](https://community.cybozu.dev/hc/ja/articles/200724665)を参考に試してみたのですが  
関連付け自体は上手くいってるようなのですが  
関連付けの結果が成功ではなくエラーの方で返されてしまいます。  
そのエラーの内容はエラーコードもエラーメッセージもない空のものでした。  
上手くいってると書きましたが、頻繁ではないですが失敗する事もあるようでした。

最初はレコードの保存時にアップロードと関連付けを一気にやろうとしたのですが  
通信タイミングがとれないのか上手くいかなかったので  
アップロードボタンを押しファイル選択を行った後にアップロードを行い  
レコードの保存時(新規追加)に改めて関連付けを行うと見かけ上は  
上手くいくようになったのですが、エラーの反応とエラーの内容から  
あまり気持ちのいいものではないので  
解決する方法がないでしょうか？よろしくお願いします。

なお、[こちらのページ](https://community.cybozu.dev/hc/ja/community/posts/115011824046-Excel-VBA%E3%82%88%E3%82%8A%E6%B7%BB%E4%BB%98%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E3%82%A2%E3%83%83%E3%83%97%E3%83%AD%E3%83%BC%E3%83%89%E5%BE%8C%E3%81%AE%E3%83%AC%E3%82%B3%E3%83%BC%E3%83%89%E9%96%A2%E9%80%A3%E4%BB%98%E3%81%91%E3%81%AB%E3%81%A6%E3%82%A8%E3%83%A9%E3%83%BC?input_string=%E3%83%AC%E3%82%B3%E3%83%BC%E3%83%89%E6%96%B0%E8%A6%8F%E8%BF%BD%E5%8A%A0%E6%99%82%E3%81%AB%E3%83%95%E3%82%A1%E3%82%A4%E3%83%AB%E3%82%A2%E3%83%83%E3%83%97%E3%83%AD%E3%83%BC%E3%83%89%E3%81%A8%E9%96%A2%E9%80%A3%E4%BB%98%E3%81%91%E3%82%92%E8%A1%8C%E3%81%86%E3%81%A8%E7%A9%BA%E3%81%AE%E3%82%A8%E3%83%A9%E3%83%BC%E3%81%8C%E8%BF%94%E3%81%95%E3%82%8C%E3%81%BE%E3%81%99)に似たような質問があり見てみたのですが  
fileKeyと記述しており大文字小文字の違いでもなさそうでした。

---

<div class="post-metadata">

**Author:** ![Legacy\_Account980](https://avatars.discourse-cdn.com/v4/letter/l/a183cd/32.png) [@Legacy\_Account980](https://community.cybozu.dev/u/Legacy_Account980)\
**Post date:** [2021 年 11 月 22 日午前 7:07 UTC](https://community.cybozu.dev/t/topic/5476/2 "2021-11-22T07:07:03Z")

</div>

こんにちは！

実際に書かれたコードを貼り付けていただくと、回答が得やすいかと思います！  
問題が無さそうに見えても、百戦錬磨のエンジニアの方が見ると突っ込みどころがあるかも知れません👀✨✨

---

<div class="post-metadata">

**Author:** ![Legacy\_Account415](https://avatars.discourse-cdn.com/v4/letter/l/c37758/32.png) [@Legacy\_Account415](https://community.cybozu.dev/u/Legacy_Account415)\
**Post date:** [2021 年 11 月 24 日午後 2:05 UTC](https://community.cybozu.dev/t/topic/5476/3 "2021-11-24T14:05:34Z")

</div>

juridonさん、コメントありがとうございます！  
そして失礼しました、コードを貼り付けておきます・・・

```
function set_record_key(event){
return new Promise((resolve, reject) => {
var key = $('#file_key').val();
var record = event.record;
var json = {
app: kintone.app.getId(),
id: record.$id.value,
record: {
file: {
value: [{fileKey: key}]
}
}
};
kintone.api(kintone.api.url('/k/v1/record', true), 'PUT', json, function(res) {
console.log("成功、ファイル登録の結果 : " + JSON.stringify(res));
}, function(error) {
console.log("失敗、ファイル登録の結果: " + JSON.stringify(error));
});
});
}

kintone.events.on('app.record.create.submit.success', function(event) {
new kintone.Promise(function(resolve, reject) {
set_record_key(event);
});
});

```

---

<div class="post-metadata">

**Author:** ![Legacy\_Account980](https://avatars.discourse-cdn.com/v4/letter/l/a183cd/32.png) [@Legacy\_Account980](https://community.cybozu.dev/u/Legacy_Account980)\
**Post date:** [2021 年 11 月 25 日午後 11:59 UTC](https://community.cybozu.dev/t/topic/5476/4 "2021-11-25T23:59:31Z")

</div>

コードの貼り付けありがとうございます。

&nbsp;

＞関連付け自体は上手くいってるようなのですが  
とのことで、  
スペースフィールドでアップロードとfileKey（アップロード用）の取得をされていると思うのですが、  
どのようにその関連付けの部分はどのようにコード書かれていますか？？  
↓これのkey取得元のことが知りたいです～

```
var key = $('#file_key').val();

```

&nbsp;

---

<div class="post-metadata">

**Author:** ![Legacy\_Account415](https://avatars.discourse-cdn.com/v4/letter/l/c37758/32.png) [@Legacy\_Account415](https://community.cybozu.dev/u/Legacy_Account415)\
**Post date:** [2021 年 12 月 6 日午前 10:44 UTC](https://community.cybozu.dev/t/topic/5476/5 "2021-12-06T10:44:21Z")

</div>

遅くなってすみません・・・  
アップロードフォームの参照ボタンを押しファイルを選択した段階で  
FileAPIを利用しファイルを読み取ったバイナリデータを  
アップロードし、そこから得られたFileKeyを一応

```
$('#file_key').val(file_key);

```

に一時的に保存するという形をとっています。  
以下のようになります。  
よろしくお願いします。

```
$('#input-file').on('change', function(e)
{
read_binary_data(e, event).then((data) => {

var bin = new ArrayBuffer(data.length);
var ui8a = new Uint8Array(bin, 0);
for (var i = 0; i < data.length; i++) ui8a[i] = (data.charCodeAt(i) & 0xff);

var blob = new Blob([ui8a], {
type: e.type
});
// FormDataにファイルを格納
var formData = new FormData();
formData.append(' __REQUEST_TOKEN__', kintone.getRequestToken());
formData.append('file', blob, e.target.files[0].name);

var xmlHttp = new XMLHttpRequest();
xmlHttp.open('POST', kintone.api.url('/k/v1/file', true), true);
xmlHttp.setRequestHeader('X-Requested-With', 'XMLHttpRequest');
xmlHttp.send(formData);
xmlHttp.onload = function() {
if (xmlHttp.status === 200) {
var file_key = JSON.parse(xmlHttp.responseText).fileKey;
$('#file_key').val(file_key);
}else{
alert("Error");
}
};
});
});

```

&nbsp;

---

<div class="post-metadata">

**Author:** ![Legacy\_Account980](https://avatars.discourse-cdn.com/v4/letter/l/a183cd/32.png) [@Legacy\_Account980](https://community.cybozu.dev/u/Legacy_Account980)\
**Post date:** [2021 年 12 月 7 日午前 6:01 UTC](https://community.cybozu.dev/t/topic/5476/6 "2021-12-07T06:01:34Z")

</div>

こんにちは！

アップロード自体は200が返ってきて、$(‘#file\_key’).val(file\_key);で#file\_keyの要素にはアップロードのfileKeyが書かれているということですね👀！  
PUTする時にエラーが出てしまうけど、ファイルは保存されているという感じですね（＞＜）  
コードを見た感じ、エラーが出そうな箇所は見つけられず💦💦

&nbsp;

もし、async/await を使ってコードを書くことに抵抗がなかったらですが、  
コチラのライブラリ（[kintone rest api client](https://github.com/kintone/js-sdk/tree/master/packages/rest-api-client)）を使われてみるといいかもしれません👀  
↓file関連のドキュメントです  
[https://github.com/kintone/js-sdk/blob/master/packages/rest-api-client/docs/file.md](https://github.com/kintone/js-sdk/blob/master/packages/rest-api-client/docs/file.md)

↓addRecord(レコード追加)  
[https://github.com/kintone/js-sdk/blob/master/packages/rest-api-client/docs/record.md#addRecord](https://github.com/kintone/js-sdk/blob/master/packages/rest-api-client/docs/record.md#addRecord)

async/awaitで  
アップロードを待って（fileKeyを取得するのを待って）から、  
レコード追加するというコードが（慣れればですが）書きやすいと思います。

Qiitaなどで「kintone-rest-api-client ファイル アップロード」など検索するとサンプルなど出てくると思います👀