一般来讲,前端不会给后端接口,而是后端给前端接口的情况比较普遍。一些人可能不理解接口和前端开发的关系,其实不合适的接口设计会极大地影响用户的页面体验。那么今天我们就来看看,前端如何调用后端接口?有哪几种方式?
首先,要弄清楚前端提供一个接口或者调用后台接口,那么这个接口具体指什么?网上用户上传图片作为头像 这个需求需要后台人员处理,当用户登录 修改自己个人信息的时候,上传了头像。此时,后台处理该用户update个人信息,将该图片存入数据库,一般存的都是图片地址,string形式的数据。然后,要返回到前台的时候,后台人员需要对这些用户的个人信息进行处理,不只是头像,还有一些别的信息。后台通过语言编译,生成json格式的键值对(一般是json 还有xml txt 等数据格式)。生成一个地址也就是url,前台人员利用ajax,将返回的data显示到页面就好了。大体上来讲,接口一般指的是HTTP接口,也可以说是HTTP API。接口由后端提供,前端调用后端接口以获取后端数据。而且接口由URL和HTTP方法构成,URL为接口的地址,HTTP方法指的是GET, PUT, DELETE等等。
前端调用后端接口无外乎六种方法,如下:
1、打开vs,创建空的asp.net mvc演示项目【WebMVC】
(1)依次点击【文件】->【新建】->【项目】;
(2)在【新建项目】界面选择【Web】->【ASP.NET Web 应用程序(.NET Framework)】,输入名称,选择框架至少4.5版本,点击【确定】按钮;
(3)选择【空】->【MVC】->【确定】 ;
(4)创建好了项目。
2、在项目中
(1)在Controllers文件夹上点击鼠标右键,依次选择【添加】->【控制器】,即可完成HomeController的创建;
(2)在Controller的Index方法内,点击鼠标右键,选择【添加视图】;
(3)在项目中添加文件夹【Content】并添加jquery源文件;
(4)在Index页面添加jquery的引用。
3、在Index页面中添加一个输入文本框,一个按钮,以及显示结果的dom。
4、在HomeController中添加新的方法,用于接收前台传入的参数,组装后返回。
5、在Index页面,添加Jquery的ajax方式,调用后台接口,返回结果的处理代码。
6、在vs中,按F5调试运行结果,如下:
(1)在文本框中输入内容;
(2)点击按钮,调用接口,并将返回值显示在界面;
(3)如果要提交大量数据,或者敏感数据,请修改ajax的type方式,这样参数就不会在url地址栏中显示了。
本篇讲了接口的概念和前端调用后端接口的六种方式,希望对大家的前端开发项目能有所帮助。关于前端学习的更多疑问,大家可以上博学谷平台进行更加深入的学习。
— 申请免费试学名额 —
在职想转行提升,担心学不会?根据个人情况规划学习路线,闯关式自适应学习模式保证学习效果
讲师一对一辅导,在线答疑解惑,指导就业!
相关推荐 更多
HTML5开发APP有哪些优点和缺点?HTML5优势和劣势大对比
HTML5开发APP有哪些优点和缺点?对比起来看,HTML5开发APP的优势明显大于劣势。比如HTML5有跨平台,开发成本低,推广更容易等等优点,同时它也有着一些缺点,比如容易受到网络的限制,用户体验性一般,变现慢等问题。本文将为大家详细分析一下,HTML5开发移动APP的优势与劣势。
3664
2019-10-23 12:45:55
前端开发中绝对路径和相对路径的区别是什么?
前端开发中绝对路径和相对路径的区别是什么?绝对路径和相对路径主要的区别是域名是否是完全网站,起作用是相同的。绝对路径指的是包含域名的完整网址,相对路径指的是不包含域名的被链接页面相对于当前页面的相对网址。
3190
2020-07-16 11:51:15
前端免费实战项目在线练习
许多初学者在一开始学习前端的时候,都容易犯这样的错误:看了很多学习前端开发的教材和课程,但是动手什么都做不出来。这里给广大前端学习者一个建议,练习和实践绝对是学习前端最好的办法。不管大家理论知识掌握得再多,不能够活学活用也等于零。下面小编将给大家分享一些前端免费实战项目,大家可以赶紧动手在线练习!
2664
2020-07-27 17:33:33
VSCode小白级安装教程
对于开发者来说,一个好的开发工具往往能够事半功倍。比较常见的网页开发工具有Dreamweaver、Sublime、WebStorm、HBuilder、VSCode。看到这么多开发工具,是不是脑袋都要大了?不要担心,我们只需要掌握一款实用性最高的工具即可。而且这些开发工具基本使用方式类似,掌握一款其他的即可触类旁通。下面我们一起来看看网页开发工具VSCode小白级安装教程吧!
2218
2020-08-06 11:59:28
面试网易的前端工程有多难?问啥啥不会?
一个合格的前端需要扎实且前沿的知识体系,新形势下企业更注重前端工程师的综合能力。作为职场人都有感触,成功的面试大部分是愉快的交流过程,但不成功的面试却各有各的尴尬......近日一位程序员网友发帖吐槽:前端面试太难了,问啥啥不会都快面哭了。
246
2022-04-08 11:26:32
热门文章
- 狂野架构师学习效果好不好?互联网Java架构师前景怎么样?
- 博学谷狂野大数据学习效果好不好?课程怎么样?
- Redis持久化机制实现原理是什么?流程是什么?
- 万物互联是什么?会带来哪些改变?
- MySQL索引种类有哪些?底层实现原是什么
- 零基础转行IT互联网岗位月入过万需要多久?
- 从0搭建后端技术涉及到哪些知识点?
- 疫情下的医疗行业如何快速响应的?互联网技术功不可没
- 深度学习框架智能时代的操作系统是什么?
- 程序员第一次做项目是什么感受?需要注意什么? 查看更多
扫描二维码,了解更多信息
