Question

我有一个Angular应用程序（由Angular CLI构建），它通过Heroku上的express进行托管：

const express = require('express');
const app = express();
// Run the app by serving the static files
// in the dist directory
app.use(express.static(__dirname + '/dist'));
// Start the app by listening on the default
// Heroku port
app.listen(process.env.PORT || 8080);

此应用是vk.com的iframe，其中用户的浏览器将请求中的字符串传递给服务器，该服务器托管我的应用，包含一些重要信息，如用户ID等。它看起来像这样（实际值替换为星号）：

path="/?api_url=https://api.vk.com/api.php&api_id=*&api_settings=1&viewer_id=*&viewer_type=4&sid=*&secret=*&access_token=*&user_id=0&group_id=*&is_app_user=1&auth_key=*&language=0&parent_language=0&is_secure=1&ads_app_id=*&referrer=unknown&lc_name=*&sign=*&hash="

有没有办法提取这些值并将其传递给应用程序，然后再转到用户的浏览器并加载？所以它们可以存储在变量或类似的东西中。

Answer 1

您可以将位置值转换为this等javascript。您可以将此代码放在根组件中。从上面提到的链接复制getParameterName函数。

function getParameterByName(name, url) {
    if (!url) url = window.location.href;
    name = name.replace(/[\[\]]/g, "\\$&");
    var regex = new RegExp("[?&]" + name + "(=([^&#]*)|&|#|$)"),
        results = regex.exec(url);
    if (!results) return null;
    if (!results[2]) return '';
    return decodeURIComponent(results[2].replace(/\+/g, " "));
}

@Component({
  selector: 'my-app',
  template: `
    <div>
      <h2>Hello {{name}}</h2>
    </div>
  `,
})
export class App {
  name:string;
  constructor() {
    this.name = `Angular! v${VERSION.full}`+getParameterByName('name');
  }
}

我在这里尝试了它的确有效。 https://plnkr.co/edit/I2hTylwlwc6TTHf17tHo?p=preview

如何将请求参数传递给Angular app？

1 个答案: