当前位置: 首页 > news >正文

前端常见跨域解决方案(全)

文章目录

  • 什么是跨域?
          • 什么是同源策略?
          • 同源策略限制以下几种行为
          • 常见跨域场景
  • 跨域解决方案
      • 一、 通过jsonp跨域
      • 二、 document.domain + iframe跨域
      • 三、 location.hash + iframe跨域
      • 四、 window.name + iframe跨域
      • 五、 postMessage跨域
      • 六、 跨域资源共享(CORS)
          • 1、 前端设置:
          • 2、 服务端设置:
      • 七、 nginx代理跨域
          • 1、 nginx配置解决iconfont跨域
          • 2、 nginx反向代理接口跨域
      • 八、 Nodejs中间件代理跨域
          • 1、 非vue框架的跨域(2次跨域)
          • 2、 vue框架的跨域(1次跨域)
      • 九、 WebSocket协议跨域


什么是跨域?

跨域是指一个域下的文档或脚本试图去请求另一个域下的资源,这里跨域是广义的。

广义的跨域:

 资源跳转: A链接、重定向、表单提交资源嵌入: <link><script><img><frame>等dom标签,还有样式中background:url()、@font-face()等文件外链脚本请求: js发起的ajax请求、dom和js对象的跨域操作等

其实我们通常所说的跨域是狭义的,是由浏览器同源策略限制的一类请求场景。

什么是同源策略?

同源策略/SOP(Same origin policy)是一种约定,由Netscape公司1995年引入浏览器,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,浏览器很容易受到XSS、CSFR等攻击。所谓同源是指"协议+域名+端口"三者相同,即便两个不同的域名指向同一个ip地址,也非同源。

同源策略限制以下几种行为
  1. Cookie、LocalStorage 和 IndexDB 无法读取
  2. DOM 和 Js对象无法获得
  3. AJAX 请求不能发送
常见跨域场景
URL                                      说明                    是否允许通信
http://www.domain.com/a.js
http://www.domain.com/b.js         同一域名,不同文件或路径           允许
http://www.domain.com/lab/c.jshttp://www.domain.com:8000/a.js
http://www.domain.com/b.js         同一域名,不同端口                不允许http://www.domain.com/a.js
https://www.domain.com/b.js        同一域名,不同协议                不允许http://www.domain.com/a.js
http://192.168.4.12/b.js           域名和域名对应相同ip              不允许http://www.domain.com/a.js
http://x.domain.com/b.js           主域相同,子域不同                不允许
http://domain.com/c.jshttp://www.domain1.com/a.js
http://www.domain2.com/b.js        不同域名                         不允许

跨域解决方案

1、 通过jsonp跨域
2、 document.domain + iframe跨域
3、 location.hash + iframe
4、 window.name + iframe跨域
5、 postMessage跨域
6、 跨域资源共享(CORS)
7、 nginx代理跨域
8、 nodejs中间件代理跨域
9、 WebSocket协议跨域

一、 通过jsonp跨域

通常为了减轻web服务器的负载,我们把js、css,img等静态资源分离到另一台独立域名的服务器上,在html页面中再通过相应的标签从不同域名下加载静态资源,而被浏览器允许,基于此原理,我们可以通过动态创建script,再请求一个带参网址实现跨域通信。

1.)原生实现:

<script>var script = document.createElement('script');script.type = 'text/javascript';// 传参一个回调函数名给后端,方便后端返回时执行这个在前端定义的回调函数script.src = 'http://www.domain2.com:8080/login?user=admin&callback=handleCallback';document.head.appendChild(script);// 回调执行函数function handleCallback(res) {alert(JSON.stringify(res));}</script>

服务端返回如下(返回时即执行全局函数):

handleCallback({"status": true, "user": "admin"})

2.)jquery ajax:

$.ajax({url: 'http://www.domain2.com:8080/login',type: 'get',dataType: 'jsonp',  // 请求方式为jsonpjsonpCallback: "handleCallback",    // 自定义回调函数名data: {}
});

3.)vue.js:

this.$http.jsonp('http://www.domain2.com:8080/login', {params: {},jsonp: 'handleCallback'
}).then((res) => {console.log(res); 
})

后端node.js代码示例:

var querystring = require('querystring');
var http = require('http');
var server = http.createServer();server.on('request', function(req, res) {var params = qs.parse(req.url.split('?')[1]);var fn = params.callback;// jsonp返回设置res.writeHead(200, { 'Content-Type': 'text/javascript' });res.write(fn + '(' + JSON.stringify(params) + ')');res.end();
});server.listen('8080');
console.log('Server is running at port 8080...');

jsonp缺点:只能实现get一种请求。

二、 document.domain + iframe跨域

此方案仅限主域相同,子域不同的跨域应用场景。

实现原理:两个页面都通过js强制设置document.domain为基础主域,就实现了同域。

