本文讲解跨域请求到底是怎么回事,在Gateway中如何配置.以及扩展了ART-TEMPLATE的使用办法

笔记对应学习视频:

https://www.itlaoqi.com/chapter/2673.html

本节我们结合前端H5应用学习如何处理微服务的CORS跨域请求

• 为什么会出现跨域问题

出于浏览器的同源策略限制。同源策略（Sameoriginpolicy）是一种约定，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的，浏览器只是针对同源策略的一种实现。同源策略会阻止一个域的javascript脚本和另外一个域的内容进行交互。所谓同源（即指在同一个域）就是两个页面具有相同的协议（protocol），主机（host）和端口号（port）

• 什么是跨域

当一个请求url的协议、域名、端口三者之间任意一个与当前页面url不同即为跨域

当前页面url	被请求页面url	是否跨域	原因
http://www.test.com/	http://www.test.com/index.html	否	同源（协议、域名、端口号相同）
http://www.test.com/	https://www.test.com/index.html	跨域	协议不同（http/https）
http://www.test.com/	http://www.baidu.com/	跨域	主域名不同（test/baidu）
http://www.test.com/	http://blog.test.com/	跨域	子域名不同（www/blog）
http://www.test.com:8080/	http://www.test.com:7001/	跨域	端口号不同（8080/7001）

• 非同源限制

【1】无法读取非同源网页的 Cookie、LocalStorage 和 IndexedDB

【2】无法接触非同源网页的 DOM

【3】无法向非同源地址发送 AJAX 请求

• 解决方案

CORS 是跨域资源分享（Cross-Origin Resource Sharing）的缩写。它是 W3C 标准，属于跨源 AJAX 请求的根本解决方法。只需服务器端设置Access-Control-Allow-Origin

结合Gateway解决跨域问题

• 在web-portal门户工程增加Ajax获取文章列表时,因为访问9000端口导致产生跨域问题

  

  

   

• 解决办法,在gateway配置globalcors增加跨域配置即可

  

  扩展知识:

  Art-Template JS模板引擎

  官网:http://aui.github.io/art-template/zh-cn/index.html

  文档:http://aui.github.io/art-template/zh-cn/docs/

  

  使用步骤:

• 1.定义模板

• 2.模板+数据产生HTML插入DOM