精华内容
下载资源
问答
  • vue在使用了proxy后如何查看代理的真实请求地址代理配置的地方设置logLevel,如下图 这样就可以在终端查看代理的真实请求地址,如下图

    vue在使用了proxy后如何查看代理的真实请求地址

    在代理配置的地方设置logLevel,如下图
    在代理请求的位置加上红框内容
    这样就可以在终端查看代理的真实请求地址,如下图
    在这里插入图片描述

    展开全文
  • 适用于vue-cli3以上版本搭建的项目 一、接口基址(单个接口地址) 如果你的项目只有一个服务器访问地址(接口地址),不调用别的接口地址的话...二、代理接口地址 如果你的项目需要访问多个地址,即调用多个不同的接

    适用于vue-cli3以上版本搭建的项目
    一、接口基址(单个接口地址)
    如果你的项目只有一个服务器访问地址(接口地址),不调用别的接口地址的话可以直接在src下的main.js中设置axios的默认基址

    //main.js中
    import axios from 'axios'
    Vue.prototype.$axios = axios
    axios.defaults.baseURL='http://localhost:3000';//设置基址
    

    例子如下

    //example.vue
    <template>
      <div></div>
    </template>
    
    <script>
    export default {
      name: 'example',
      data(){
        return{
        }
      },
      mounted(){
       this.login()
      },
      methods:{     
        //登录接口
        login(){
          this.$axios.post('/login',{
              id:111,
              psw:'1111111'
          }).then(res=>{
            console.log(res)
          })
    
        }
      }
    }
    </script>
    
    

    二、代理接口地址
    如果你的项目需要访问多个地址,即调用多个不同的接口来进行数据的交互,这个时候应该设置代理地址
    在项目根目录下新建一个vue.config.js文件
    在这里插入图片描述

    //vue.config.js
    module.exports = {
       devServer: {
        host: 'localhost',
        port: 8080,//本地运行的端口
        open: true, //配置自动启动浏览器 
        hotOnly:false,
        //接口代理
          proxy: {
            '/news': {
              target: 'http://v.juhe.cn/toutiao',//设置要代理访问的接口---这是头条的接口
              changeOrigin: true,
              pathRewrite: {
                '^/news': ''//重写访问地址,在请求时可以省略target的地址,直接以/news开头
              }
            },
            '/api': {
              target: 'http://localhost:3000',//设置要代理访问的接口----这是我自己的接口
              changeOrigin: true,
              pathRewrite: {
                '^/api': ''  //重写访问地址,在请求时可以省略target的地址,直接以/api开头
              }
            }
          }
       }, 
    

    例子如下

    //example.vue
    <template>
      <div></div>
    </template>
    
    <script>
    export default {
      name: 'example',
      data(){
        return{
        }
      },
      mounted(){
       this.login()
       this.getnews();
      },
      methods:{
        getnews(){
          //获取头条信息
          this.$axios.get('/news/index',{params:{
            key:'d2f47f5d5981c66091cfa284cecfd781',
            type:'头条'
          }}).then(res=>{
            console.log(res)
          })
        },
        //登录接口
        login(){
          this.$axios.post('/api/login',{
              id:111,
              psw:'111111'
          }).then(res=>{
            console.log(res)
          })
    
        }
      }
    }
    </script>
    
    
    展开全文
  • 在VUE项目中使用WebSocket时,是将IP与端口进行固定,但是当环境地址发生变更时,就需要在代码中进行修改,并重新打包发布版本,很是麻烦,当然这样也是不可取的。因此使用nginx反向代理WebSocket就可以解决这个问题...

    原因

    在VUE项目中使用WebSocket时,是将IP与端口进行固定,但是当环境地址发生变更时,就需要在代码中进行修改,并重新打包发布版本,很是麻烦,当然这样也是不可取的。因此使用nginx反向代理WebSocket就可以解决这个问题。

    VUE项目代码片段

    <script>
        export default {
            data(){
                return {
                    webSocket: null
                }
            },
            mounted(){
                this.initWebSocket();
            },
            methods:{
                initWebSocket(){
                    let vm = this;
                    let wsServer = `${location.protocol === 'https' ? 'wss' : 'ws'}://${location.host}/websocket`;
                    vm.webSocket = new WebSocket(wsServer);
                    vm.webSocket.onopen = function(event) {
    				    
                    };
                    vm.webSocket.onmessage = function(msg) {
    				    
                    };
                    vm.webSocket.onClose = function(msg) {
    				        
                    };
                    vm.webSocket.onError = function(err) {
                            				    
                    }
                }
            }
        }
    </script>

    nginx文件配置

    events {
        worker_connections  1024;  ## Default: 1024
    }
    http {
        include       mime.types;
        default_type  application/octet-stream;
        sendfile        on;
        keepalive_timeout  65;
        
        map $http_upgrade $connection_upgrade {
            default upgrade;
            ''      close;
        }
    	
        server {
            listen       9001;
            server_name  localhost;
    
            location / {
                root   D:/code/ai-village-html/dist/;
                index  index.html index.htm;
            }
    		
            #nginx配置websocket
            location ^~ /websocket {
                proxy_pass http://192.168.1.11:8088; #websocket地址
                proxy_http_version 1.1;
                proxy_set_header Host $host;
                proxy_set_header X-Real-IP $remote_addr;
                proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
                proxy_read_timeout 120s;
    
                proxy_set_header Upgrade websocket;
                proxy_set_header Connection Upgrade;
            }
    		
            location ^~/proxy{
                rewrite ^/proxy/(.*)$ /$1 break; #代理字符串
                proxy_pass http://192.168.1.11:8088; #需要代理的地址
            }
        }
    }
    
    

    这样就可以方便、快捷实现在发生环境改变不改动代码的情况下对WebSocket请求进行配置!

    展开全文
  • Nginx 利用代理转发请求实例

    千次阅读 2018-03-09 18:51:58
    我们米扑科技的业务遍布全球,有时国外的客户无法访问我们搭建在国内的服务,这就要求我们在国外服务器上搭建一个代理转发服务,用户请求国外服务器的域名,然后代理转发国内,处理请求后返回结果给国外的客户。...

    我们米扑科技的业务遍布全球,有时国外的客户无法访问我们搭建在国内的服务,这就要求我们在国外服务器上搭建一个代理转发服务,用户请求国外服务器的域名,然后代理转发到国内,处理请求后返回结果给国外的客户。Nginx 不仅可以实现负载均衡,还可以实现反向代理转发,非常适合我们的使用场景,因此我们米扑科技采用 Nginx 利用代理转发请求实例。

    米扑博客原文:Nginx 利用代理转发请求实例

     

    Nginx 利用代理转发请求实例

    nginx 作为目前最流行的web服务器之一,可以很方便地实现反向代理。

    nginx 反向代理官方文档: NGINX REVERSE PROXY

    当在一台主机上部署了多个不同的web服务器,并且需要能在80和443端口同时访问这些web服务器时,可以使用 nginx 的反向代理功能,用 nginx 在80端口监听所有请求,并转发给443端口,再由443端口统一依据转发规则转发到对应的国内web服务器上。

     

    示例:

    proxy.mimvp.com  域名在阿里云备案,部署在国内的北京阿里云服务器

    proxy.mimgu.cn     域名在腾讯云备案,部署在国外的新加坡腾讯云服务器(国外域名可不备案)

     

    1. 国内北京阿里云服务器proxy.mimvp.com

    vim mimvp_proxy.conf

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    54
    55
    56
    57
    58
    59
    60
    61
    62
    63
    64
    65
    66
    67
    68
    69
    70
    71
    72
    73
    74
    75
    76
    77
    78
    79
    80
    81
    82
    83
    84
    85
    86
    87
    88
    89
    90
    91
    92
    93
    94
    95
    96
    97
    98
    99
    server {
        listen       80 ;
      server_name   proxy.mimvp.com;       # 域名可以有多个,用空格隔开
      root      www / mimvp_proxy;
        rewrite ^(. * )$  https: / / $host$ 1 permanent;
     
      location / {
        root        www / mimvp_proxy;
        index       index.php index.html index.htm;
      }
     
      location ~ \.php$ {
        root                www / mimvp_proxy;
        fastcgi_pass        127.0 . 0.1 : 9000 ;
        fastcgi_index   index.php;
        fastcgi_param   SCRIPT_FILENAME / scripts$fastcgi_script_name;
        include         fastcgi.conf;
      }
     
         location ~ * ^ / (images|img|javascript|js|css|blog|flash|media|static) / {
             root        www / mimvp_proxy;
             expires     30d ;
         }
     
         location ~ * ^ / (robots\.txt) {
             root        www / mimvp_proxy;
             expires     365d ;
         }
     
         location ~ * ^ / favicon\.ico {
             root        www / mimvp_proxy;
             expires     365d ;
         }
     
         location ~ * ^ / img / logo\.png {
             root        www / mimvp_proxy;
             expires     365d ;
         }
     
         location ~ / \.ht {
             deny  all ;
         }
    }
     
     
    server {
         listen          443 ssl http2;
         server_name     proxy.mimvp.com;       # 域名可以有多个,用空格隔开
         root            www / mimvp_proxy;
         ssl             on;
     
         ssl_certificate      proxy.mimvp.com.crt;
         ssl_certificate_key  proxy.mimvp.com.key;
     
         ssl_session_cache    shared:SSL: 1m ;
         ssl_session_timeout  10m ;
     
         ssl_protocols TLSv1 TLSv1. 1 TLSv1. 2 ;
     
         ssl_ciphers ECDHE - RSA - AES128 - GCM - SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
         ssl_prefer_server_ciphers on;
     
      location / {
        root        www / mimvp_proxy;
        index       index.php index.html index.htm;
      }
     
      location ~ \.php$ {
        root                www / mimvp_proxy;
        fastcgi_pass        127.0 . 0.1 : 9000 ;
        fastcgi_index   index.php;
        fastcgi_param   SCRIPT_FILENAME / scripts$fastcgi_script_name;
        include         fastcgi.conf;
      }
     
         location ~ * ^ / (images|img|javascript|js|css|blog|flash|media|static) / {
             root        www / mimvp_proxy;
             expires     30d ;
         }
     
         location ~ * ^ / (robots\.txt) {
             root        www / mimvp_proxy;
             expires     365d ;
         }
     
         location ~ * ^ / favicon\.ico {
             root        www / mimvp_proxy;
             expires     365d ;
         }
     
         location ~ * ^ / img / logo\.png {
             root        www / mimvp_proxy;
             expires     365d ;
         }
     
         location ~ / \.ht {
             deny  all ;
         }
    }

     

     

    2. 国外新加坡腾讯云服务器proxy.mimgu.cn

    vim mimvp_proxy2.conf

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    14
    15
    16
    17
    18
    19
    20
    21
    22
    23
    24
    25
    26
    27
    28
    29
    30
    31
    32
    33
    34
    35
    36
    37
    38
    39
    40
    41
    42
    43
    44
    45
    46
    47
    48
    49
    50
    51
    52
    53
    server {
        listen       80 ;
      server_name   proxy.mimgu.cn;      
      root      www / mimvp_proxy;
        rewrite ^(. * )$  https: / / $host$ 1 permanent;   ## 全部请求强制跳转到 https
    }
     
     
    server {
         listen          443 ssl http2;
         server_name     proxy.mimgu.cn;      
         root            www / mimvp_proxy;
         ssl             on;
     
         ssl_certificate      proxy.mimgu.cn.crt;
         ssl_certificate_key  proxy.mimgu.cn.key;
     
         ssl_session_cache    shared:SSL: 1m ;
         ssl_session_timeout  10m ;
     
         ssl_protocols TLSv1 TLSv1. 1 TLSv1. 2 ;
     
         ssl_ciphers ECDHE - RSA - AES128 - GCM - SHA256:HIGH:!aNULL:!MD5:!RC4:!DHE;
         ssl_prefer_server_ciphers on;
     
      location / {
        proxy_pass          https: / / proxy.mimvp.com;    ## 全部请求强制跳转到国内服务器 https://proxy.mimvp.com
      }
     
      location ~ \.php$ {
        proxy_pass          https: / / proxy.mimvp.com;
      }
     
         location ~ * ^ / (images|img|javascript|js|css|blog|flash|media|static) / {
             proxy_pass          https: / / proxy.mimvp.com;    ## css,js,img 等全部要强制转发,否则可能排版错乱
         }
     
         location ~ * ^ / (robots\.txt) {
             proxy_pass          https: / / proxy.mimvp.com;
         }
     
         location ~ * ^ / favicon\.ico {
             proxy_pass          https: / / proxy.mimvp.com;
         }
     
         location ~ * ^ / img / logo\.png {
             proxy_pass          https: / / proxy.mimvp.com;
         }
     
         location ~ / \.ht {
             deny  all ;
         }
    }

     

    3. 查看效果

    http://proxy.mimvp.com          // 强制跳转到  https://proxy.mimvp.com

    https://proxy.mimvp.com        // 对外显示的唯一域名网址

    http://proxy.mimgu.cn            // 强制跳转到  https://proxy.mimgu.cn,然后继续强制跳转到 https://proxy.mimvp.com

    https://proxy.mimgu.cn          // 强制跳转到  https://proxy.mimvp.com

     

    小结

    1. 四个域名,统一跳转指向唯一的服务 https://proxy.mimvp.com

    2. http 实现了强制跳转到 https ,整个网站使用ssl加密

    3. 国外的腾讯云域名(proxy.mimgu.cn),nginx代理转发到了国内阿里云域名(proxy.mimvp.com

    4. 上面nginx配置文件,是一个经典的配置,信息量大,值得认真学习米扑科技的匠心服务

     

     

    参考推荐:

    Nginx Redirect重定向所有子域名到www

    Nginx 配置文件禁止访问目录或文件

    Nginx屏蔽访问过于频繁的IP

    Mac OS X 安装 Nginx

     

    展开全文
  • Nginx中如何配置HTTPS反向代理发送请求到后端的HTTP接口 Nginx中配置https做反向代理 大家好,因为不是专业做Nginx的之前也没有学习过,大都是自己踩坑之后总结的,希望对大家有所帮助! 下面直接开始讲解,首先我们...
  • server { listen 8090; server_name localhost; location / {  proxy_pass http://127.0.0.1:8010; } location /portal { rewrite ^.+portal/?(.*)$ /portal/$1 break;  proxy_pass http://mm.myc...
  • vue使用代理解决请求跨域问题

    千次阅读 2019-03-15 09:37:35
    在日常开发中,我们前端必不可少的需要像后端请求数据。 但是一般前后端分离,所以域名、端口等肯定不尽相同,这样就不可避免的会遇到浏览器的同源策略限制。 在一般情况下,后端都会设置请求...我请求地址是这...
  • 使用nginx代理请求到内网

    千次阅读 2018-11-26 09:52:11
    很多公司为了提高云服务器的安全性,采用nginx代理。 原料:三台云服务器,一台带有一个公网ip(),另外两台不需要公网ip,有内网ip即可,只要这三台的内网ip在同一个网段中。 准备:不带公网ip的云服务器安装好...
  • 例如我有两个页面 abc.com/pageA和abc.com/pageB 然后现在都需要加载一个js,url都是abc.com/myjs.js 我想实现的想过就是将两个页面的请求分别代理到192.168.1.1/A.js和192.168.1.1/B.js
  • package ... import java.io.BufferedReader; ... * url:外网测试地址 param:请求... HttpProxy("请求地址", "请求参数", "代理地址", 0 ); } }   转载于:https://www.cnblogs.com/sinosoft/p/11014475.html
  • java通过http方式代理请求api接口

    千次阅读 2018-11-29 11:28:13
    最近在对接客户那边第三方合作的http api接口的时候,发现通过java代码的方式请求第三方http接口,发现在我本地可以正常访问,但是把程序部署客户那边的服务器上就发生超时,找不访问地址的错误。通过测试发现,...
  • Nginx反向代理服务器(请求转发)

    千次阅读 2021-12-03 18:08:47
    访问端口不同,此时就会造成请求每个服务器路径的端口号不一致,这样不方便跳转增加代码整体复杂程度,此时就需要nginx,所有的访问路径使用一个请求端口,由nginx将请求转发具体的服务器(根据地址中包含的唯一...
  • nginx代理ajax跨域请求

    千次阅读 2019-08-07 16:06:54
    配置,转发请求到指定的后台服务,ip是本机的ip地址,也可以是127.0.0.1,port就是自己后台启动的端口,即本例中8080端口。这样,ajax就能访问跨域的后台服务了。 值得注意的是,当ajax的url配置为localhost:...
  • 使用IP代理发起http请求

    万次阅读 2018-02-05 11:54:12
    同一IP爬多了,对方服务器可能会意识你是一个爬虫程序而非真实用户,那么你就有IP被封的风险 随机切换不同的代理IP进行爬取,可以规避封IP反爬(做点网站真是挺不容易的o(╥﹏╥)o) 获取代理IP的渠道有多种,我用...
  • Java代理HTTP请求

    千次阅读 2018-06-08 10:00:40
    private String proxySet="true"...代理地址"; private String proxyPort="8080";//代理端口 private String loadJSON(String url) { String json = null; try {...
  • Selenium本身是不支持HTTP请求抓取的,因为其团队认为这个不是selenium要解决的问题(确实也是)。所以推荐使用一个相关联的项目 -- BrowserMobProxy。 具体项目首页见:...
  • 【Vue】如何配置代理请求接口

    千次阅读 2019-11-28 22:50:30
    在实际项目中往往不想直接暴露后台的真实接口,我们可以通过配置代理接口进行伪装请求。 打开项目中/config/index.js文件 找到module.exports 配置 在dev模块中进行如下配置: // Proxy proxyTable: { ...
  • 最后求助公司大神,发现请求被重定向了(301),估计是请求地址是 https 的 而本地是 http 的。 最后在 devServer 中 增加了 https: true 配置解决了问题。 devServer: { port: port, open: t...
  • 使用nginx的反向代理,是解决跨域的一个重要方法。在nginx的配置文件中,我们通常可以看到这么一段: proxy_set_header Host $host; proxy_set_header X-Real-IP $remote_addr; proxy_set_header X-Forwarded-For...
  • 反向代理适用于很多...当在一台主机上部署了多个不同的web服务器,并且需要能在80端口同时访问这些web服务器时,可以使用 nginx 的反向代理功能: 用 nginx在80端口监听所有请求,并依据转发规则(比较常见的是以 U...
  • React代理请求解决跨域问题

    千次阅读 2019-04-29 17:02:48
    假设下面的常量存放的地址是我们请求地址 const endPointURI = ‘https://08ad1pao69.execute-api.us-east-1.amazonaws.com/dev/random_joke’; 这里我们直接调用了一个「非本地」地址。在实际开发中是比较罕见的...
  • nginx 代理post请求变成get请求问题

    万次阅读 2019-08-13 20:54:00
    最近项目中通过nginx转发,解决请求跨域问题,配置如下: location ~ ^/api/b.com/(.*) { rewrite ^/api/b.com/(.*)$ /$1 break; proxy_pass http://b.com; proxy_redirect off; proxy_set_header Host b....
  • 通过nginx代理后的获取请求URL(getRequestURL)默认获取的url会显示为nginx代理服务器的server name名称。 nginx upstream默认配置 upstream test-api { server 192.168.2.130; } server { listen 80; location / ...
  • webpack-dev-server代理请求配置

    千次阅读 2020-02-24 16:47:30
    为了避免在项目上线之后要改动很多请求地址,我们使用webpack-dev-server统一做一个代理。 本地mock数据在 /static/mock/ 这个路径下 想要访问 /static/mock/index.json,我们的路径就应该写成 axios.get('/static/...
  • 目的是需要所有请求请求到我前端的服务器上,在我前端服务器再次发送请求到后端的两个服务器上,听起来还算简单,但里面有个硬性要求就是。 必须通过内网ip地址访问后端服务器! 必须通过内网ip地址访问后端...
  • 获取请求完全URL地址

    万次阅读 2016-01-12 09:19:44
    获取请求完全URL地址
  • 主要修改lacation属性,使所有请求都被转发http://localhost:8080的Tomcat服务器下处理: listen: 是监听的端口,即用户访问nginx服务的端口 server_name: 服务名,经过测试并不会影响什么 ...
  • http请求代理proxy-ajax

    千次阅读 2017-09-04 16:54:31
    今天把项目中的反向代理脚本程序抽成了一个插件,通过配置文件配置代理的http请求,这样使用起来比较方便,每位开发成员都可以用自己配置的代理调试代码。
  • Nginx反向代理后,Servlet应用通过request.getRemoteAddr()取的IP是Nginx的IP地址,并非客户端真实IP,通过request.getRequestURL()获取的域名、协议、端口都是Nginx访问Web应用时的域名、协议、端口,而非客户端...
  • vue请求没有携带cookie 后台获取不JSSESSION vue接口不发送cookie 验证码错误后台没有session vue请求头带cookie JSESSIONID

空空如也

空空如也

1 2 3 4 5 ... 20
收藏数 337,180
精华内容 134,872
关键字:

代理所有请求到新地址