1.)父窗口:(http://www.domain.com/a.html)

<iframe id="iframe" src="http://child.domain.com/b.html"></iframe>
<script>document.domain = 'domain.com';var user = 'admin';
</script>

2.)子窗口:(http://child.domain.com/b.html)

<script>document.domain = 'domain.com';// 获取父窗口中变量alert('get js data from parent ---> ' + window.parent.user);
</script>

三、 location.hash + iframe跨域

实现原理: a欲与b跨域相互通信,通过中间页c来实现。 三个页面,不同域之间利用iframe的location.hash传值,相同域之间直接js访问来通信。

具体实现:A域:a.html -> B域:b.html -> A域:c.html,a与b不同域只能通过hash值单向通信,b与c也不同域也只能单向通信,但c与a同域,所以c可通过parent.parent访问a页面所有对象。

1.)a.html:(http://www.domain1.com/a.html)

<iframe id="iframe" src="http://www.domain2.com/b.html" style="display:none;"></iframe>
<script>var iframe = document.getElementById('iframe');// 向b.html传hash值setTimeout(function() {iframe.src = iframe.src + '#user=admin';}, 1000);// 开放给同域c.html的回调方法function onCallback(res) {alert('data from c.html ---> ' + res);}
</script>

2.)b.html:(http://www.domain2.com/b.html)

<iframe id="iframe" src="http://www.domain1.com/c.html" style="display:none;"></iframe>
<script>var iframe = document.getElementById('iframe');// 监听a.html传来的hash值,再传给c.htmlwindow.onhashchange = function () {iframe.src = iframe.src + location.hash;};
</script>

3.)c.html:(http://www.domain1.com/c.html)

<script>// 监听b.html传来的hash值window.onhashchange = function () {// 再通过操作同域a.html的js回调,将结果传回window.parent.parent.onCallback('hello: ' + location.hash.replace('#user=', ''));};
</script>

四、 window.name + iframe跨域

window.name属性的独特之处:name值在不同的页面(甚至不同域名)加载后依旧存在,并且可以支持非常长的 name 值(2MB)。

1.)a.html:(http://www.domain1.com/a.html)

var proxy = function(url, callback) {var state = 0;var iframe = document.createElement('iframe');// 加载跨域页面iframe.src = url;// onload事件会触发2次,第1次加载跨域页,并留存数据于window.nameiframe.onload = function() {if (state === 1) {// 第2次onload(同域proxy页)成功后,读取同域window.name中数据callback(iframe.contentWindow.name);destoryFrame();} else if (state === 0) {// 第1次onload(跨域页)成功后,切换到同域代理页面iframe.contentWindow.location = 'http://www.domain1.com/proxy.html';state = 1;}};document.body.appendChild(iframe);// 获取数据以后销毁这个iframe,释放内存;这也保证了安全(不被其他域frame js访问)function destoryFrame() {iframe.contentWindow.document.write('');iframe.contentWindow.close();document.body.removeChild(iframe);}
};// 请求跨域b页面数据
proxy('http://www.domain2.com/b.html', function(data){alert(data);
});

2.)proxy.html:(http://www.domain1.com/proxy…

中间代理页,与a.html同域,内容为空即可。

3.)b.html:(http://www.domain2.com/b.html)

<script>window.name = 'This is domain2 data!';
</script>

总结:通过iframe的src属性由外域转向本地域,跨域数据即由iframe的window.name从外域传递到本地域。这个就巧妙地绕过了浏览器的跨域访问限制,但同时它又是安全操作。

五、 postMessage跨域

postMessage是HTML5 XMLHttpRequest Level 2中的API,且是为数不多可以跨域操作的window属性之一,它可用于解决以下方面的问题:

  1. 页面和其打开的新窗口的数据传递
  2. 多窗口之间消息传递
  3. 页面与嵌套的iframe消息传递
  4. 上面三个场景的跨域数据传递

用法:postMessage(data,origin)方法接受两个参数
data: html5规范支持任意基本类型或可复制的对象,但部分浏览器只支持字符串,所以传参时最好用JSON.stringify()序列化。
origin: 协议+主机+端口号,也可以设置为"*",表示可以传递给任意窗口,如果要指定和当前窗口同源的话设置为"/"。

1.)a.html:(http://www.domain1.com/a.html)

<iframe id="iframe" src="http://www.domain2.com/b.html" style="display:none;"></iframe>
<script>       var iframe = document.getElementById('iframe');iframe.onload = function() {var data = {name: 'aym'};// 向domain2传送跨域数据iframe.contentWindow.postMessage(JSON.stringify(data), 'http://www.domain2.com');};// 接受domain2返回数据window.addEventListener('message', function(e) {alert('data from domain2 ---> ' + e.data);}, false);
</script>

2.)b.html:(http://www.domain2.com/b.html)

<script>// 接收domain1的数据window.addEventListener('message', function(e) {alert('data from domain1 ---> ' + e.data);var data = JSON.parse(e.data);if (data) {data.number = 16;// 处理后再发回domain1window.parent.postMessage(JSON.stringify(data), 'http://www.domain1.com');}}, false);
</script>

六、 跨域资源共享(CORS)

普通跨域请求:只服务端设置Access-Control-Allow-Origin即可,前端无须设置,若要带cookie请求:前后端都需要设置。

需注意的是:由于同源策略的限制,所读取的cookie为跨域请求接口所在域的cookie,而非当前页。如果想实现当前页cookie的写入,可参考下文:七、nginx反向代理中设置proxy_cookie_domain 和 八、NodeJs中间件代理中cookieDomainRewrite参数的设置。

目前,所有浏览器都支持该功能(IE8+:IE8/9需要使用XDomainRequest对象来支持CORS)),CORS也已经成为主流的跨域解决方案。

1、 前端设置:

1.)原生ajax

