热门标签 | HotTags
当前位置:  开发笔记 > 编程语言 > 正文

Falcor学习一基本使用

falcor是netflix公司为了解决自己api数据查询所开发的查询框架,很不错(尽管netflix也在用graphql)以下是falcor的一个简单使用,基于express框架

falcor 是netflix 公司为了解决自己api数据查询所开发的查询框架,很不错(尽管netflix 也在用graphql )以下是falcor 的

一个简单使用,基于express 框架,使用服务器端提供model.json

一张参考图

技术分享图片

 

 

server 端代码



  • 初始化项目









 


yarn init -y











  • 添加依赖










yarn add cors express falcor falcor-express falcor-router











  • package.json 文件










{


"name": "netflix-falcor",


"version": "1.0.0",


"main": "index.js",


"license": "MIT",


"dependencies": {


"cors": "^2.8.5",


"express": "^4.17.1",


"falcor": "^2.1.0",


"falcor-express": "^0.1.4",


"falcor-router": "^0.8.3"


},


"scripts": {


"a": "node index"


}


}











  • index.js










// index.js


const falcorExpress = require(‘falcor-express‘);


const Router = require(‘falcor-router‘);


const cors = require(‘cors‘)


const express = require(‘express‘);


const app = express();


app.use(cors({


origin: function (origin, callback) {


callback(null,true)


},


credentials:true


}))


app.use(‘/model.json‘, falcorExpress.dataSourceRoute(function (req, res) {


// create a Virtual JSON resource with single key (‘greeting‘)


return new Router([


{


// match a request for the key ‘greeting‘


route: ‘greeting‘,


// respond with a PathValue with the value of ‘Hello World.‘


get: () => ({path: [‘greeting‘], value: ‘Hello World‘})


}


],


{


// match a request for the key ‘greeting‘


route: ‘username‘,


// respond with a PathValue with the value of ‘Hello World.‘


set: () => ({path: [‘username‘], value: ‘dalong‘})


});


}));


?


// serve static files from current directory


app.use(express.static(__dirname + ‘/‘));


?


app.listen(3000);







 





  • 简单说明

    使用falcor-router 提供model.json 服务,为了方便使用基于http 的访问,添加了cors

    使用了cors 包,提供了一个简单的get 服务 greeting


web 客户端

使用简单的html


  • index.html












<html>


<head>




<script src="./falcor.browser.min.js"></script>






<script>


var model = falcor({source: new falcor.HttpDataSource(‘http://localhost:3000/model.json‘) });


?


// retrieve the "greeting" key from the root of the Virtual JSON resource


model.


get(‘greeting‘).


then(function(response) {


document.write(response.json.greeting);


});


</script>


</head>


<body>


</body>


</html>










docker 集成



  • server dockerfile










FROM node:alpine


LABEL AUTHOR="dalongrong"


LABEL EMAIL="1141591465@qq.com"


WORKDIR /app


COPY index.js /app/index.js


COPY package.json /app/package.json


COPY yarn.lock /app/yarn.lock


RUN yarn


EXPOSE 3000


ENTRYPOINT [ "yarn","a" ]











  • web dockerfile

    基于nginx










FROM openresty/openresty:1.15.8.2-1-alpine


COPY index.html /app/


COPY falcor.browser.min.js /app/


EXPOSE 8080


COPY nginx.conf /usr/local/openresty/nginx/conf/nginx.conf











  • docker-compose 文件










version: "3"


services:


app:


build: ./


ports:


- "3000:3000"


web:


build:


context: ./


dockerfile: Dockerfile-web


ports:


- "8080:8080"










启动&&效果



  • 启动










docker-compose up -d











  • 效果

技术分享图片

 

 

说明

falcor 提供了一套自己json graph 同时包含了一套很方便的查询语言,后续会在写相关的使用

参考资料

https://netflix.github.io/falcor/


推荐阅读
  • 本文介绍了FTP(文件传输协议)的基础知识,包括其定义、如何通过TCP建立控制和数据连接,以及主动模式与被动模式的区别。FTP作为一种重要的文件传输协议,在互联网数据交换中扮演着关键角色。 ... [详细]
  • 近期在维护旧项目时遇到一个问题,在iOS8环境下,UILabel无法正常显示文本。通过深入分析,我们发现这一现象与UILabel的使用方式有关,特别是在嵌套UILabel的情况下。 ... [详细]
  • 华为交换机VLAN间通信配置指南
    本文详细介绍了如何在华为交换机上配置VLAN间的通信,包括VLAN的创建、VLAN接口的配置以及Trunk和Access端口的设置。通过具体步骤指导读者完成网络配置,确保不同VLAN之间的设备能够互相访问。 ... [详细]
  • 这个报错出现在userDao里面,sessionfactory没有注入。解决办法:spring整合Hibernate使用test测试时要把spring.xml和spring-hib ... [详细]
  • 本文深入探讨了PHP电商网站的开发成本,涵盖从基础建站到高级定制的各种费用因素。 ... [详细]
  • 本文讨论了在处理分页数据时常见的低级错误,并提供了优化后的代码示例,以减少重复代码并提高可读性和维护性。 ... [详细]
  • 本题要求根据给定的正整数数组,通过合理排列各元素顺序,生成并输出所有可能组合中的最小值。例如,对于数组{3, 32, 321},正确的输出应为321323。 ... [详细]
  • 本文介绍了DOM中用于获取节点信息的关键属性,包括父节点、子节点列表、首个及末个子节点、相邻兄弟节点以及节点类型等,同时提供了每个属性的具体使用说明。 ... [详细]
  • 端到端自动化测试框架设计 - 以京东商品搜索为例的Web应用测试
    本文将对前文介绍的京东商品搜索功能的端到端自动化测试进行总结,涵盖使用WebStorm、Node.js、Mocha、WebDriverIO及Selenium构建的测试环境,并特别讨论了如何通过会话保持用户登录状态。 ... [详细]
  • 利用Selenium框架解决SSO单点登录接口无法返回Token的问题
    针对接口自动化测试中遇到的SSO单点登录系统不支持通过API接口返回Token的问题,本文提供了一种解决方案,即通过UI自动化工具Selenium模拟用户登录过程,从浏览器的localStorage或sessionStorage中提取Token。 ... [详细]
  • 本文详细对比了MySQL中的InnoDB与MyISAM两种存储引擎,从性能、事务处理能力、锁机制等多个维度进行了深入探讨,旨在为数据库设计者提供选择依据。 ... [详细]
  • 本文深入探讨了锚点技术的应用与实现,通过十个关键点帮助读者全面理解锚点在网页设计中的作用。 ... [详细]
  • Python安全实践:Web安全与SQL注入防御
    本文旨在介绍Web安全的基础知识,特别是如何使用Python和相关工具来识别和防止SQL注入攻击。通过实际案例分析,帮助读者理解SQL注入的危害,并掌握有效的防御策略。 ... [详细]
  • 本文探讨了在使用 ClickOnce 部署方式时遇到的自动更新失败问题,包括本地安装与服务器安装的不同表现,并提供了详细的解决方案。 ... [详细]
  • Android开发经验分享:优化用户体验的关键因素
    随着Android市场的不断扩展,用户对于移动应用的期望也在不断提高。本文探讨了在Android开发中如何优化用户体验,以及为何用户体验的重要性超过了技术本身。 ... [详细]
author-avatar
幸福guaiguai乐园
这个家伙很懒,什么也没留下!
PHP1.CN | 中国最专业的PHP中文社区 | DevBox开发工具箱 | json解析格式化 |PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | 在线工具
Copyright © 1998 - 2020 PHP1.CN. All Rights Reserved | 京公网安备 11010802041100号 | 京ICP备19059560号-4 | PHP1.CN 第一PHP社区 版权所有