sql >> データベース >  >> NoSQL >> MongoDB

条件に基づいて別のページにリダイレクトしたい

    Ajaxまたは他のメソッドからのAPI呼び出しを使用してリクエストを送信している場合は、そうすることはできません。

    これらのメソッドはすべて、シングルページアプリケーションを実装するためのものです。 、したがって、別のページをレンダリングすることは許可されていません。

    条件が満たされ、別のページのレンダリングを要求するとどうなりますか?

    APIを呼び出したモジュールは、ブラウザで応答を待ってAPIから応答を取得しますが、APIはブラウザが禁止している別のHTMLページを読み込もうとしているため、Ajax呼び出しでレンダリングされることはありません。

    どうすればいいですか?

    解決策は2つあります:

    1. シングルページアプリケーション:AngularJsなどのJavaScriptフレームワークを使用すると、ReactJsは、ページ全体ではなくHTMLテンプレートを変更するだけで役立ちます。

    Ajaxを使用すると、これを行うことができます:

    HTML

    <body>
        <div>   
            <div align="center">
            <form id="form1">
                <label>Please enter below details</label><br><br>
                <label>First Name *: </label><input id="FName" type="text" name="FName"/><br><br>
                <label>Last Name *: </label><input id="LName" type="text" name="LName"/><br><br>         
                <label>Email Address *: </label><input type="email" name="email"><br><br>
                <br><br>
                <input type="button" value="Submit" onClick:"submitForm()"/>
            </form>
            <div id="showValue"></div>
            </div>
        </div>
    </body>
    

    JavaScript

    function submitForm() {
        $.ajax({
            url: '/addName',
            type: 'POST',
            headers: headers,
            data: {
                "Fname": $("#FName").val(),
                "Lname": $("#LName").val(),
                "email": $("#email").val()
            },
            success: function(result) {
                //append result to your html
                //Dynamic view
                $("#form1").hide();
                var html = '<div><span>First Name: ' + result.fName + '</span><span>Last Name: ' + result.lName + '</span></div>';
                $("#showValue").html(html);    
            },
            error: function (error) {
                alert('error ',error);
            }
        });
    }
    

    Express.jsとbody-parserを使用していると想定しているサーバー側のコード

    app.post('/addName', (req, res) => {
        //Insert into db
        var body = req.body;
        res.send({
        fName: body.FName,
        lName: body.LName
        });
    });
    
    1. formを使用する 送信方法:これを使用すると、ページをレンダリングできますが、同じページに応答を送り返すことはできません。つまり、

    HTML

    <body>
        <div>   
            <div align="center">
            //Can't send params using this approach
            //Data will be send as query string
            <form action="/postedUser/" method="GET">
                <label>Please enter below details</label><br><br>
                <label>ID *: </label><input id="ID" type="text" name="ID"/><br><br>
                <input type="submit" value="Submit" /></form>
            </div>
        </div>
    </body>
    

    NodeJS

    //If there will be res.send({});
    // This won't be returned to same page. But your code doesn't do any such thing
    
    router.get('/postedUser/', ensureAuthenticated, function(req, res) {
       User.findOne({_id: req.query.id}, function(err, data) {
            if (err) throw err;
            if (req.user._id == data._id) {
            res.redirect('/users/profile');
            } else {
            res.render('postedUser', {
                data: data
            });
            }
        });
    });
    



    1. Linuxファイルシステムを使用しているWindows用のDockerでmongoDbコンテナを実行できません

    2. Mlabに保存されているオーディオの取得-バイナリファイル-

    3. リモートmongoDBサーバーへの接続

    4. pymongoを使用してmongodbドキュメントを読んで更新するための最良の方法