// 前端设置是否带cookie
xhr.withCredentials = true;

示例代码:

var xhr = new XMLHttpRequest(); // IE8/9需用window.XDomainRequest兼容// 前端设置是否带cookie
xhr.withCredentials = true;xhr.open('post', 'http://www.domain2.com:8080/login', true);
xhr.setRequestHeader('Content-Type', 'application/x-www-form-urlencoded');
xhr.send('user=admin');xhr.onreadystatechange = function() {if (xhr.readyState == 4 && xhr.status == 200) {alert(xhr.responseText);}
};

2.)jQuery ajax

$.ajax({...xhrFields: {withCredentials: true    // 前端设置是否带cookie},crossDomain: true,   // 会让请求头中包含跨域的额外信息,但不会含cookie...
});

3.)vue框架

  1. axios设置:
axios.defaults.withCredentials = true
  1. vue-resource设置:
Vue.http.options.credentials = true
2、 服务端设置:

若后端设置成功,前端浏览器控制台则不会出现跨域报错信息,反之,说明没设成功。

1.)Java后台:

/** 导入包:import javax.servlet.http.HttpServletResponse;* 接口参数中定义:HttpServletResponse response*/// 允许跨域访问的域名:若有端口需写全(协议+域名+端口),若没有端口末尾不用加'/'
response.setHeader("Access-Control-Allow-Origin", "http://www.domain1.com"); // 允许前端带认证cookie:启用此项后,上面的域名不能为'*',必须指定具体的域名,否则浏览器会提示
response.setHeader("Access-Control-Allow-Credentials", "true"); // 提示OPTIONS预检时,后端需要设置的两个常用自定义头
response.setHeader("Access-Control-Allow-Headers", "Content-Type,X-Requested-With");

2.)Nodejs后台示例:

var http = require('http');
var server = http.createServer();
var qs = require('querystring');server.on('request', function(req, res) {var postData = '';// 数据块接收中req.addListener('data', function(chunk) {postData += chunk;});// 数据接收完毕req.addListener('end', function() {postData = qs.parse(postData);// 跨域后台设置res.writeHead(200, {'Access-Control-Allow-Credentials': 'true',     // 后端允许发送Cookie'Access-Control-Allow-Origin': 'http://www.domain1.com',    // 允许访问的域(协议+域名+端口)/* * 此处设置的cookie还是domain2的而非domain1,因为后端也不能跨域写cookie(nginx反向代理可以实现),* 但只要domain2中写入一次cookie认证,后面的跨域接口都能从domain2中获取cookie,从而实现所有的接口都能跨域访问*/'Set-Cookie': 'l=a123456;Path=/;Domain=www.domain2.com;HttpOnly'  // HttpOnly的作用是让js无法读取cookie});res.write(JSON.stringify(postData));res.end();});
});server.listen('8080');
console.log('Server is running at port 8080...');

七、 nginx代理跨域

1、 nginx配置解决iconfont跨域

浏览器跨域访问js、css、img等常规静态资源被同源策略许可,但iconfont字体文件(eot|otf|ttf|woff|svg)例外,此时可在nginx的静态资源服务器中加入以下配置。

location / {add_header Access-Control-Allow-Origin *;
}
2、 nginx反向代理接口跨域

跨域原理: 同源策略是浏览器的安全策略,不是HTTP协议的一部分。服务器端调用HTTP接口只是使用HTTP协议,不会执行JS脚本,不需要同源策略,也就不存在跨越问题。

实现思路:通过nginx配置一个代理服务器(域名与domain1相同,端口不同)做跳板机,反向代理访问domain2接口,并且可以顺便修改cookie中domain信息,方便当前域cookie写入,实现跨域登录。

nginx具体配置:

#proxy服务器
server {listen       81;server_name  www.domain1.com;location / {proxy_pass   http://www.domain2.com:8080;  #反向代理proxy_cookie_domain www.domain2.com www.domain1.com; #修改cookie里域名index  index.html index.htm;# 当用webpack-dev-server等中间件代理接口访问nignx时,此时无浏览器参与,故没有同源限制,下面的跨域配置可不启用add_header Access-Control-Allow-Origin http://www.domain1.com;  #当前端只跨域不带cookie时,可为*add_header Access-Control-Allow-Credentials true;}
}

1.) 前端代码示例:

var xhr = new XMLHttpRequest();// 前端开关:浏览器是否读写cookie
xhr.withCredentials = true;// 访问nginx中的代理服务器
xhr.open('get', 'http://www.domain1.com:81/?user=admin', true);
xhr.send();

2.) Nodejs后台示例:

var http = require('http');
var server = http.createServer();
var qs = require('querystring');server.on('request', function(req, res) {var params = qs.parse(req.url.substring(2));// 向前台写cookieres.writeHead(200, {'Set-Cookie': 'l=a123456;Path=/;Domain=www.domain2.com;HttpOnly'   // HttpOnly:脚本无法读取});res.write(JSON.stringify(params));res.end();
});server.listen('8080');
console.log('Server is running at port 8080...');

八、 Nodejs中间件代理跨域

node中间件实现跨域代理,原理大致与nginx相同,都是通过启一个代理服务器,实现数据的转发,也可以通过设置cookieDomainRewrite参数修改响应头中cookie中域名,实现当前域的cookie写入,方便接口登录认证。

1、 非vue框架的跨域(2次跨域)

利用node + express + http-proxy-middleware搭建一个proxy服务器。
1.)前端代码示例:

var xhr = new XMLHttpRequest();// 前端开关:浏览器是否读写cookie
xhr.withCredentials = true;// 访问http-proxy-middleware代理服务器
xhr.open('get', 'http://www.domain1.com:3000/login?user=admin', true);
xhr.send();

2.)中间件服务器:

var express = require('express');
var proxy = require('http-proxy-middleware');
var app = express();app.use('/', proxy({// 代理跨域目标接口target: 'http://www.domain2.com:8080',changeOrigin: true,// 修改响应头信息,实现跨域并允许带cookieonProxyRes: function(proxyRes, req, res) {res.header('Access-Control-Allow-Origin', 'http://www.domain1.com');res.header('Access-Control-Allow-Credentials', 'true');},// 修改响应信息中的cookie域名cookieDomainRewrite: 'www.domain1.com'  // 可以为false,表示不修改
}));app.listen(3000);
console.log('Proxy server is listen at port 3000...');

3.)Nodejs后台同(六:nginx)

2、 vue框架的跨域(1次跨域)

利用node + webpack + webpack-dev-server代理接口跨域。在开发环境下,由于vue渲染服务和接口代理服务都是webpack-dev-server同一个,所以页面与代理接口之间不再跨域,无须设置headers跨域信息了。

webpack.config.js部分配置:

