用jQuery怎么做到前后端分离
传统的web开发模式想必大家都知道,不管是jsp、asp、php或者一些魔板引擎开发,其实道理都是一样的,都是服务端渲染,原理是:浏览器发送一个get请求,服务器对应的返回前端一个html页面,由浏览器渲染,一张网页就呈现在用户面前了。
但是今天要说的就是大家一直在谈论的话题了,那就是“前后端分离的开发模式”,它的好处自然不必多说,那用我们最熟知jquery能不能做到前后端分离开发呢?答案是可以的!
具体实现也很简单,前端工程师通过ajax访问后台接口(可能会遇到跨域问题,详见上一篇文章)如下:
> $.ajax({
> type:'get',
> url:'/api',
> data:{user:'小明','tel':12345xxxxx}
> success:function(data){
> console.log(data)
> } })
通过一手ajax你可调用任何api,与后台通信不是什么难事。
但是渲染这块就很麻烦了,你可以选择的渲染方式有:append()、html()、text()等,总之很麻烦。
接下来说一说路由问题和页面之间传参问题,我用jQuery做的前后端分离项目一般没有路由,直接就是连接的形势跳转页面,虽然这样很不妥,但是好像也没啥办法。页面传参这哭基本可以解决,你可以通过地址栏传参,另一个页面通过js获取地址栏参数,进而实现地址栏传参这件事。
总之,jquery实现的前后端分离是不完美的,成本也是很高的,新手可以试试,建议学习vue或者angular.js 之类的高级框架。
有说的不对的地方欢迎技术大牛评论指正!以上仅代表我的个人观点。
用jQuery怎么做到前后端分离的更多相关文章
- nodeJS(express4.x)+vue(vue-cli)构建前后端分离详细教程(带跨域)
好想再回到大学宿舍,当时床虽小,房随小,但是心确是满的 ----致 西安工程大学a-114舍友们 转载请注明出处:水车:http://www.cnblogs.com/xuange306/p/6185 ...
- [转] 前后端分离开发模式的 mock 平台预研
引入 mock(模拟): 是在项目测试中,对项目外部或不容易获取的对象/接口,用一个虚拟的对象/接口来模拟,以便测试. 背景 前后端分离 前后端仅仅通过异步接口(AJAX/JSONP)来编程 前后端都 ...
- 前后端分离之前端项目构建(grunt+require+angular)
前言 前段时间做了一个项目,前端开发页面,然后把代码给到后端同学,后端同学通过vm再来渲染页面.后来才发现,这种方式简直是太low了,因为前端代码在服务端同学那里,每次前端需要更改的时候都需要去到服务 ...
- 架构设计:前后端分离之Web前端架构设计
在前面的文章里我谈到了前后端分离的一些看法,这个看法是从宏观的角度来思考的,没有具体的落地实现,今天我将延续上篇文章的主题,从纯前端的架构设计角度谈谈前后端分离的一种具体实现方案,该方案和我原来设想有 ...
- 利用grunt-contrib-connect和grunt-connect-proxy搭建前后端分离的开发环境
前后端分离这个词一点都不新鲜,完全的前后端分离在岗位协作方面,前端不写任何后台,后台不写任何页面,双方通过接口传递数据完成软件的各个功能实现.此种情况下,前后端的项目都独立开发和独立部署,在开发期间有 ...
- 【开源】分享一个前后端分离方案-前端angularjs+requirejs+dhtmlx 后端asp.net webapi
一.前言 半年前左右折腾了一个前后端分离的架子,这几天才想起来翻出来分享给大家.关于前后端分离这个话题大家也谈了很久了,希望我这个实践能对大家有点点帮助,演示和源码都贴在后面. 二.技术架构 这两年a ...
- AngularJS中在前后端分离模式下实现权限控制 - 基于RBAC
一:RBAC 百科解释: 基于角色的访问控制(Role-Based Access Control)作为传统访问控制(自主访问,强制访问)的有前景的代替受到广泛的关注.在RBAC中,权限与角色相关联,用 ...
- EF+jQueryUI前后端分离设计
开源项目练习EF+jQueryUI前后端分离设计 最近大家流行把项目开源,我也来玩玩.只是开源公司项目不好,小弟只好从公司项目经验上另外弄出一套练习开源给大家. 这个项目可以做简单的团队任务系统( ...
- js页码生成库,一个适合前后端分离的页码生成器
原文:js页码生成库,一个适合前后端分离的页码生成器 前言 上星期写的任务里面有需要进行分页的处理,git搜索了一番,没有觉得合适的,于是自己临时写了个分页的算法. 然后等闲下来的时候,决定把分页进行 ...
随机推荐
- activity 和 fragment 传递信息
acitvity 传递信息到fragment 初始化fragment 时可以传递arguments 该参数类型时Bundle activity 会持有fragment引用 通过通过参数的set方法 ...
- 3dmax2018卸载/安装失败/如何彻底卸载清除干净3dmax2018注册表和文件的方法
3dmax2018提示安装未完成,某些产品无法安装该怎样解决呢?一些朋友在win7或者win10系统下安装3dmax2018失败提示3dmax2018安装未完成,某些产品无法安装,也有时候想重新安装3 ...
- HihoCode-1053-居民迁移
解法: 一开始不会做,看到标签说是贪心加二分忽然就会了,二分是分的是人口最多居住点的人口,检查人口最多的居住点人口为mid是否可行.贪心是如果从左往右循环就尽量把人口往左迁移,如果从右往左循环就尽量把 ...
- 第十六届“二十一世纪的计算”学术研讨会 牛津大学肿瘤成像学教授Michael Brady主题演讲
Computing and Healthcare 牛津大学肿瘤成像学教授Michael Brady主题演讲" title="第十六届"二十一世纪的计算"学术研讨 ...
- WordPress快速打造个人博客
前些天用wordpress搭建了现在这个博客,所以总结了一篇文章,讲讲怎么样简单的创建一个博客.开始前这里有篇我搭建时所遇到的问题可以作为参考<WordPress建站注意事项>,首先我们要 ...
- 了解DocumentFragment 给我们带来的性能优化
首先我们需要了解 DocumentFragment 是什么? w3c 上面的详细解释:link here 我把关键点写下来了: DocumentFragment 节点不属于文档树,继承的 parent ...
- 饿了么vue实现学习笔记
技术栈:vue2 + vuex + vue-router + webpack + ES6/7 + fetch + sass + flex + svg以功能实现着手学习1. 定位功能 home.vue ...
- Rancher安装多节点高可用(HA)
Rancher版本:Rancher v1.0.1 基本配置需求 多节点的HA配置请参照单节点需求 节点需要开放的端口 全局访问:TCP 端口22,80,443,18080(可选:用于在集群启动前 查看 ...
- php捕获致命错误
php捕获致命错误 记录php错误日志可以有力的帮我们查找问题.修复bug,php提供了set_error_handler.set_exception_handler来捕获错误和异常.但是set_er ...
- Matplotlib简单回顾
import numpy as np from pylab import * from matplotlib import pyplot as plt x = [1, 2, 3, 4] y = [3, ...