概述
跨域问题
也就是俗称的前端与后端交互需要同源策略,即如下:
域:服务器域名,唯一标识(协议,域名,端口)必须保证一致,说明域相同
跨域:在一个服务器上,去访问另一个服务器上,并且得到另一个服务器返回回来的值,这就是javascript跨域,其实简单点,之前我们做的ajax,都是在同域中访问,现在只是访问的服务器变成了另外的,不是同一台了。仅此而已。但是这样一变,之前的代码就不能用了。
解决跨域有几种方式,其中之一就是搭建代理服务器(nginx),让所访问域名、端口、路径相同。但我这里不想用nginx,则可以用VScode 的扩展插件Live Server简单实现。
VSCode 插件Live Server代理设置
Live Server扩展的设置,可以进入设置界面设置,也可以手动设置settings.json,内容如下:
{
"liveServer.settings.host": "localhost", //域名或IP
"liveServer.settings.port": 5500, //默认端口
"liveServer.settings.wait": 1000, //刷新频率
"liveServer.settings.CustomBrowser": "chrome", //打开到目标浏览器
"liveServer.settings.ChromeDebuggingAttachment": false, //是否开启ChromeDebug
"liveServer.settings.proxy": { //代理设置
"enable": true, //是否开启代理设置
"baseUri": "/api", //代理的访问根路径,如http://localhost:5500/api
"proxyUri": "http://www.xxxx.com:8080/api" //远程服务端接口
}
}
设置完后,重启 LiveServer 后,在浏览器输入 http://localhost:5500/api 会被代理到http://www.xxxx.com:8080/api 接口上,如果代码服务器不可访问,LiveServer 就会忽略proxy属性,以默认的方式打开。通过这个方式,你可直接挂载工程目录到对应的tomcat、jetty、iis、php-fpm等后端目录进行处理。
最后
以上就是隐形书包为你收集整理的【技术工具】用VsCode扩展插件Live Server设置服务端代理不用Nginx做服务端代理也能解决跨域问题跨域问题VSCode 插件Live Server代理设置的全部内容,希望文章能够帮你解决【技术工具】用VsCode扩展插件Live Server设置服务端代理不用Nginx做服务端代理也能解决跨域问题跨域问题VSCode 插件Live Server代理设置所遇到的程序开发问题。
如果觉得靠谱客网站的内容还不错,欢迎将靠谱客网站推荐给程序员好友。
发表评论 取消回复