zoukankan      html  css  js  c++  java
  • Vue.js——基于$.ajax实现数据的跨域增删查改

    之前我们学习了Vue.js的一些基础知识,以及如何开发一个组件,然而那些示例的数据都是local的。
    在实际的应用中,几乎90%的数据是来源于服务端的,前端和服务端之间的数据交互一般是通过ajax请求来完成的。

    说起ajax请求,大家第一时间会想到jQuery。除了拥有强大的DOM处理能力,jQuery提供了较丰富的ajax处理方法,它不仅支持基于XMLHttpRequest的ajax请求,也能处理跨域的JSONP请求。

    之前有读者问我,Vue.js能结合其他库一起用吗?答案当然是肯定的,Vue.js和jQuery一起使用基本没有冲突,尽可放心大胆地使用。

    本文的主要内容如下:

    同源策略和跨域概念
    跨域资源共享
    JSONP概念
    REST Web Services
    基于$.ajax实现跨域GET请求
    基于$.ajax实现JSONP请求
    基于$.ajax实现跨域POST请求
    基于$.ajax实现跨域PUT请求
    基于$.ajax实现跨域DELETE请求
    本文的服务端程序和客户端程序是部署在不同服务器上的,本文所有示例请求都是跨域的。
    源代码已放到GitHub,如果您觉得本篇内容不错,请点个赞,或在GitHub上加个星星!

    CORS GET JSONP GET CORS POST CORS PUT 完整CURD示例 GitHub Source
    基础概念
    在进入本文正题之前,我们需要先了解一些基础概念(如果你已经对这些基础有所了解,可跳过此段落)。

    同源策略和跨域概念
    同源策略(Same-orgin policy)限制了一个源(orgin)中加载脚本或脚本与来自其他源(orgin)中资源的交互方式。
    如果两个页面拥有相同的协议(protocol),端口(port)和主机(host),那么这两个页面就属于同一个源(orgin)。

    同源之外的请求都可以称之为跨域请求。

  • 相关阅读:
    Kubernetes 部署 Kubernetes-Dashboard v2.0.0
    Kubernetes 部署 Metrics Server 获取集群指标数据
    内网终端安全建设(转)
    内网安全运营的逻辑体系架构(转)
    thinkphp5配置文件
    MySQL索引失效的几种情况
    workman使用
    长连接技术(Long Polling)
    php好文章的记录
    php类与对象得使用场景
  • 原文地址:https://www.cnblogs.com/theau/p/14206779.html
Copyright © 2011-2022 走看看