Ratnopam Chakrabarti é um desenvolvedor de software que trabalha atualmente para a Ericsson Inc. Ele tem se concentrado em IoT, tecnologias máquina a máquina, carros conectados e domínios de cidades inteligentes por um bom tempo. Ele adora aprender novas tecnologias e colocá-las em prática. Quando não está trabalhando, gosta de passar o tempo com seu filho de 3 anos.
Em Parte 1 desta série do blogNa publicação anterior, vimos como podemos armazenar e recuperar metadados de imagens de e para um bucket do Couchbase. Nesta postagem (Parte 2), daremos uma olhada nos recursos "curtir" e mostrar por nome de usuário do aplicativo.
A ideia aqui é usar HTML e jQuery no lado do cliente que interagem com os componentes do nó, como route.js, em execução no lado do servidor. Por exemplo, o seguinte snippet de jQuery fica no lado do cliente e faz uma chamada Ajax para o "URL" que é exposto como um rota dentro do route.js no lado do servidor.
O como é um elemento de âncora no qual, ao clicar, uma nova rota é chamada no aplicativo de nó. Aqui está o snippet:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 |
$(document).on('click', '.like', function(e){ console.log('Like clicked'); var that = $(this); var URL = host + '/like/' + that.data('photoid'); ajax({ url: URL, success:function(data){ var parseData = JSON.parse(data.response); that.find('h4').html(parseData.likes); } }) }) |
O URL é formado anexando '/like/' e o ID da imagem ao campo hospedeiro variável. Quando a chamada Ajax é feita com sucesso, o retorno de chamada de sucesso correspondente analisa a resposta JSON enviada de volta do ponto de extremidade do lado do servidor (routes.js).
A rota correspondente para isso (em routes.js) é mostrada abaixo:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 30 31 32 33 |
router.get('/like/:id', function(req, res, next){ ImageModel.getByDocumentId(req.params.id, function(err, result){ var jsonFromDB = JSON.stringify(result); var docFromDBArr = JSON.parse(jsonFromDB); var docFromDB = docFromDBArr[0]; var likes = docFromDB.likes; // increment the like by 1 likes = likes + 1; docFromDB.likes = likes; ImageModel.save(docFromDB, function(error, result) { if(error) { return res.status(400).send(error); } res.status(200).send({likes:docFromDB.likes}); }) }) }) |
A rota acima atende à chamada do jQuery do lado do cliente e também envia de volta uma resposta HTTP de 200 e um corpo de resposta JSON.
A rota faz uma chamada para o getByDocumentId exposta pelo ImageModel. Essa função, conforme mostrado abaixo, recupera um documento do bucket do Couchbase com base no ID do documento passado como argumento. Depois que o documento é recuperado com êxito, o resultado é analisado e a função "curtidas" é incrementado em 1. O documento atualizado é salvo chamando a função save().
A função getByDocumentId (definida no arquivo recordmodel.js):
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27 28 29 |
/* * Get a particular document from Couchbase Server using a parameterized N1QL query */ ImageModel.getByDocumentId = function(documentId, callback) { var statement = "SELECT META(photos).id, filename, likes, tags " + "FROM `" + config.couchbase.bucket + "` AS photos " + "WHERE META(photos).id = $1"; var query = N1qlQuery.fromString(statement); db.query(query, [documentId], function(error, result) { if(error) { return callback(error, null); } callback(null, result); }); }; |
Mostrar imagens por TagName
Para listar imagens por uma determinada tag, precisamos fazer o seguinte:
- Passa o nome da imagem quando a âncora é clicada
- Use o nome da imagem para filtrar as imagens
O nome da marca é passado pelo seguinte jQquery simples:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
$(document).on('click', '.showTag', function(e){ var that = $(this); var tagURL = host + '/getimages/' + that.data('tagname'); ajax({ url: tagURL, success:function(data){ var imageList = JSON.parse(data.response); renderImagesByTag (imageList); } }) }) |
E a rota correspondente:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 |
router.get('/getimages/:tagname', function(req, res, next){ console.log('inside getimages by tagname'); ImageModel.getImagesByTag(req.params.tagname, function(err, result){ var jsonFromDB = JSON.stringify(result); res.send(JSON.stringify(result)); }) }) |
O getImagesByTag é descrita a seguir:
|
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 |
ImageModel.getImagesByTag = function(tagName, callback) { var statement = "SELECT META(photos).id, filename, likes, tags " + "FROM `" + config.couchbase.bucket + "` AS photos WHERE $1 IN tags"; var query = N1qlQuery.fromString(statement); db.query(query, [tagName], function(error, result) { if(error) { return callback(error, null); } callback(null, result); }); }; |
Ele simplesmente executa a seguinte consulta usando o N1QL:
selecione filename, likes from photogallery where IN tags;
Isso permite a filtragem com base em tagname, onde tags é uma matriz de cadeias de caracteres.
Portanto, se tivermos duas imagens com a mesma tag, a consulta acima deverá retornar as duas imagens.
Aqui, ambos os documentos têm uma tag comum chamada "Blossom." Agora, se executarmos a consulta usando o Couchbase Query Workbench, obteremos o seguinte resultado:
Como esperado, você pode ver que dois registros são retornados. Isso é, na verdade, o que está acontecendo no getImagesByTag () função.
Solução de problemas
Durante a instalação do npm, se você encontrar o seguinte erro,
Não é possível encontrar o executável do Python "python", você pode definir a variável de ambiente PYTHON
faça o seguinte para se livrar do erro:
Instalar o python
Adicionar python ao caminho
Isso deve resolver o erro... pelo menos foi o que aconteceu comigo.
Esta postagem faz parte do Programa de Redação da Comunidade Couchbase
