如何在angular项目中调用php邮件文件

Question

我使用angular创建了包含联系人表单的单页应用程序。对于联系人表单，我使用了php邮件功能。我将这个php文件保存在angular项目的assets文件夹中。

我使用angular HTTPCLIENT模块在组件中使用以下代码调用联系人php文件：

this.http.sendEmail(user).subscribe(
data => {
let res:any = data; 
//   debugger;
console.log(`${user.name} is successfully booked appointment.`);
this.elementRef.nativeElement.querySelector('.contact-form').innerHTML = "<div class='inner-content'><p class='success-msg'>Thanks for contacting us. We will contact you ASAP!</p>";       
},
err => {
console.log(err);
this.loading = false;
this.buttonText = "Submit";
},() => {
this.loading = false;
this.buttonText = "Submit";
}
);
}

服务代码：

sendEmail(data: any) {
return this.http.post(`../assets/inc/email.php`, data);
}

我正在尝试发布联系表格。它没有使用php文件。如何解决这个问题，请帮我。事实上，我是第一次尝试Anguar与Php。所以请帮助我实现这一目标。

Answer 1

我在这里看到两个问题：

1. 除非您的web服务器设置为提供php文件，否则您无法在Angular应用程序的assets文件夹中托管.php文件。如果您的服务器类似于Apache，这可能会起作用，但它不会与angular dev服务器(ng serve(一起工作，因此这永远不会在本地工作。相反，您需要使用类似xampp的东西在本地托管PHP文件
2. this.http.post()请求URL，而不是项目结构中文件的路径。假设您可以让php文件在assets目录中工作，URL应该更像这样：this.http.post('/assets/inc/email.php', data);

在将PHP文件放入Angular应用程序的assets目录时要非常小心。这并不是它的实际使用方式，如果你试图在Github Pages、Firebase或Vercel等静态网络主机上托管这个Angular应用程序，你的PHP文件内容(包括电子邮件、密码等(将很有可能暴露在世界面前。

我建议为PHP文件设置一个单独的服务器，并更新http.post()URL来调用这些文件。