跨域的本质-引入外部 js 文件| 学习笔记

简介: 快速学习跨域的本质-引入外部 js 文件。

开发者学堂课程【Ajax 前端开发入门与实战跨域的本质-引入外部 js 文件】学习笔记,与课程紧密联系,让用户快速学习知识。

课程地址:https://developer.aliyun.com/learning/course/595/detail/8542


跨域的本质-引入外部 js 文件

跨域的实现

XMLHttpRequest 对象默认情况下是无法获取到非同源服务器下的数据。那么怎么获取别人服务器的数据呢?

使用 XMLHttpRequest 是达不到的,我们只能另辟蹊径。

我们可以通过 script 标签,用 script 标签的 src. 属性引入一个外部文件,这个外部文件是不涉及到同源策略的影响的。

创建 weather.html

<! DOCTYPE html><html lang="en"><head>

<meta charset="UTF-8"><title>Document</title>

<script type="text/javascript" src="./js/haha.js"></script>

</ head>

<body>

</ body></html>

创建 register.html

< ! DOCTYPE html><html lang="en"><head>

<meta charset="UTF-8"><title>Document</title>

<scripttype="text/javascript"src="http://www.lisi.com/test.js"></script>

//直接使用 css 变量

</ head>

<body>

< / body></htm1> 

创建 test.css

//定义一个变量

Var str=haha;

//定义一个方法

Function test(){

Console.log(str)

}

//方法调用

Foo(123)

 

二、跨域的本质

就是服务器返回了一个我们之前定义好的方法调用,方法的参数就是我们想要的

<script type=text/ javascriptsrc></script>

1)jsonp 跨域只能是 get 请求,而不能是 post 请求;

2)jsonp 跨域的原理到底是什么;

3)除了 jsonp 跨域之外还有那些方法绕过“同源策略”,实现跨域访问;

4)jsonp 和 ajax,或者说 jsonp 和 XMLHttpRequest 是什么关系;

相关文章
|
2月前
|
JavaScript API
深入探索fs.WriteStream:Node.js文件写入流的全面解析
深入探索fs.WriteStream:Node.js文件写入流的全面解析
|
9天前
|
前端开发 JavaScript API
前端JS读取文件内容并展示到页面上
前端JavaScript使用FileReader API读取文件内容,支持文本类型文件。在文件读取成功后,可以通过onload事件处理函数获取文件内容,然后展示到页面上。
15 2
前端JS读取文件内容并展示到页面上
|
4天前
|
JavaScript 前端开发 API
Vue学习笔记3:对比纯JavaScript和Vue实现数据更新的实时视图显示
Vue学习笔记3:对比纯JavaScript和Vue实现数据更新的实时视图显示
|
6天前
|
JavaScript 前端开发 数据安全/隐私保护
混淆指定js文件
【9月更文挑战第26天】JavaScript 混淆旨在保护代码知识产权、减小文件体积和提高安全性。方法包括变量名和函数名混淆、代码压缩、控制流平坦化及字符串加密。常用工具如 UglifyJS 和 JScrambler 可实现这些功能。然而,混淆可能带来兼容性和调试困难等问题,需谨慎使用并确保法律合规。
|
7天前
|
移动开发 JavaScript 前端开发
js之操作文件| 12-5
js之操作文件| 12-5
|
24天前
|
Web App开发 前端开发 JavaScript
HTML/CSS/JS学习笔记 Day3(HTML--网页标签 下)
HTML/CSS/JS学习笔记 Day3(HTML--网页标签 下)
|
21天前
|
存储 JSON JavaScript
学习node.js十三,文件的上传于下载
学习node.js十三,文件的上传于下载
|
2月前
|
JavaScript 数据安全/隐私保护
如何在Vue组件中调用封装好的外部js文件方法
这篇文章介绍了如何在Vue组件中调用封装好的外部js文件方法,包括在Vue项目中全局引入外部js文件,并在组件中通过this.$myMethod()的方式调用外部js文件中定义的方法。
如何在Vue组件中调用封装好的外部js文件方法
|
2月前
|
前端开发 JavaScript Linux
【Azure 应用服务】在Azure App Service for Linux环境中,部署的Django应用,出现加载css、js等静态资源文件失败
【Azure 应用服务】在Azure App Service for Linux环境中,部署的Django应用,出现加载css、js等静态资源文件失败
|
2月前
|
JavaScript 前端开发 API
vue中将验证表单输入框的方法写在一个js文件中(表达式验证邮箱、身份证、号码、两次输入的密码是否一致)
这篇文章介绍了如何在Vue框架中将表单输入验证逻辑封装到一个JavaScript文件中,并通过正则表达式验证邮箱、身份证、手机号等信息,同时确保两次密码输入的一致性。
下一篇
无影云桌面