Angular-Cli Firebase托管:如何从外部服务器接受查询字符串 [英] Angular-Cli Firebase Hosting: How to accept a query string from external server

查看:102
本文介绍了Angular-Cli Firebase托管:如何从外部服务器接受查询字符串的处理方法,对大家解决问题具有一定的参考价值,需要的朋友们下面随着小编来一起学习吧!

问题描述

location.href这将获取提交的URL,然后我可以记录该URL,这可以在浏览器端运行,即. https://xxxx.firebaseapp.com/?page=123

location.href this gets the submitted url that I can then record, this works browser side ie . https://xxxx.firebaseapp.com/?page=123

但是,如果我从外部来源(即另一台服务器上的php脚本<?php get_content('https://xxxx.firebaseapp.com/?page=abcde'); ?>)进行查询,这似乎不起作用.

However if I query it from an external source i.e a php script on another server <?php get_content('https://xxxx.firebaseapp.com/?page=abcde'); ?> this does not seem to work.

角度代码...

    import { Location, LocationStrategy, PathLocationStrategy } from '@angular/common';


  constructor(
    public location: Location
  ) {
var url =  window.location.href
....//save the info
}

推荐答案

您将使用firebase函数执行此操作,这里是本教程的链接. https://firebase.google.com/docs/functions/get-started.

You would use firebase functions to do this here is a link to the tutorial,. https://firebase.google.com/docs/functions/get-started.

因此,如果我要创建一个新文件夹并执行

So if I were to make a new folder and do a

npm i -g firbase-tools;
firebase init;

然后使用firbase init进行设置,选择正确的项目功能"作为选择(对于您的实际项目,您可能需要选择多个选项)

then setup using firbase init selecting the correct project "functions" as a selection (for your actual project you may need to select multiple options)

然后您导航到功能文件夹/myproject/functions/index.js

you then navigate into the functions folder /myproject/functions/index.js

这是我使用的一些代码,使用上面的说明将数据保存到Firebase DB.

This is some code I use that uses the instructions above to save data to the firebase DB.

const functions = require('firebase-functions');

const admin = require('firebase-admin');
admin.initializeApp();


// Take the text parameter passed to this HTTP endpoint and insert it into the
// Realtime Database under the path /messages/:pushId/original
exports.addMessage = functions.https.onRequest((req, res) => {
  // Grab the text parameter.
  const data = req.query;
  // Push the new message into the Realtime Database using the Firebase Admin SDK.
  return admin.database().ref('/paymentslog').push({data}).then((snapshot) => {
    // Redirect with 303 SEE OTHER to the URL of the pushed object in the Firebase console.
    return res.redirect(303, snapshot.ref.toString());
  });
});

因此将数据推送到Firebase DB中的/paymentslog ...我的代码的设置方式是动态添加查询字符串中的所有内容

So data is pushed to /paymentslog in the Firebase DB... the way my code is setup is that EVERYTHING in the query string is added dynamicaly

因此,如果您使用的是PHP(file_get_contents)或AngularCli(http.post)在某些地方运行,则可以使用诸如https://us-central1-MY_PROJECT.cloudfunctions.net/addMessage?id=9955&&price=123&foo=hello

So if you were using PHP (file_get_contents) or AngularCli (http.post) running some where else you would simple use post http header to your url using quersthings like https://us-central1-MY_PROJECT.cloudfunctions.net/addMessage?id=9955&&price=123&foo=hello

将另存为

/paymentslog/randomkey/id = 9955
/paymentslog/randomkey/price = 123
/paymentslog/randomkey/foo = hello

随机密钥"来自我正在使用.push

The "randomkey" comes from the fact I am using .push

我可以做ref('/paymentslog/' + id).set来创建

/paymentslog/9955/price = 123
/paymentslog/9955/foo = hello

准备测试时,您可以执行firebase deploy将代码上传到您的项目中

When you are ready to test this you can do a firebase deploy that will upload the code to your project

我应该提到您不需要API凭据,因为firebase初始化会为您设置它们.

I should mention that you do not need the API credentials because the firebase init sets them up for you.

对于您的AngularCLI项目,这是一些使http.post正常工作的示例代码

For your AngularCLI project this is some example code for getting http.post working

private form_send_url:string = 'https://us-central1-MY_PROJECT.cloudfunctions.net/addMessage';

this._http.post(
  this.form_send_url,
  {
    'id':encodeURI("9955"),
    'price':encodeURI("123"),
    'foo':encodeURI("hello")
  },
  {'Content-Type': 'text/html'}
).then(data => {
  console.log(data.status);
  console.log(data.data); // data received by server
  console.log(data.headers);
}).catch(error => {
  console.log(error.status);
  console.log(error.error); // error message as string
  console.log(error.headers);
}).then(() => {
  this._navCtrl.push(goto new page);
});

});

这篇关于Angular-Cli Firebase托管:如何从外部服务器接受查询字符串的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!

查看全文
登录 关闭
扫码关注1秒登录
发送“验证码”获取 | 15天全站免登陆