簡體   English   中英

為什么我的瀏覽器從Express加載JSON響應?

[英]Why does my browser loading JSON response from Express?

內容:

我有一個帶有表單POST操作的網站。 我希望用戶將其電子郵件輸入表單。 電子郵件提交后,POST將發送到服務器。 使用Express和MailChimp API,我將此電子郵件與后端app.js文件保存到我的MailChimp帳戶中。

問題:

成功添加電子郵件后,我使用res.json()發送一個虛擬JSON對象。 目前,它只是一個虛擬JSON對象,但是將來我會用它發送成功詳細信息。 問題是我的瀏覽器從我的index.html重定向到顯示此JSON文件。 我不希望頁面重新加載或重定向到JSON響應。 我究竟做錯了什么?

真的很喜歡我能得到的任何幫助,謝謝:)

我試過了:res.end()和res.send()和res.sendStatus(200)

APP.JS(只是POST內容):

// Signup Route
app.post('/signup', (req, res) => {
    const {email} = req.body;

    console.log(req);

    // Make sure fields are fillled
    if(!email){
        res.redirect('/fail.html');
        return;
    }

    // Make request data
    const data = {
        members: [
            {
                email_address: email,
                status: 'subscribed',
                merge_fields: {} ///may need to remove this line....
            }
        ]
    };

    const postData = JSON.stringify(data);

    const options = {
        url: 'myprivateurl',
        method: 'POST',
        headers: {
            Authorization: 'myprivatekey'
        },
        body: postData
    };


    request(options, (err, response, body) => {
        if(err) {
            res.redirect('/fail.html');
        }
        else{
            if(response.statusCode == 200){
                //res.redirect('/success.html');
                console.log("server side success");
                res.json({
                        success: true,
                        message: "Some success message",
                        data: "some data if there's any"
                });
            }
                else{
                        res.redirect('/fail.html');
                }
        }
    });
});

HTML(僅表單形式):

 <!--Email List-->
            <div id="mailListHolder">
                SIGN UP FOR OUR MAIL LIST!
                <br>

                <div id="successtext"> Thanks! </div>
                <form id="emailform" action="/signup" method="POST">

                    <input name="email" type="text" placeholder="dopedude@mail.com" onfocus="this.placeholder = ''"/>
                    <input type="submit" />
                </form>
            </div>

CLIENT JS(僅用於表單):

$('#emailform').submit(function() {

    console.log("emailform submit case WORKING!");
    $("#emailform").css({
        "display": "none",
    });
    $("#successtext").css({
        "display": "block"
    });

    return false;
});

使用express進行用戶注冊的小示例:

新用戶注冊

 app.post('/api/user',(req,res)=>{ const user = new User({ email: req.body.email, password: req.body.password }); user.save((err,doc)=>{ if(err) res.status(400).send(err) res.status(200).send(doc) }) }) 

用戶模式

 const userSchema = mongoose.Schema({ email:{ type:String, required:true, trim:true, unique:1 }, password:{ type:String, required:true, minlength:6 } }) 

 const User = mongoose.model('User', userSchema ) 

或者您可以參考: https : //github.com/karenaprakash/nodejs-sec-and-auth.git

該項目是express.js的演示

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM