2017-08-18 4 views
1

こんにちはをレンダリングしていません:リダイレクトは、私はこのようなフォームをレンダリング反応する成分を有していて、次のページ

handleSubmit(e) { 
    var self = this; 
    e.preventDefault(); 
    const {value1, value 2, ....} = this.state; 
    axios.post('/results', { 
     key1 : value1, 
     key2 : value2, 
     etc. 
    }).then(function(response) { 
     if (errors) { 
      self.setState({errors: response.data.errorMessage}); 
     } 
    }).catch(function(error){ 
     console.log(error); 
    }); 
    } 

私は、データベースにフォームからのデータを挿入し、私のserver.jsでPOSTリクエストのためのルートハンドラを持っています。エラーがあれば、そのデータをクライアントに送り返します。それ以外の場合は結果ページにリダイレクトします。私は結果ページのための適切な経路を描画する必要があり、別のapp.get('/results/:caseId')ハンドラを持っている

app.post('/results', function(req, res, next) { 
    const reportExists = Report.findOne({ 
    attributes: ['caseId'], 
    where: {caseId : req.body.caseId}, 
    }).then(report => { 
    if (report) { 
     console.log("report already exists"); 
     res.status(200).send({errorMessage : "Report has been submitted for this case id"}); 
    } else { 
     const report = Report.create(
     { 
      // data from form 
     } 
    ).then(() => { 
     console.log('Record inserted successfully'); 
     var caseId = req.body.caseId; 
     res.redirect("/results/" + caseId); 
     next(); 
     }) 
     .catch(err => { 
     console.log('failed to insert record'); 
     res.status(200).send({errorMessage: "Failed to insert record"}); 
     }); 
    } 
    }); 
}); 

:ハンドラは次のようになります。しかし、レコードが正常に挿入されると、そのページにリダイレクトされず、フォームと同じページにとどまります。私の質問は、私はクライアントまたはサーバーからそのページにリダイレクトする必要がありますか?

+0

'res.redirect()'の後に 'next()'を呼び出さないでください。 – jfriend00

答えて

1

クライアント側のJavascriptでAjax呼び出しを送信するだけで、サーバからの応答が返されます。リダイレクトはブラウザによって自動的に処理されません。これはjavascriptに対するajaxの応答です。リダイレクトレスポンスで何をすべきかを決めるのはクライアント側のJavascriptの責任です。

カップルの選択肢があります。リダイレクト応答をクライアントサイドのJavascriptで検出してから、新しい場所にwindow.locationを設定し、手動でブラウザに新しいページに行くように指示します。または、ブラウザがクライアントサイドのJavaScriptではなくフォームを送信するようにすると、ブラウザは自動的にリダイレクト応答に従います。あなたがres.redirect()を呼び出した後


また、あなたはnext()を呼び出すべきではありません。応答を送信したら、他のルートハンドラを実行できるようにするべきではありません。

関連する問題