在localhost上进行开发时,重定向URL的最佳方法是什么?

时间:2016-12-07 22:53:25

标签: .htaccess mod-rewrite url-rewriting localhost url-redirection

问题:

我有两个网络应用," App1"从" App2"中提取数据通过ajax。在生产中,App1应该从App2的生产URL中获取数据。但是,当我在localhost:3000上开发App1时,我希望App1从本地版本的App2获取localhost:3001(不是来自生产版本)的数据。

之前的研究:

我已经搜索了很多关于如何做到这一点的事情,但我无法对我发现的东西做出正面或反面。

  • 我已经阅读了一些建议我应该更改/ etc / hosts的内容,但我还没有能够解决这个问题,因为生产站点使用HTTPS但我的localhost只是HTTP。 / p>

  • 我也遇到了.htaccess,但添加文件似乎没有任何效果,我在Apache兔子洞中迷失了方向,只是想找到如何转动.htaccess的东西。 (我也看过一些关于mod-rewrite的内容,但是也无法弄清楚如何使其工作。)

  • 我还发现了Switcheroo Redirector之类的Chrome扩展程序,但由于简单的重定向将一些重要的HTTP响应更改为301,而我的应用程序并非如此,因此效果不佳。 t旨在处理。

问题

  • 我尝试做什么的正确工具是什么? (/ etc / hosts,.htaccess或其他)

  • 该工具的最基本配置是什么来获得理想的结果?

3 个答案:

答案 0 :(得分:0)

通常,您想要更改app1实际请求的URL。通常这样的URL(至少是基本URL)是app的配置参数,而不是硬编码的。因此,您可以将其放在配置文件中,或者更优雅地将其作为环境变量从http服务器移交给php脚本。然后,只有这样,您才能获得所需的所有重写方式。但如果不这样,请求甚至无法到达您当地的http服务器,这意味着所有做任何事情的尝试都没有效果。

然而,另一个选择是修改本地主机名配置以将该app2生产系统名称解析为本地IP地址。然后,您必须使用生产系统名称在本地http服务器内配置虚拟主机并启用https。您可以使用自签名证书进行ssl加密。这应该工作,只有您的应用程序需要接受https连接的这种自签名证书,因此应该关闭证书验证。

答案 1 :(得分:0)

我会像下面这样用jquery做一个简单的请求。查看有关查询http://api.jquery.com/jquery.ajax/

的查询Ajax请求的更多信息
var url = "localhost:3001/cart/1";
 $.ajax({
            url: url,
            data: currentQueryData,
            success: function(data) {
              console.log("Data from App2 url: + data);
              // Do something with your data
            },
            failure: function(error){
                console.log(error);
            }
        });

当您使用已开发的应用程序进行制作时,只需将属性网址的值更改为" https://api.app2.com"所以请求要比生产App2。 您还可以通过编辑/ etc / hosts配置文件将生产URL指向localhost,并将此行添加到其中:

127.0.0.1 domain.app2.de

但您仍需要在javascript文件中将端口添加到该域。喜欢

var url = "domain.app2.de:3001"

因为您无法将域绑定到/ etc / hosts文件中的特定端口。 所以像下面这样的东西不起作用!

127.0.0.1:3001 domain.app2.de  # not working

希望它有所帮助。我建议在一个配置中将入口点url存储到你的app2。将它存储在javascript值中只是为了显示如何以siplefied示例完成它的目的。如果你能提供一个你想从app2中获取的例子,那将是很好的。

答案 2 :(得分:0)

我会使用mod_proxy + mod_rewrite,以便主域上具有单个路径前缀的所有URL在内部被重写为对app2的代理请求。这有几个好处:

  1. 您不会使用服务器配置污染您的前端。这样可以很好地分离关注点,并确保代码在开发和实时之间没有区别。
  2. 没有CORS问题,因为对于客户端,所有请求都被发送到相同的方案,域和端口。
  3. Ajax URL更清晰,因为它们只能是root-relative。 (应该是您的所有网址。)
  4. 您可以在开发服务器和实时服务器上使用相同的,未经修改的.htaccess文件,因为它可以根据发送的主机标头有条件地重写每个app2。 (如果你有权访问它,你应该把你的配置放在vhost中。)
  5. 您可以使用相同的条件逻辑仅在实时上强制执行https。 (不要在应用程序代码中执行此操作。)
  6. 您可以通过编辑单个规则切换到不同的app2服务器进行重定位/升级,而不会对用户造成任何干扰。
  7. 假设您在.htaccess

    中执行此操作
    RewriteEngine on
    # force https and single domain on live
    RewriteCond %{HTTP_HOST} !=localhost
    RewriteCond %{HTTP_HOST} ^(?!real-app1\.com$). [NC,OR]
    RewriteCond %{HTTPS} =off
    RewriteCond %{THE_REQUEST} ^\S+\s+/(\S*)
    RewriteRule ^ https://real-app1.com/%1 [NS,NE,L,R=301]
    # API proxy on dev
    RewriteCond %{HTTP_HOST} =localhost
    RewriteCond %{THE_REQUEST} ^\S+\s+/API(?:/(\S*))?
    RewriteRule ^API(?:$|/) http://localhost:3001/%1 [NS,NE,P]
    # API proxy on live (no need for hostname check)
    RewriteCond %{THE_REQUEST} ^\S+\s+/API(?:/(\S*))?
    RewriteRule ^API(?:$|/) https://real-app2.com/%1 [NS,NE,P]
    

    然后,在您的前端,普通链接可以只是<a href="/foo/bar/">…,并且假设您正在使用库,则ajax可以像这样简单:

    $.ajax('/API/path/to/endpoint/', {
        data: {
            query_param: 'param_value'
        }
    })
    .done(function() {
        // API works
    })
    .fail(function() {
        // oh dear
    });
    

    在那里,app2应该收到http://localhost:3001/path/to/endpoint/?query_param=param_value。正确设置此工作量的工作量少于管理应用程序生命周期中的配置和部署问题的麻烦。绝对值得。