# 外部システムに添付ファイルをアップロードしたい

**URL:** <https://community.cybozu.dev/t/topic/4743>\
**Category:** kintone 開発相談\
**Created:** [2020 年 1 月 6 日午前 5:19 UTC](https://community.cybozu.dev/t/topic/4743 "2020-01-06T05:19:56Z")\
**Posts on this page:** 3\
**Page:** 1

<div class="post-metadata">

**Author:** ![Legacy\_Account1364](https://avatars.discourse-cdn.com/v4/letter/l/278dde/32.png) [@Legacy\_Account1364](https://community.cybozu.dev/u/Legacy_Account1364)\
**Post date:** [2020 年 1 月 6 日午前 5:19 UTC](https://community.cybozu.dev/t/topic/4743/1 "2020-01-06T05:19:56Z")

</div>

いつもお世話になっております。１点ご質問させてください。

kintoneに添付されたファイル（PDF）を他システム(Cloudsign)に連携したいため、kintoneJS上で実装しています。

以下を参考に実装しましたが、400のエラーでファイルが認識されません（空？のような認識になっているようです）  
[https://developer.cybozu.io/hc/ja/articles/200814380](https://community.cybozu.dev/hc/ja/articles/200814380)  
[https://developer.cybozu.io/hc/ja/articles/200724665](https://community.cybozu.dev/hc/ja/articles/200724665)

また、以下の投稿を確認しました。  
[https://developer.cybozu.io/hc/ja/community/posts/255646366](https://community.cybozu.dev/hc/ja/community/posts/255646366)

上記のやりとりを見て、Cloudsign社に確認したところ、最近CORS対応したという回答をもらいました。  
というわけで、CORS対応している別サービスのAPIに、XMLHttpRequestでファイルを送信したいです。

連携サービス側（Cloudsign側）で、CORS Origin URL の入力欄があり、  
APIを利用するウェブアプリ（つまりKintone）の  
URL のスキーマとホスト名部分を記入する必要があるのですが、  
ここにはkintoneの何を入力すれば良いのでしょうか。

また、連携サービス側にCORSの設定をしたうえで、Kintoneでどう書けば良いかもご教示いただきたいです。

&nbsp;

何卒よろしくお願いいたします。

---

<div class="post-metadata">

**Author:** ![Legacy\_Account1740](https://avatars.discourse-cdn.com/v4/letter/l/ed8c4c/32.png) [@Legacy\_Account1740](https://community.cybozu.dev/u/Legacy_Account1740)\
**Post date:** [2020 年 1 月 7 日午前 8:47 UTC](https://community.cybozu.dev/t/topic/4743/2 "2020-01-07T08:47:33Z")

</div>

miyachi様

お世話になっております．  
トヨクモの江田と申します．

下記を見る限り，「https://\*\*\*\*.cybozu.com/」のように入力すればよいかと思います．(\*\*\*\*の部分はお使いのkintoneのサブドメインを入れてください．)  
[https://help.cloudsign.jp/ja/articles/428992-cors-%E3%81%B8%E3%81%AE%E5%AF%BE%E5%BF%9C%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6](https://help.cloudsign.jp/ja/articles/428992-cors-%E3%81%B8%E3%81%AE%E5%AF%BE%E5%BF%9C%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6)

また，kintone外部にファイルをアップロードする際は，「kintone.proxy.upload()」を用いると良いです．  
[https://developer.cybozu.io/hc/ja/articles/202166320](https://developer.cybozu.io/hc/ja/articles/202166320)

---

<div class="post-metadata">

**Author:** ![Legacy\_Account1364](https://avatars.discourse-cdn.com/v4/letter/l/278dde/32.png) [@Legacy\_Account1364](https://community.cybozu.dev/u/Legacy_Account1364)\
**Post date:** [2020 年 1 月 9 日午前 1:10 UTC](https://community.cybozu.dev/t/topic/4743/3 "2020-01-09T01:10:46Z")

</div>

返信が遅くなり申し訳ありません。  
漠然とした質問にもかかわらず、回答いただきありがとうございます。

現状、未だ解決に至っておりません。  
調べた中で、確認させていただきたい内容がございます。

**■XMLHttpRequestを利用して実装を試みた場合--------------------------------------------------------------------------------------------------------------------**

## 接続先（クラウドサイン）側にてCORSの設定をしましたが、リクエストを送信するタイミングで以下のエラーになってしまいます。

## Access to XMLHttpRequest at ‘[[https://api-sandbox.cloudsign.jp/\*\*\*\](https://api-sandbox.cloudsign.jp/%5C*%5C*%5C*%5C)\*]([https://api-sandbox.cloudsign.jp/](https://api-sandbox.cloudsign.jp/) \*\*\*\* )’ from origin ‘https://\*\*\*\*.cybozu.com’ has been blocked by CORS policy :No ‘Access-Control-Allow-Origin’ header is present on the requested resource.

「Access-Control-Allow-Origin」ヘッダーが、存在しないためエラーになっているのではないかと考えています。

たしかに、Kintoneの「セキュアコーディング-ガイドライン」というところに、以下の記載があります。

クロスドメイン制約  
クロスドメイン制約のため、XHR(XMLHttpRequest) を使用したcybozu.comと外部サイトとの通信はできません。Access-Control-Allow-Origin ヘッダーは付与できません。

これは、接続先側のサービスで、CORS設定などいくら対応したとしても、  
KintoneのJavaScriptからは、XMLHttpRequestを利用して接続できないという理解で良いのでしょうか？  
（以下のスレッドで解決した旨の記載はあったので、どうにかできるのでしょうか・・）  
[[https://developer.cybozu.io/hc/ja/community/posts/255646366-外部システムへのAPI実行時-data部分の記載について](https://community.cybozu.dev/hc/ja/community/posts/255646366-%E5%A4%96%E9%83%A8%E3%82%B7%E3%82%B9%E3%83%86%E3%83%A0%E3%81%B8%E3%81%AEAPI%E5%AE%9F%E8%A1%8C%E6%99%82-data%E9%83%A8%E5%88%86%E3%81%AE%E8%A8%98%E8%BC%89%E3%81%AB%E3%81%A4%E3%81%84%E3%81%A6)]）

**■kintone.proxy.uploadを利用して実装を試みた場合--------------------------------------------------------------------------------------------------------------------**

接続先のAPIのRequest bodyは「multipart/form-data」という形式の指定があり、  
name（string）、uploadfile（string($binary)）をセットするよう記載があります。

## そのため、FormDataという型にファイルをセットして、実行しますが、upload実行のタイミングで以下のエラーになってしまいます。

## Uncaught (in promise) Error: Usage: kintone.proxy.upload(url, method, headers, data, opt\_callback, opt\_errback)

以下のように実装を入れているのですが、間違っているところ等ありましたら、ご教授頂けると幸いです。  
（ファイルやID、Tokenは、設定されています。）

// ファイルをダウンロード  
var url = kintone.api.urlForGet(‘/k/v1/file’, { fileKey: files[0].fileKey }, true);  
return kintone.proxy(url  
, ‘GET’  
, {“Authorization”: ‘Basic \*\*\*\*’, “X-Cybozu-Authorization”: ‘\*\*\*\*’}  
, {});

}).then(function(resp2) {

file = resp2[0];  
var blob = new Blob([file]);

var formData = new FormData();  
formData.append(“name”, “ファイル名”);  
formData.append(“uploadfile”, blob);

// ドキュメントにファイルを追加（POST /documents/{documentID}/files）  
return kintone.proxy.upload(‘[https://api-sandbox.cloudsign.jp/documents/](https://api-sandbox.cloudsign.jp/documents/)’ + documentID + ‘/files’  
,‘POST’  
, {“Authorization”: 'Bearer ’ + accessToken, “Content-Type”: “multipart/form-data”}  
, {  
‘format’: ‘RAW’,  
‘value’: formData,  
}  
);  
}).then(function(resp3) {

// 続きの処理

});

**ｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰｰ**

何卒宜しくお願いいたします。