おんどとりWebStorage APIから温度情報を取得し表示したい

現在社内ポータルを作っています。
「おんどとり」という室内温度計を使っていて、計測温度をクラウド上にログとして残していて「WebStorage」を使っています。

そちらのサービスではAPIを公開していて、APIから得られる情報から最新の測定温度を表示する方法を教えていただけますでしょうか？

可能であればNotionのページの中に埋め込みたいと思っています。
現在接続されている温度計は4台です。

表示方法としては
機器名｜現在の温度｜最終測定日時
となるようなテーブルで表示させたいと思っています。

もしくは、Notionを使っている関係で、API経由で
機器名｜計測温度｜計測日時
のようなデータベースにデータを取り込むことができるようにできますでしょうか？

Notionには、外部サービスへ情報を提供するAPIは公開されている？ようですが、データの取り込みとなると、CSVファイルのみ？にしか対応していないのでは？と感じています。

詳しい方、教えていただけますでしょうか。
よろしくお願いいたします。

質問者からの補足コメント

• 私なりにやってみたこととしては、下記の記事について試してみました。
  https://yadotech.hateblo.jp/entry/2020/02/28/202 …
  
  この方法だと「Google APPS Script」を用いないと利用できないことと、機器情報は取得できているようなのですが、実際の温度は取得しにいっていないようでした。
  
  それこそ「おんどとり公式サイト」のスマホ画面のような表示方法ができないかと思っています。
  できることならNotionという環境下のみで利用できることが希望ですが、外部サイトでPHPなどで実行した結果をiframeなどで埋め込むことも視野に入れています。
  
  どうかよろしくお願い致します。

    補足日時：2023/08/03 10:05

No.2 ベストアンサー 回答者： Ogre7077 回答日時： 2023/08/03 14:22

APIは公開されているので、使い方はそちらで調べましょう

https://ondotori.webstorage.jp/docs/api/index.html
https://developers.notion.com/

資料を軽く読んだ限りですが、基本設計は以下の方針になるかと思います
1. Notion にて特定 database か blocks をページ内に表示させる編集を行う
2. API を呼び出すサーバーサイドアプリを用意する
3. サーバーにて、おんどどり API を使い測定温度を取得する
4. サーバーにて、Notion API を使い database か blocks を更新する
5. 以上の呼び出しを定期的に行う

参考)
測定温度を取得する API
https://ondotori.webstorage.jp/docs/api/referenc …
database を更新する API
https://developers.notion.com/reference/update-a …

サーバーが必要な理由は、おんどどり FAQ の以下記述より
> HTMLコンテンツ上のJavaScriptから、
> 直接公開APIにリクエストを投げてレスポンスを受け取ることはできません
> 公開APIを利用できるサーバサイドアプリなどを作成ください

サーバサイドアプリを動かす環境ですが、大した性能は必要ないので
GAS やレンタルサーバー等の外部サービスでも
使っていないノートPC等を社内サーバに転用するでも
マイクロサーバーやラズベリーパイ等の小型機器をルーター横に設置でも
ご都合に沿った方式で運用しましょう

この回答へのお礼

教えていただきありがとうございました。GASを使って実現しようと思っています。次のコードの通りにしてみました。
function temps(){
const url = "https://api.webstorage.jp/v1/devices/latest-data"
const api_key = "xxxxx"
const login_id ="yyyyy"
const password = "zzzzz"
const room_temp = () => {
var paylord = {'api-key':api_key,"login-id":login_id,'login-pass':password}
var headers = {
"X-HTTP-Method-Override":'GET',
"Content-Type" : "application/json",}
var options = {
"method" : "post",
"payload" : JSON.stringify(paylord),
"headers" : headers,
"muteHttpExceptions":true
}
return UrlFetchApp.fetch(url,options);
}
return JSON.parse(room_temp())
}

ここまでは他サイト等で情報収集できたのですが、この後の実行結果がJSON形式として出力（表示）するにはどうやったら良いのでしょうか。

お礼日時：2023/08/04 10:03

No.1 回答者： fujillin 回答日時： 2023/08/03 14:19

こんにちは

「おんどとり」も「Notion」も全く存じませんけれど・・・

APIの説明には、
『JavaScriptにてデータを取得するといった利用方法については現時点では提供しておりません。
サーバサイドプログラムで取得したデータを一旦保存していただき、そのデータをご利用ください。』
https://ondotori.webstorage.jp/docs/api/
とあるので、いずれにしろAPIにリクエストするプログラムが必要になります。
（質問者様の環境で利用可能なプログラムで可能と思います）

＞データの取り込みとなると、CSVファイルのみ？にしか対応していないのでは？
CSVファイルが読み込めるのなら、固定のCSVを用意しておいて、上記のプログラムからCSVに変換して保存するようにしておけば良いのではないでしょうか？
（APIから返されるのはjsonのようですが）
旧いデータを保管するのか、最新データだけで良いのかなど、実際にはいろいろあると思いますが、このような仕組みにしておけば実現できるのではないでしょうか。

更新をどの程度の頻度で行う必要があるのか不明ですけれど、定間隔（30分とか15分など）で良いのなら、更新プログラムを定期的に動かす仕組みにしておけば済むでしょう。
逐次リクエストしたいのなら、Notion側からそのプログラムを呼び出せば良いでしょうけれど、Notionにそのような機能があるのかどうかは存じません。
（多分、可能なのではないかと推測しますが・・）