Question

如何在Polymer Starter Kit（light version）中设置baseUrl？

（类似：http://localhost:8080/api/authenticate）

我想在子文件夹中运行它（dl和解压缩的PSK，服务器是xampp）：

Serving Polymer App to a /path not at root

当我转到该网址时，应用会重定向到：

http://localhost/test/psk/app/

有这个说明：

找不到：http://localhost/。重定向你到主页Ok

没有控制台错误，应用程序正常工作，除了URL问题。

以下是app.js：

// Sets app default base URL
  app.baseUrl = '/';

  if (window.location.port === '') {  // if production
    // Uncomment app.baseURL below and
    // set app.baseURL to '/your-pathname/' if running from folder in production
    // app.baseUrl = '/polymer-starter-kit/';


   // If this is baseURL:
   //app.baseUrl = 'http://localhost/test/psk/app/';
   //Then click on the menu -  reloads the page with 404 URL:
   //http://localhost/test/psk/app/users
  }
  ...

和routing.html

<script src="../bower_components/page/page.js"></script>
<script>
  window.addEventListener('WebComponentsReady', function() {

      console.log('routing.html');

    // We use Page.js for routing. This is a Micro
    // client-side router inspired by the Express router
    // More info: https://visionmedia.github.io/page.js/

    // Removes end / from app.baseUrl which page.base requires for production
    if (window.location.port === '') {  // if production
      page.base(app.baseUrl.replace(/\/$/, ''));
       console.log("app.baseUrl");
       console.log(app.baseUrl);
    }

    // Middleware
    function scrollToTop(ctx, next) {
      app.scrollPageToTop();
      next();
    }

    function closeDrawer(ctx, next) {
      app.closeDrawer();
      next();
    }

    function setFocus(selected){
      document.querySelector('section[data-route="' + selected + '"] .page-title').focus();
    }

    // Routes
    page('*', scrollToTop, closeDrawer, function(ctx, next) {
      next();
    });

    page('/', function() {
      app.route = 'home';
      setFocus(app.route);
    });

    page(app.baseUrl, function() {
      app.route = 'home';
      setFocus(app.route);
    });

    page('/users', function() {
      app.route = 'users';
      setFocus(app.route);
    });

    page('/users/:name', function(data) {
      app.route = 'user-info';
      app.params = data.params;
      setFocus(app.route);
    });

    page('/contact', function() {
      app.route = 'contact';
      setFocus(app.route);
    });

    // 404
    page('*', function() {
      app.$.toast.text = 'Can\'t find: ' + window.location.href  + '. Redirected you to Home Page';
      app.$.toast.show();
      page.redirect(app.baseUrl);
    });

    // add #! before urls
    page({
      hashbang: true
    });

  });
</script>

Answer 1

绝不是我假装在这里给出明确的答案。

我不认为从子文件夹运行目前正在运行。我已经尝试了几种黑客（设置app.baseUrl，黑客路由，使用page.base（）的各种组合）没有结果，我暂时放弃了。

聚合物网站https://elements.polymer-project.org/elements/app-route声明（撰写本文时）：

app-route 0.9.1

app-route是一个为Web应用程序启用声明性，自描述路由的元素。

n.b。 app-route仍处于测试阶段。我们预计它需要一些改变。我们依靠您的反馈意见！

所以，到目前为止（并希望分享）我所经历的是：您将直接从文件，Web服务器的根目录或非标准http端口上的root运行您的应用程序（以调试您的应用程序）您可以使用python http模块或其他一些小型服务器，这些服务器适用于以时尚http://localhost:port工作的静态文件。）部署需要相同的约束。

建议的运行方法：https://www.polymer-project.org/1.0/start/toolbox/set-up#serve-your-project

我没有尝试使用.htaccess来重写URL基础（这可能在理论上有用，但它会非常慢，因为这种应用的应用路由计算/反应不会发生在服务器端，但在客户端，并且只适用于像服务器这样的apache，而且大多数不需要的，你会松散客户端上下文）

老实说，我宁愿在这个问题上被证明是错误的。 ;）

Answer 2

不使用端口号时设置 app.baseUrl （即在制作中）

在app.js：

// Sets app default base URL
app.baseUrl = '/';
if (window.location.port === '') { // if production
    // Uncomment app.baseURL below and
    // set app.baseURL to '/your-pathname/' if running from folder in production
    app.baseUrl = '/base-url/you/want/to/use/';  // <- Set this here
}

如何在Polymer Starter Kit中设置baseUrl？

2 个答案: