Hvordan kan jeg skrive frontend "Ajax"

stemmer
0

I utgangspunktet, jeg jobber med et prosjekt om et ekteskap nettside. På siden, jeg har opprettet en ny seksjon for nylig lagt til profil .Jeg har skrevet koden i backend, men i frontend hva skal jeg skrive for å ringe til backend-kode. Jeg har brukt teknikken, men det fungerer ikke.

Kode som jeg har skrevet i Controller

module.exports.recent = function(req, res) {
    User.find({}).sort('-created').limit(5).exec(function(err, data){
      if (err) 
      {
        return res.status(400).json({
           message: errorHandler.getErrorMessage(err)
         })
      }
      res.json(req.profile,{
        user: req.user || null,
        request: req,
        users: data
      });

    });

};

Koden som jeg har skrevet i rute

app.route('/recent').get(users.recent);
Publisert på 02/09/2018 klokken 05:17
kilden bruker
På andre språk...                            


1 svar

stemmer
0

Til bredt svare på spørsmålet "hvordan kan kalle jeg backend koden fra frontend? - du ikke. Du gjør en forespørsel til ruten som kjører koden din, og deretter sende tilbake (sannsynligvis med res.json) et svar. Det er ingen måte å ringe direkte koden, så du trenger å gjøre en AJAX forespørsel (som du har identifisert).

Du kan bruke et par ting. Den enkleste, hvis du er på en moderne nettleser, er en funksjon fetch. fetcher en API lavt nivå for å gjøre AJAX samtaler fra nettleseren, og kommer innebygd i de fleste moderne nettlesere.

fetch('/recent')
  .then(res => res.json())
  .then(myResult => { /* do what you want with the result here */ })

Du kan lære mer om fetchfra MDN: https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API

Fordi fetcher ganske lavt nivå, er det ulike wrappers skrevet over den for å gjøre livet enklere. Min preferanse er axios, som du kan lese mer om på https://github.com/axios/axios . Følgende kode er den ekvivalente med axios:

axios.get('/recent')
  .then(res => res.data)
  .then(myResult => { /* do what you want with the result here */ })

axiosvirkelig kommer til sin rett da du utfører mer komplekse spørringer. Den støtter en UMD bunt via unpkg- bare slippe <script src="https://unpkg.com/axios/dist/axios.min.js"></script>inn på HTML-siden, og du vil ha tilgang til axiosglobalt på vinduet objektet.

Svarte 02/09/2018 kl. 08:45
kilden bruker

Cookies help us deliver our services. By using our services, you agree to our use of cookies. Learn more