常連

### 前提・実現したいこと
Monaca,ncmb,pusherを用いて[mBaaSとPusherを使ってチャットアプリを作る](https://blog.mbaas.nifcloud.com/entry/2018/02/28/103030)を読み進めながらチャットアプリを作っています。
サンプルコード通りにやってもMonacaのアプリからncmbのスクリプトを通じてデータストアへ書き込みができない上に、pusherから戻ってきません。

### 発生している問題・エラーメッセージ

- ncmbのデータベースへncmbのスクリプトを用いて保存ができない
- pusherからのレスポンスがなく、入力した文字が表示されない
### 該当のソースコード
index.html
```html
<!DOCTYPE HTML>
<html>
<head>
  <meta charset="utf-8">
  <meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
  <meta http-equiv="Content-Security-Policy" content="default-src * data: gap: https://ssl.gstatic.com; style-src * 'unsafe-inline'; script-src * 'unsafe-inline' 'unsafe-eval'">
  <script src="components/loader.js"></script>
  <script src="lib/onsenui/js/onsenui.min.js"></script>

  <link rel="stylesheet" href="components/loader.css">
  <link rel="stylesheet" href="lib/onsenui/css/onsenui.css">
  <link rel="stylesheet" href="lib/onsenui/css/onsen-css-components.css">
  <link rel="stylesheet" href="css/style.css">
  <script src="https://js.pusher.com/4.3/pusher.min.js"></script>//最新のものに変更
  <script src="js/app.js"></script>
</head>
<body>
  <ons-navigator swipeable id="nav" page="login.html"></ons-navigator>
  <template id="login.html">
    <ons-page id="login">
      <div class="join-area" style="text-align: center; margin-top: 30px;">
        <h4>チャットルームにログインしてください</h4>
        <p>
          <ons-input id="userName" modifier="underbar" placeholder="ユーザ名" float></ons-input><br><br>
          <ons-input id="chatId" modifier="underbar" placeholder="chatId" float></ons-input>
        </p>
        <p style="margin-top: 30px;">
          <ons-button onclick="join()">Join</ons-button>
        </p>
      </div>
    </ons-page>
  </template>
</body>
</html>
```
chat.html
```html
<ons-page id="chat">
  <ons-toolbar>
    <div class="left"><ons-back-button>Back</ons-back-button></div>
    <div class="center"></div>
  </ons-toolbar>
  <input type="hidden" id="channelId" />
  <div class="chat-area">
    <ons-list id="chats"></ons-list>
  </div>
  <div class="send-area">
    <ons-input id="message" placeholder="メッセージ"></ons-input>
    <ons-button onclick="send()" modifier="quiet">送信</ons-button>
  </div>
</ons-page>
```
app.js
```javascript
// This is a JavaScript file
let pusher;
let ncmb;
const pusherId = 'MY_PUSHER_ID';
const applicationKey = 'MY_APPLICATION_KEY';
const clientKey = 'YOUR_CLIENT_KEY';

// グローバル変数の処理
ons.ready(function() {
///////////////////////////////////////////////////////////////////////////////////////////////////
//サンプルコードから変更
  pusher = new Pusher(pusherId, {
    cluster: 'ap1',
    forceTLS: true
  });
//////////////////////////////////////////////////////////////////////////////////////////////////
  ncmb = new NCMB(applicationKey, clientKey);
});

// 初期表示処理
$(document).on('init', (event) => {
  if (event.target.id === 'login') {
    $('#chatId').val('channel');
    const userName = localStorage.getItem('userName');
    if (userName)
      $('#userName').val(userName);
  }
});

// チャット画面を表示したときの処理
$(document).on('show', (event) => {
  if (event.target.id === 'chat') {
    const data = event.target.data;
    $('#channelId').val(data.chatId);
    connectPusher(data.userName, data.chatId);
    loadChat(data.userName, data.chatId);
  }
});

// チャット画面から戻った時の処理
$(document).on('hide', (event) => {
  if (event.target.id === 'chat') {
    pusher.unsubscribe($('#channelId').val());
  }
});

// チャットルームにログインする処理
const join = () => {
  const userName = $('#userName').val();
  if (userName === '') {
    ons.notification
      .alert('ユーザ名を決めてください');
    return;
  }
  localStorage.setItem('userName', userName);
  const chatId = $('#chatId').val();
  $('#nav')[0].pushPage('chat.html', {
    data: { userName, chatId }
  })
}
// Pusherに接続する処理
const connectPusher = (userName, chatId) => {
  const channel = pusher.subscribe(chatId);
  channel.bind('message', function(data) {
    showChat(userName, data);
  });
};

// 既存のチャットメッセージを読み込む処理
const loadChat = (userName, channel) => {
  const Chat = ncmb.DataStore('Chat');
  Chat
    .equalTo('channel', channel)
    .fetchAll()
    .then(chats => {
      for (let chat of chats) {
        showChat(userName, chat);
      }
    });
}

// メッセージを一つ表示する処理
const showChat = (userName, data) => {
  if (data.userName == userName) {
    $('#chats').append(`
      <ons-list-item modifier="nodivider">
        <div class="right">
          <ons-button style="background-color: green">${data.message}</ons-button>
        </div>
      </ons-list-item>`);
  }else{
    $('#chats').append(`
      <ons-list-item modifier="nodivider">
        <ons-button>${data.message}</ons-button>
        <span class="list-item__subtitle">${data.userName}</span>
      </ons-list-item>`);
  }
}

// メッセージ送信処理
const send = () => {
  const message = $('#message').val();
  const userName = localStorage.getItem('userName');
  const channel  = $('#channelId').val();

  ncmb.Script
      .data({
        userName,
        message,
        channel
      })
      .exec("POST", "push.js")
      .then(function(res){
        $('#message').val('');
      })
      .catch(function(err){
      });
};
```
push.js
```javascript
const crypto  = require("crypto");
const request = require('superagent');
const NCMB    = require('ncmb');

module.exports = (req, res) => {  
    const applicationKey = 'MY_APPLICATION_KEY';
    const clientKey = 'MY_CLIENT_KEY';
    saveDataStore(
        applicationKey,
        clientKey,
        req.body
    ).then(() => {
        return sendPusher(
//////////////////////////////////////////////////////////////////////////////////
//サンプルコードから変更
            'MY_PUSHER_KEY',
            'MY_PUSHER_SECRET',
            'MY_PUSHER_APP_ID',
//////////////////////////////////////////////////////////////////////////////////
            req.body
        )
    })
    .then((response) => {
        res.json({});
    })
    .catch((err) => res.status(401).json(err));
};

const saveDataStore = (applicationKey, clientKey, body) => {
    const ncmb = new NCMB(applicationKey, clientKey);
    const Chat = ncmb.DataStore('Chat');
    const chat = new Chat;
    return chat
        .set('channel', body.channel)
        .set('userName', body.userName)
        .set('message', body.message)
        .save()
}

const sendPusher = (authKey, secretKey, appId, body) => {
    const authTimestamp = Date.now() / 1000;
    const authVersion = '1.0';
    const medhod = 'POST';
    const path = `/apps/${appId}/events`;
    const message = {
        data: JSON.stringify({
            userName: body.userName,
            message: body.message
        }),
        name: "message",
        channel: body.channel
    };
    const bodyMd5 = crypto
        .createHash('md5')
        .update(JSON.stringify(message))
        .digest('hex');
    const queryString = `auth_key=${authKey}&auth_timestamp=${authTimestamp}&auth_version=${authVersion}&body_md5=${bodyMd5}`;
    const authSigning = [
        medhod,
        path,
        queryString
    ].join("\n");
    const signature = crypto
        .createHmac("SHA256", secretKey)
        .update(authSigning)
        .digest("hex");
    return request
        .post(`https://api.pusherapp.com${path}?${queryString}&auth_signature=${signature}`)
        .set('Content-Type', 'application/json')
        .send(JSON.stringify(message))
}
```

### 試したこと
- new Pusherのところを変えた
最初、そもそもpusherのインスタンスを作れてないエラーが出てpusherのページのチュートリアルではnew Pusherの所がサンプルコードと違ったのでそれに合わせて変更した。
- アプリ側からデータストアへ書き込みした
**最初にサンプル通りやった時はncmbのスクリプト側からデータストアへ書き込みだけはできた**(後述)のでncmb側の不具合でスクリプトが上手く動いてないのかと思いアプリ側からデータストアへ書き込みをした結果、アプリ側からは書き込みはできた。
- push.jsのpusherへの接続関連をコメントアウトした
とりあえずデータストアへ書き込みだけでもできるようしたくて、push.jsのpusherへの接続関連でエラーを起こしているのではないかと思った。なので、そこだけコメントアウトして動かしてみた結果、データストアへ書き込めなかった。
## 補足情報
**最初にサンプル通りにやった時はデータストアへの書き込みが出来ました。**どこかをいじってるタイミングでデータストアへ書き込めなくなる。再現しようとアプリやncmb、pusherのプロジェクトを変えてサンプルコードをコピペし直しても再現不可能でした。

返答よろしくお願いします

	@@ -1 +1 @@
1	- NCMBのデータストアに書き込めず、Pusher API~~と通信~~ができない
1	+ NCMBのデータストアに書き込めず、Pusher APIからレスポンスがない

質問編集履歴