vue打包使用Nginx代理解决跨域问题

某视频剪辑软件在开发环境，涉及跨域，就在本地配置了代理，但是部署到服务器上，就不行了。

解决方法有一下几种

服务器端配置克-奥二氏分级量表用服务器反向代理，和访问本地服务器是一样的可以修改成正式线上的地址，再建设推荐

使用服务器配置反向代理，这样就可以在前端彻底解决跨域问题。

vue index.js文件源码

请使用严格的"//模板版本： 1.2.7//有关文档，请参见http://vuejs-templates.github.io/webpack。const path=require(' path ')模块。exports={ dev : {//path sassettssubdirctor : ' static '，assets publicath : '/'，changeorigin: true，proxy table 3: { '/API ' 3: { target 3https://API。它是120。cc/于风，changeOrigin //https://web pack。js。org/configuration/dev-server/# dev server-watch选项-/* * *源地图*///https://web pack。js。org/configuration/dev tool/# dev tool : ' eval-Source-map '，//如果在调试开发者工具中的vue文件时遇到问题，请//将此设置为假的它*可能会*有所帮助//https://vue-Loader。vuejs。组织/en/options。html # cachebustingcass 3./dist/index.html ')，//PathSassetSroot :路径。解析(_ _ dirname '，/dist ')，assets子目录： ' ./static '，assetsPublicPath: ' ./'，/* * *源地图*/生产源地图： true，//https://web pack。js。org/configuration/dev tool/# production dev tool : ' # Source-map '，//Gzip默认关闭，因为许多流行的静态主机（如//浪涌或Netlify)已经为您Gzip了所有静态资产。//在设置为真的之前，请确保为：//NPM安装-保存-开发压缩-web pack-pluginproductiongzip : false，productiongzipcextensions 3360[' js '，' css']，//运行带有额外参数的构建命令//在构建完成后查看包分析器报告：/` NPM运行构建-报告`//设置为真的或假的以始终打开或关闭offbundleAnalyzerReport:进程环境.配置文件源码

# www . PHP . cn的力量#用户无名之辈；worker _ processes 1；# error _ log日志/错误。日志；# error _ log日志/错误。原木注意；# error _ log日志/错误。日志信息；#pid日志/nginx。PID事件{ worker _ connections 1024 } http { include mime . typesdefault _ type应用程序/八位字节流；# log _ format main ' $ remote _ addr-$ remote _ user[$ time _ local]' $ request ' ' # ' $ status $ body _ bytes _ send ' $ http _ referer ' ' # ' ' $ http _ user _ agent ' ' $ http _ x _ forward _ for ' '；# access _ log日志/access。log main# tcp上的send file _ no push上的# keepalive _ time out 0；keepalive _ time out 65 # TCP _ nodelay onfastcgi _ connect _ time out 300 fastcgi _ send _ time out 300 fastcgi _ read _ time out 300 fastcgi _ buffer _ size 128 kfastcgi _ buffers 4 128 kfastcgi _ busy _ buffers _ size 256 kfastcgi _ temp _ file _ write _ size 256k；# gzip ONG zip ONG zip _ min _ length 1kgzip _ buffers 4 32 kgzip _ http _ version 1.1 gzip _ comp _ level 2；gzip _ types文本/普通应用程序/x-javascript文本/css应用程序/XML；gzip _ vary ONG zip _ disable“MSIE[1-6]”；server _ names _ hash _ bucket _ size 128；client _ max _ body _ size 100 client _ header _ buffer _ size 256 klarge _ client _ header _ buffers 4 256k；服务器{ listen 80 server _ name localhost # charset koi 8-r；# access _ log日志/主机。进入。log main根目录e :/phpStudy/phpttorial/WWW '；位置/{索引index.htmlindex.htmindex.phpl.php；自动索引关闭；} # error _ page 404/404。html#将服务器错误页面重定向到静态页面/50x。html # error _ page 500 502 503 504/50x。html位置=/50x.html {根html} #将服务器端编程语言（Professional Hypertext Preprocessor的缩写）脚本代理到街头流氓侦听127 .0 .0 .1:80 # #位置~ \。PHP $ { # proxy _ pass http://127。0 .0 .1;#} #将服务器端编程语言（Professional Hypertext Preprocessor的缩写）脚本传递给在127.0.0.1:9000 #位置监听的FastCGI服务器~ \。php (.*)$ { fastcgi _ pass 127。0 .0 .1:9000;index.php指数；^((?u ).\.php)(/？)$;fastcgi _ param SCRIPT _ FILENAME $ document _ root $ fastcgi _ SCRIPT _ name；fastcgi _ param PATH _ INFO $ fastcgi _ PATH _ INFO；fastcgi _ param _ PATH _ TRANSLATED $ document _ root $ fastcgi _ PATH _ info；包括fastcgi _ params} #拒绝访问htaccess .文件，如果街头流氓的文档根#与服务器的一# #位置一致~ /\。ht { #全部拒绝；# }位置/API { proxy _ pass https://api.it120.cc/fengyu;} } #另一台使用基于知识产权、名称和端口的混合配置的虚拟主机# #服务器{ #听8000#听一些名字：8080;# server _ name其他一些名称别名。别名；# location/{ # root html；# index.htmlindex.htm指数；# } #} # HTTPS服务器# #服务器{ #监听443;# server _ name localhost# ssl开启；# SSL _证书。质子交换膜；# SSL _ certificate _ key cert . key # SSL _ session _ time out 5m # SSL _ protocol SsLV 2 SsLV 3 TLSV 1 # SSL _ ciphers high :aNULL:# location/{ # root html；上的MD5 # ssl _ prefer _ server _ ciphers# index.htmlindex.htm指数；# } # }包含vhosts.conf}成功截图

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。