Como faço para escrever frontend "ajax"

votos
0

Basicamente, eu estou trabalhando em um projeto em um site de casamento. Na página, eu criei uma nova secção de perfil recentemente adicionado .Eu ter escrito o código no backend, mas no frontend o que devo escrever para chamar o código backend. Eu tenho usado a técnica, mas ele não está funcionando.

O código que eu tenho escrito no Controlador

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
      });

    });

};

O código que eu escrevi na rota

app.route('/recent').get(users.recent);
Publicado 02/09/2018 em 05:17
fonte usuário
Em outras línguas...                            


1 respostas

votos
0

Para responder amplamente a sua pergunta de "como faço para chamar o código backend do frontend? - você não. Você faz um pedido para a rota que executa o seu código, e depois enviar de volta (provavelmente com res.json) uma resposta. Não há nenhuma maneira de chamar diretamente o código, então você vai precisar fazer uma solicitação AJAX (como você já identificou).

Você pode usar um par de coisas. O mais fácil, se você estiver em um navegador moderno, é uma função fetch. fetché uma API de baixo nível para fazer chamadas AJAX a partir do navegador, e vem built-in para navegadores mais modernos.

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

Você pode aprender mais sobre fetchdo MDN: https://developer.mozilla.org/en-US/docs/Web/API/Fetch_API

Porque fetché bastante baixo nível, existem vários invólucros escrito sobre ele para tornar a vida mais fácil. Minha preferência é axios, que você pode ler mais sobre a https://github.com/axios/axios . O código seguinte é o equivalente com axios:

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

axiosrealmente entrar em seu próprio quando você está realizando consultas mais complexas. Ele suporta um pacote UMD via unpkg- apenas uma gota <script src="https://unpkg.com/axios/dist/axios.min.js"></script>em sua página HTML, e você terá acesso a axiostodo o mundo sobre o objeto janela.

Respondeu 02/09/2018 em 08:45
fonte usuário

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