我会将数据发送到我的数据库。
所以我在我的component.ts中创建我的函数,它调用我的服务
ajoutText(newtext: String) {
this.dataService.sendtext(newtext);
}
并在HTML方面
<form class="form">
<mat-form-field class="textinput">
<input #newtext matInput placeholder="Ajoutez votre texte" value="">
</mat-form-field>
<button type="button" mat-raised-button color="primary" (click)="ajoutText(newtext.value)">Ajouter</button>
</form>
然后我的服务将数据发送到服务器
export class AjouttextService {
url = "http://127.0.0.1:8080/v1";
constructor(private http: HttpClient) { }
sendtext(text): Observable<string> {
console.log(text);
return this.http.post<string>(this.url, text);
}
}
我的console.log(text)打印出我在输入字段中输入的文本。
在我的服务器端,我使用Express
var http = require("http");
var admin = require('firebase-admin');
var firebase = require("firebase");
var express = require("express");
var app = express();
var routerProj = require("./routes/routes");
var bodyParser = require("body-parser");
var port = process.env.app_port || 8080; // set our port
app.use(bodyParser.urlencoded({ extended: true }));
app.use(bodyParser.json());
var server = app.listen(port);
app.use(function (req, res, next) {
res.header("Access-Control-Allow-Origin", "*");
res.header('Access-Control-Allow-Methods', 'GET, POST, PUT ,DELETE');
res.header("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept,*");
next();
});
var config = {
apiKey: "XXXXXXXXXXX",
authDomain: "datatable-18f93.firebaseapp.com",
databaseURL: "https://datatable-18f93.firebaseio.com",
projectId: "datatable-18f93",
storageBucket: "datatable-18f93.appspot.com",
messagingSenderId: "282475200118"
};
firebase.initializeApp(config);
var serviceAccount = require("./ServiceAcountKey.json");
admin.initializeApp({
credential: admin.credential.cert(serviceAccount),
databaseURL: "https://datatable-18f93.firebaseio.com"
});
app.use("/v1", routerProj);
//Create HTTP server and listen on port 8000 for requests
// Print URL for accessing server
console.log("Server running at http://127.0.0.1:8080/");
然后在我的路由器中,我在Firebase数据库中插入数据
router.use(function (req, res, next) {
// do logging
console.log("HI");
next(); //
});
...
router
.route("/")
.post(function (req, res, err) {
console.log("test")
// Get a database reference to our posts
var db = admin.database();
var ref = db.ref("/");
// Attach an asynchronous callback to read the data at our posts reference
ref.push(
{
"text": req.body
}
);
});
问题是我的服务器没有检测到客户端发送的请求。路径第一行的console.log(“test”)不会在我的控制台上打印“test”,也不会在console.log('Hi')上打印..
服务器正在运行并且是客户端。我不知道为什么不使用该路线。
答案 0 :(得分:3)
你快到了。您忘记了一行代码,这是Angular中的常见错误。
您忘了订阅sendText
功能。如果您没有订阅,您的http呼叫将不会启动!
this.dataService.sendtext(newtext).subscribe( data => console.log(data));
答案 1 :(得分:0)
我在Glitch上汇总了一个示例后端API:
https://glitch.com/edit/#!/sun-sardine?path=server.js:1:0
获取请求将是https://sun-sardine.glitch.me/api/articles。以下是Postman的屏幕截图,向您展示如何通过邮寄请求访问API:
有关使用Node / Express创建API的更多信息,我发现Gothinkster RealWorld Node Express示例应用程序是一个很好的起点:
https://github.com/gothinkster/node-express-realworld-example-app
我希望这会有所帮助:)