# フォームブリッジのカスタマイズ（kintoneからのGET, kintoneへのPUT)

**URL:** <https://community.cybozu.dev/t/topic/3303>\
**Category:** kintone 開発相談\
**Created:** [2018 年 8 月 23 日午前 6:36 UTC](https://community.cybozu.dev/t/topic/3303 "2018-08-23T06:36:41Z")\
**Posts on this page:** 4\
**Page:** 1

<div class="post-metadata">

**Author:** ![Legacy\_Account1518](https://avatars.discourse-cdn.com/v4/letter/l/13edae/32.png) [@Legacy\_Account1518](https://community.cybozu.dev/u/Legacy_Account1518)\
**Post date:** [2018 年 8 月 23 日午前 6:36 UTC](https://community.cybozu.dev/t/topic/3303/1 "2018-08-23T06:36:41Z")

</div>

質問させてください。

&nbsp;

フォームブリッジのJSカスタマイズで、kintoneからレコードをGETするために下記のようなXMLHttpRequestを記載したのですが、エラーとなってしまいます。

回避策をご教授頂ければ幸いです。よろしくお願いします。

&nbsp;

＝＝以下JS＝＝

var params = ‘?app=1001&id=1’;

varurl=‘https://{ourdomain}.cybozu.com/k/v1/record.json’+params;

&nbsp;

varxhr=newXMLHttpRequest();

xhr.open(‘GET’, url);

xhr.setRequestHeader(‘X-Requested-With’, ‘XMLHttpRequest’);

xhr.setRequestHeader(‘Authorization’,‘Basic {encoded basicid:basicpw}’);

xhr.setRequestHeader(‘X-Cybozu-API-Token’,‘{our app’s Token}’);

xhr.onload=function() {

if (xhr.status===200) {

// success

console.log(JSON.parse(xhr.responseText));

} else {

// error

console.log(JSON.parse(xhr.responseText));

}

};

xhr.send();

＝＝＝＝＝＝＝＝＝＝

&nbsp;

==以下エラーメッセージ＝＝

OPTIONS [https://{ourdomain}.cybozu.com/k/v1/record.json?app=1001&id=1](https://necap.cybozu.com/k/v1/record.json?app=1098&id=1) 401 (Unauthorized)

(anonymous) @ VM69:1

dd5e8d1cea3d88552d6e77e03c2b900bcfd72622369a1aa5850b4acae88595d6#/:1 Failed to load [https://](https://necap.cybozu.com/k/v1/record.json?app=1098&id=1)[{ourdomain}](https://necap.cybozu.com/k/v1/record.json?app=1098&id=1)[.cybozu.com/k/v1/record.json?app=1001&id=1](https://necap.cybozu.com/k/v1/record.json?app=1098&id=1): Response to preflight request doesn’t pass access control check: No ‘Access-Control-Allow-Origin’ header is present on the requested resource. Origin ‘[https://form.kintoneapp.com](https://form.kintoneapp.com)’ is therefore not allowed access.

VM69:1 Cross-Origin Read Blocking (CORB) blocked cross-origin response [https://](https://necap.cybozu.com/k/v1/record.json?app=1098&id=1)[{ourdomain}](https://necap.cybozu.com/k/v1/record.json?app=1098&id=1)[.cybozu.com/k/v1/record.json?app=1001&id=1](https://necap.cybozu.com/k/v1/record.json?app=1098&id=1) with MIME type text/html. See [https://www.chromestatus.com/feature/5629709824032768](https://www.chromestatus.com/feature/5629709824032768) for more details.

＝＝＝＝＝

&nbsp;

お聞きしたいのは上記エラーの回避方法ですが、万が一他の方法で解決できることもあるかもしれないで、私の実現したいことも下記に記載させてください。

フォームブリッジを使用して、開催するセミナーと受講申し込みを管理したいと思っています。

フォームブリッジでは、回答数に制御を加える機能がありますが、開催するセミナー数が多いため、セミナー毎にアプリの立ち上げるのは難しく、セミナーは１つのアプリで管理し、それをkviewerルックアップしようと思っています。

下記のような二つのアプリを作成し、フォームブリッジを経由して受講申し込みが来たら、セミナー一覧の申請者数に+1を加え、申請者数が定員になったら受付終了にしたいです。

A）セミナー一覧

B) 受講申込一覧

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

---

<div class="post-metadata">

**Author:** ![Legacy\_Account2111](https://avatars.discourse-cdn.com/v4/letter/l/7c8e57/32.png) [@Legacy\_Account2111](https://community.cybozu.dev/u/Legacy_Account2111)\
**Post date:** [2018 年 8 月 28 日午前 2:56 UTC](https://community.cybozu.dev/t/topic/3303/2 "2018-08-28T02:56:57Z")

</div>

こんにちは。

エラー文に「Access-Control-Allow-Origin」とありますので、クロスドメイン制約に引っかかりGETできないのだと思います。

私も過去にkintoneから取得した値をフォームブリッジの初期値として設定する方法を探していたのですが、その時はフォームブリッジから直接GETすることは無理だと聞いて、親ページからpostmassageを実行することで解決しました。

(直接GETすることは無理だと書いておりますが、もし方法があったらすみません。調べが足りてなかったです。)

&nbsp;

また、フォームブリッジを単体で使用せずにWebサイト内に表示する場合に限定されますが、

kintoneへのGET文は親ページのphpに組み込んではいかがでしょうか？

&nbsp;

私の場合は、Wordpressで作成したページに、フォームブリッジで作成したフォームをiframeとして表示しております。

その時に使用しているコードを今回の要件に合わせてみました。

===================================================================================

\<?php

$str = “\<セミナー名\>”;

//セミナー受講申し込み一覧アプリ  
$search = ‘セミナー名 =’ . $str’;  
$query = ‘query=’. utf8\_uri\_encode($search);  
$url = ‘https://\<サブドメイン\>.cybozu.com/k/v1/records.json?app=1001’;  
$url = “{$url}&{$query}”;

$headers = array( ‘X-Cybozu-API-Token’ =\> ‘\<APIトークン\>’ );  
$res = wp\_remote\_get(  
$url,  
array(  
‘headers’ =\> $headers  
)  
);

$return\_value = json\_decode( $res[‘body’], true );

//申し込みレコードの件数を確認(20件以下でフォームを表示、それ以上で非表示(受付終了))  
if (count( $return\_value[‘records’]) \< 20) {  
echo ‘\<p\>\<iframe frameborder=“0” scrolling=“auto” src=“\<フォームブリッジのiframeURL\>” width=“100%”\>\</iframe\>\</p\>’;

} else {  
echo ‘\<p\>受付は終了しました\</p\>’;  
}

?\>

===================================================================================

&nbsp;

アプリを「セミナー申し込み受付アプリ」として1つにまとめ、セミナー名がリストアップされたドロップリストを作成します。

フォームブリッジはセミナー数の分だけ作成し、適切なセミナー名を初期値として設定します。

&nbsp;

各セミナーのページが開かれたタイミングで上記のphpが設定したセミナー名でkintoneにGETし

レコード数が(＝定員：仮に20名)以上であれば受付終了の文言を表示し、それ以下であればフォームを表示するといったコードです。

&nbsp;

上記について、全く的外れなことを言っておりましたら申し訳ありません。

参考になれば幸いです。

&nbsp;

---

<div class="post-metadata">

**Author:** ![Legacy\_Account1518](https://avatars.discourse-cdn.com/v4/letter/l/13edae/32.png) [@Legacy\_Account1518](https://community.cybozu.dev/u/Legacy_Account1518)\
**Post date:** [2018 年 9 月 5 日午前 7:04 UTC](https://community.cybozu.dev/t/topic/3303/3 "2018-09-05T07:04:28Z")

</div>

y-kishi様

やっぱりその方法しか無いのですね・・・。

ご回答下さりありがとうございます！ 頂いたコードでトライしてみます。

---

<div class="post-metadata">

**Author:** ![system](https://us1.discourse-cdn.com/flex015/uploads/cybozu/original/1X/d5c841c3c5a6cb66eed514001c1b45147c9e1f4f.png) [@system](https://community.cybozu.dev/u/system)\
**Post date:** [2023 年 10 月 11 日午前 5:18 UTC](https://community.cybozu.dev/t/topic/3303/4 "2023-10-11T05:18:28Z")

</div>

このトピックはベストアンサーに選ばれた返信から 3 日が経過したので自動的にクローズされました。新たに返信することはできません。