module.exports = {entry: {},module: {},...devServer: {historyApiFallback: true,proxy: [{context: '/login',target: 'http://www.domain2.com:8080',  // 代理跨域目标接口changeOrigin: true,secure: false,  // 当代理某些https服务报错时用cookieDomainRewrite: 'www.domain1.com'  // 可以为false,表示不修改}],noInfo: true}
}

九、 WebSocket协议跨域

WebSocket protocol是HTML5一种新的协议。它实现了浏览器与服务器全双工通信,同时允许跨域通讯,是server push技术的一种很好的实现。

原生WebSocket API使用起来不太方便,我们使用Socket.io,它很好地封装了webSocket接口,提供了更简单、灵活的接口,也对不支持webSocket的浏览器提供了向下兼容。

1.)前端代码:

<div>user input:<input type="text"></div>
<script src="https://cdn.bootcss.com/socket.io/2.2.0/socket.io.js"></script>
<script>
var socket = io('http://www.domain2.com:8080');// 连接成功处理
socket.on('connect', function() {// 监听服务端消息socket.on('message', function(msg) {console.log('data from server: ---> ' + msg); });// 监听服务端关闭socket.on('disconnect', function() { console.log('Server socket has closed.'); });
});document.getElementsByTagName('input')[0].onblur = function() {socket.send(this.value);
};
</script>

2.)Nodejs socket后台:

var http = require('http');
var socket = require('socket.io');// 启http服务
var server = http.createServer(function(req, res) {res.writeHead(200, {'Content-type': 'text/html'});res.end();
});server.listen('8080');
console.log('Server is running at port 8080...');// 监听socket连接
socket.listen(server).on('connection', function(client) {// 接收信息client.on('message', function(msg) {client.send('hello:' + msg);console.log('data from client: ---> ' + msg);});// 断开处理client.on('disconnect', function() {console.log('Client socket has closed.'); });
});

如有帮助 点赞-关注!

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.exyb.cn/news/show-2654.html

如若内容造成侵权/违法违规/事实不符,请联系我们进行投诉反馈,一经查实,立即删除!

力扣刷题:动态规划篇

目录322. 零钱兑换题目介绍题目实现5. 最长回文子串题目介绍题目实现518. 零钱兑换 II题目介绍题目实现53. 最大子序和题目介绍题目实现63. 不同路径 II题目介绍[62. 不同路径](https://leetcode-cn.com/problems/unique-paths/)题目实现70. 爬楼梯题目介绍题目实现72. 编辑距离…...

c++程序设计中虚基类,多继承知识点

一.前言 如上 二.题目 分别声明Teacher(教师)类和Cadre(干部)类&#xff0c;采用多重继承方式由这两个类派 生出新类Teacher_Cadre(教师兼干部&#xff09;类。要求&#xff1a; &#xff08;1)在两个基类中都包含姓名、年龄、性别、地址、电话等数据成员。 &#xff08;2&a…...

FFmpeg:avcodec_encode_video()

本文简单分析FFmpeg的avcodec_encode_video2()函数。该函数用于编码一帧视频数据。avcodec_encode_video2()函数的声明位于libavcodec\avcodec.h&#xff0c;如下所示。 /*** Encode a frame of video.** Takes input raw video data from frame and writes the next output p…...

SpringBoot中必须掌握的45个注解

1.SpringBoot/spring SpringBootApplication: 包含Configuration、EnableAutoConfiguration、ComponentScan通常用在主类上&#xff1b; Repository: 用于标注数据访问组件&#xff0c;即DAO组件&#xff1b; Service: 用于标注业务层组件&#xff1b; RestController: …...

侯捷CPP---面向对象(上)

侯捷CPP---面向对象&#xff08;上&#xff09;前言头文件防卫式声明class 分类不带指针的class&#xff08;complex&#xff09;成员变量私有化inline function&#xff08;内联函数&#xff09;构造函数常量成员函数参数传递返回值传递友元函数操作符重载临时对象带指针的cla…...

使用注解开发

1&#xff1b; 2.mapper 2.测试...

苏宁易购启动六一宝宝节,首提“共情消费”

5月26日晚8点&#xff0c;苏宁易购六一宝宝节掰头大会在多个平台播出。六一宝宝节全面启动。 六一宝宝节定位于打破营销套路&#xff0c;打破传统电商促销节奏。它是大促&#xff0c;更是一场成年人释放压力、共情消费的盛典。 掰头大会灵魂辩题 开启宝宝节 六一宝宝节的启…...

设计一个windows应用程序,定义一个Student类,包含学号和姓名两个字段,并定义一个班级类ClassList

设计一个windows应用程序&#xff0c;定义一个Student类&#xff0c;包含学号和姓名两个字段&#xff0c;并定义一个班级类ClassList&#xff0c;该类包含一个Student集合&#xff0c;使用索引器访问该集合。 &#xff08;1&#xff09;创建一个Windows应用程序Myproject6_1。 …...

python笔记19年8月23日

-------------py打包exe教程------------ 准备好需要转换的py文件和一张用于做图标.ico的照片 将他们存放于同一个文件夹中,文件的路径全部为英文路径 1.利用cmd窗口安装pyinstaller插件 指令 :pip install pyinstaller 2.使用cd指令到py文件夹 3.执行命令 pyinstaller -F -i X…...

系统集成模拟3-55分

1、合同法律关系是指由合同法律法规调整的在民事流转过程中形成的&#xff08;权利义务关系&#xff09; 2、当已经采取了多种沟通方式还未能与用户达成一致时&#xff0c;应考虑沟通升级原则-双方高层沟通 3、数据域安全包括&#xff1a;行级数据域安全&#xff0c;数据域安全…...

Centos7 配置DHCP

实验内容及步骤 1、实验背景 某企业计划构建一台 DHCP服务器来解决IP地址动态分配的问题&#xff0c;要求能够分配 IP地址以及网关、DNS等其它网络属性信息。同时要求DHCP服务器为DNS、WEB、Samba服务器分配固定IP 地址。 2、网络拓扑 略. 3、实验环境 假设企业DHCP服务器…...

JVM常见配置汇总

堆设置 -Xms:初始堆大小-Xmx:最大堆大小-XX:NewSizen:设置年轻代大小-XX:NewRation:设置年轻代和年老代的比值。如:为3&#xff0c;表示年轻代与年老代比值为1&#xff1a;3&#xff0c;年轻代占整个年轻代年老代和的1/4-XX:SurvivorRation:年轻代中Eden区与两个Survivor区的比…...

从类,API,框架三个层面学习如何设计可复用软件实体的具体技术学习心得

从类&#xff0c;API&#xff0c;框架三个层面学习如何设计可复用软件实体的具体技术学习心得软件复用概述软件复用概念软件复用的软件支持三方面讲述软件复用类代码复用设计的复用分析的复用测试信息的复用Liskov替换原则 ——LSPAPI框架软件复用概述 软件复用概念 软件复用(…...

惠普(HP) Officejet Pro 8610商用彩色喷墨一体机

专业彩色打印件的单页成本比激光打印机低 50%,从而在日常打印中节省更多打印成本。无论您身在何处,均可通过任意移动设备进行打印。 借助惠普“云打印”技术,您现在可以随时随地,随心打印。使用智能复印解决方案,创建完美无瑕的副本,同时轻松打印双面身份证。专业彩色打印…...

easyPOI和导入复杂excel的各种坑

//easyPOI的依赖 <dependency><groupId>cn.afterturn</groupId><artifactId>easypoi-base</artifactId><version>4.1.3</version> </dependency>//要操作pdf,word还是用原生poi比较好 <dependency><groupId>org.…...

用直流电机测转速——测速发电机标定实验

测速发电机标定实验 文章目录测速发电机标定实验1 测速发电机原理和应用1.1 原理1.2 应用2 硬件搭建3 实验数据4 总结1 测速发电机原理和应用 1.1 原理 直流电机同时也是一个发电机。也就是说&#xff0c;当直流电机被通入直流电的时候&#xff0c;会将电能转化为机械能&…...

httprunner_locust_场景1:登录1次,添加10次地图

场景1&#xff1a;任务执行 > login执行1次&#xff0c;addtitle执行10次 from locust import HttpUser, task, SequentialTaskSet, between import json# 场景1&#xff1a;任务执行 > login执行1次&#xff0c;addtitle执行10次 class FlashTask(SequentialTaskSet): …...

Actor模型

传统的游戏服务器要么是单线程要么是多线程&#xff0c;过去几十年里CPU一直遵循摩尔定律发展&#xff0c;带来的结果是单核频率越来越高。而近几年摩尔定义在CPU上已然失效&#xff0c;为什么呢&#xff1f; 大于在2003年左右&#xff0c;计算机的核心特性经历了一个重要的变…...

冠美会计

...

C1任务03-Web基础与布局

文章目录任务一:使用富文本编辑器任务二:所见所得 式开发拓展任务:CSS盒子模型任务一:使用富文本编辑器 描述:制作表,让表格隔行换色.加入JavaScript按钮弹出框. 富文本编辑器 <style>.cl{color:red}table,tr,td{border:1px solid; padding:5px 20px 5px 0;font-size:10…...

云南:探索旅游电子合同区块链应用,君子签助推旅游管理智慧发展

近日&#xff0c;云南省文化和旅游厅、云南省发展和改革委员会、云南省教育厅等十部门联合印发《云南省深化“互联网&#xff0b;旅游”推动旅游业高质量发展实施方案》&#xff08;以下简称《实施方案》&#xff09;&#xff0c;提出&#xff1a;整合全国旅游电子合同等系统数…...

盘点golang中的开发神器

本文已收录 https://github.com/lkxiaolou/lkxiaolou 欢迎star。 在Java中&#xff0c;我们用Junit做单元测试&#xff0c;用JMH做性能基准测试&#xff08;benchmark&#xff09;&#xff0c;用async-profiler剖析cpu性能&#xff0c;用jstack、jmap、arthas等来排查问题。 作…...

腾讯T2大佬手把手教你!大数据开发和java开发加班严重吗

前言 面试时间将近两个小时&#xff08;期间等待二面面试官来面我的时候等了半个多小时&#xff09;面试官问的东西很多&#xff0c;还挖了好几个坑&#xff0c;一个技术点套着一个技术点的问&#xff0c;一定要做好万全的准备。问了一些基本层面上的技术点都答出来了&#xf…...

unity知识记录

1、assetbundle资源加密方式&#xff08;unity Plus和unity Pro支持&#xff09; 针对Unity资源包-AssetBundle格式简单且容易破解的问题&#xff0c;Unity中国团队推出了Unity AssetBundle 加密方案 注意&#xff1a;秘钥长度为16位字符(128bit)&#xff0c;目前AssetBundle…...

腾讯T2大佬手把手教你!java字符串保留小数点后两位

前言 面试时间将近两个小时&#xff08;期间等待二面面试官来面我的时候等了半个多小时&#xff09;面试官问的东西很多&#xff0c;还挖了好几个坑&#xff0c;一个技术点套着一个技术点的问&#xff0c;一定要做好万全的准备。问了一些基本层面上的技术点都答出来了&#xf…...

HTML5 Shiv完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法

HTML5 Shiv完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法参考文章&#xff1a; &#xff08;1&#xff09;HTML5 Shiv完美解决IE(IE6/IE7/IE8)不兼容HTML5标签的方法 &#xff08;2&#xff09;https://www.cnblogs.com/mmykdbc/p/9395390.html &#xff08;3&#xff09;h…...

Echarts - 去掉图表横纵坐标轴刻度线(小细条分割线)

效果图 去掉前&#xff1a; 去掉后&#xff1a; 实现方法 在 xAxis、yAxis 配置项中分别加入以下代码&#xff1a; axisTick: {show: false }...

报考MBA的要求是什么?

报考MBA的要求是什么&#xff1f; MBA要求毕业后有三年以上工作经验&#xff0c;大专毕业后有五年以上工作经验&#xff0c;或硕士毕业后2年以上工作经验 MBA考生要求&#xff1a; 学士学位&#xff1a;毕业后3年以上工作经验 大专&#xff1a;毕业后5年以上工作经验 硕士…...

康说-字符串为空

原文地址https://zrrd.net.cn/1376.htm 前段时间有朋友遇到一个情况&#xff0c;字符串不为null,不为””的问题&#xff0c;找错找了好久&#xff0c;事后发现原来是字符串长度为0的情况&#xff0c;所以今天小聊一下&#xff0c;字符串为空的情况。 判断字符串String是否为…...

腾讯Java开发面试,java工作一年需要掌握的技术

一、概述 本文主要来分析JMM内存模型&#xff0c;英文名JAVA Memory Model&#xff0c;它是与计算机硬件有关的一个概念。为了保证共享内存的正确性&#xff08;可见性、有序性、原子性&#xff09;&#xff0c;内存模型定义了共享内存系统中多线程程序读写操作行为的规范。 …...

如何才能够在线将录音转换成文字

如何才能够在线将录音转换成文字&#xff0c;其实在手机上能够将录音在线转换成文字。 现在智能机越来越智能了&#xff0c;对于一些需求也能够轻松的完成。比如在需要高效率工作学习状态的时候&#xff0c;如何才能够快速实现语音文字的转换。那么下面我就来分享一个方法&…...

录音文件转换成文字很难吗?这几个步骤就可以解决烦恼了

对于一些大学生来说&#xff0c;难免会参加一些讲座或者课堂之类的&#xff0c;但有时会来不及做笔记&#xff0c;甚至有些事情一时想不明白。这时不少人会选择先用录音的方式把内容录下来&#xff0c;回去再慢慢听。毕竟作为学生来说&#xff0c;最怕的就是错过了重点知识&…...

一起Talk Android吧(第四百二十五回:字节数组与String相互转换)

文章目录 使用背景相互转换经验总结各位看官们,大家好,上一回中咱们说的例子是"绘图知识总结",这一回咱们介绍的例子是"字节数组与String相互转换"。闲话休提,言归正转,让我们一起Talk Android吧! 看官们,我们在前面章回中介绍了绘图相关的内容,本…...

如何将录音内容转换成文字呢?

不知道大家在日常工作学习中有没有接触过语音转文字的这种操作。不管怎样&#xff0c;小编经常需要进行这种操作。由于小编经常需要记录会议纪要&#xff0c;而当一些同事或领导发言时&#xff0c;对一些内容并不太理解&#xff0c;手工记录不仅速度慢&#xff0c;而且不全面。…...

怎么将录音文件转换成文字呢?

录音是小伙伴们在日常生活和工作中经常使用的一种操作。毕竟每个手机基本都有录音功能。这个功能让录音变得非常简单&#xff0c;每一个小伙伴职场中&#xff0c;参加各种大大小小的会议是无法回避的任务。而在会议过程中&#xff0c;打开电话录音&#xff0c;可以快速记录重要…...

免费好用的录音转文字软件

解放双手的革命&#xff0c;我们每天像往常一样&#xff0c;打开计算机准备工作&#xff0c;然而却没有像往常一样伏在键盘和鼠标上&#xff0c;如果可以对着计算机说出今天想干的事情&#xff0c;计算机就可以做到的话&#xff0c;该多好。我们打开word文档&#xff0c;一心想…...

怎么把录音转成文字?试试这几个录音转文字软件

在工作学习中&#xff0c;我们常常会将一些比较重要的事项录音下来&#xff0c;方便后续的整理记录。借助录音转文字软件&#xff0c;将录音内容快速转换识别为文字&#xff0c;可以让我们省时省力、提高工作效率。那有哪些录音转文字软件呢&#xff1f;今天就给大家介绍几款录…...

录音怎样转换成文字?录音转文字方法

录音怎样转换成文字呢&#xff1f;在我们的生活中经常会遇到这样的问题&#xff0c;有时候在徐新华的地方或者是上班在地铁上&#xff0c;当别人发语音给我们的时候&#xff0c;由于太吵闹我们很难听见对方在说什么&#xff0c;这时我们就可以试试录音转文字&#xff0c;那么&a…...

linux下录音识别成文字软件下载,录音转文字分享助手

录音转文字分享助手是一款非常实用的录音软件&#xff0c;能够帮助用户在录音的同时可以快速的将内容转化成文字输出&#xff0c;不管是办公还是生活都可以进行使用&#xff0c;方便快捷&#xff0c;录制到好玩有趣的音频时还可以在录音转文字分享助手中一键进行快速分享转发&a…...

如何快速的把录音转换成文字

在很多情况下我们都需要把别人说的话录制下来保存&#xff0c;当做以后的证据&#xff0c;但我们需要把录音中人说的话转换成文档文字&#xff0c;这时候该怎么办呢&#xff1f;下面分享一个方法&#xff0c;可以轻松搞定录音转文字这个难题&#xff0c;就是使用专业的语音识别…...

linux下录音识别成文字软件下载,如何将录音转换成文字,这个方法你需要知道...

有时候我们需要将录音的文件用文字的形式展现出来&#xff0c;如果挨个打字的话会很麻烦&#xff0c;下面小编就来给大家分享一种简单的将录音转换成文字的方法&#xff0c;有需要的小伙伴可以参考一下。使用工具&#xff1a;迅捷文字转语音转换器首先介绍一个文字还在那语音的…...

录音转文字的软件哪个好用

我们在会议上录的音&#xff0c;会议结束后需要将这些录音文件进行整理&#xff0c;并且要整理出文字文件&#xff0c;录音转文字可是难不倒小编的&#xff0c;借助录音转文字工具轻松就能搞定了&#xff0c;下面小编可以为大家介绍介绍好用的工具&#xff0c;希望你们可以用得…...

录音文件转换成文字的方法

可以把录音转文字的方法有很多种&#xff0c;根据自己不同的需求选择不同的转换工具以及转换的方法&#xff0c;下面小编为大家分享几个转换的方法&#xff0c;方法简单&#xff0c;满足你的转换需求&#xff01; 借助的工具&#xff1a; 1&#xff1a;迅捷文字转语音软件 2&a…...

Java从入门到精通十四(Lambda表达式)

Java从入门到精通十四(Lambda表达式&#xff09;Lambda的引入体验实例一&#xff08;抽象方法无参无返回值&#xff09;实例二&#xff08;抽线方法有参无返回值&#xff09;实例三&#xff08;抽象方法带参带返回值&#xff09;lambda的表达式的简化操作匿名内部类和lambda的使…...

奔跑吧恐龙-JAVA从入门到精通

(文章目录) 前言 一个简单的小项目&#xff0c;如果有兴趣&#xff0c;可以下载学习一、项目展示图 二、可以学习和巩固的知识点 线程&#xff1a;控制线程来获取刷新面板和获取时间间隔等AWT&#xff1a;进一步理解怎么绘制图片和protected void paintComponent(Graphics g)S…...

真是恍然大悟啊!java从入门到精通pdf百度云

一、前言 最近刚读完一本书&#xff1a;《Netty、Zookeeper、Redis 并发实战》&#xff0c;个人觉得 Netty 部分是写得很不错的&#xff0c;读完之后又对 Netty 进行了一波很好的复习&#xff08;之前用 spring boot netty zookeeper 模仿 dubbo 做 rpc 框架&#xff0c;那时…...

Java从入门到精通入职学习路线

目录 1、JavaSE基础 2、数据库 3、Web前端 4、JavaWeb &#xff08;后端&#xff09; 5、JavaWeb&#xff08;进阶&#xff09; 6、JavaWeb项目实战练习 7、SSM框架 8、互联网分布式&架构师项目 1、JavaSE基础 掌握DOS命令、JDK JRE JVM&#xff0c;Java源文件的组…...

Java从入门到精通(视频教程+源码)

Java介绍 Java是一门面向对象编程语言&#xff0c;不仅吸收了C语言的各种优点&#xff0c;还摒弃了C里难以理解的多继承、指针等概念&#xff0c;因此Java语言具有功能强大和简单易用两个特征。Java语言作为静态面向对象编程语言的代表&#xff0c;极好地实现了面向对象理论&am…...

java从入门到精通 人民邮电_Java从入门到精通【人民邮电出版社】课后习题答案全集...

Java从入门到精通【人民邮电出版社】课后习题答案全集第二章一1.java程序是从main()处开始运行2.在java中多行注释的开始和结束标记分别为/*和*/3.声明一个名称“count”的整形变量的语句为intcount4.java程序中的标识符可由任意顺序的大小写字母、数字、下划线但不能以数字开头…...

好用的读书笔记软件

读书笔记软件-Bullmind 1.支持做各种笔记。该功能是记笔记非常方便&#xff0c;并且有各种优化来记笔记。 2.支持多种快捷键定制&#xff0c;非常方便。包括颜色切换快捷方式。 3.书架支持无限制的细分&#xff0c;方便组织书籍。 4.您可以选择护眼模式。 5.读书笔记软件--Bull…...