不从 Angular 调用 PHP 文件答案

【问题标题】：Not calling PHP file from Angular不从 Angular 调用 PHP 文件
【发布时间】：2020-01-29 09:36:43
【问题描述】：

要求：我有一个 php 文件，它使用 MySQL 中的数据生成 Excel。我想从我的表单中调用它。

问题：当我从 HTML 调用它时，它可以正常下载，没有任何问题，但是当我从 Angular 调用它时，它没有被下载。

首先，我向您展示我在download.html下面的简单html代码

<html>
<head>
<body>

<form action="exportData.php" method="get">
  <button type="submit">Submit</button>
</form>

</body>
</head>
</html>

下面是我的 Angular/Ionic 代码：

home.html

<ion-header>
  <ion-navbar>
      <button ion-button menuToggle>
          <ion-icon name="menu"></ion-icon>
        </button>
    <ion-title>View Complaint Open / Close</ion-title>
    <ion-buttons end>
      <button ion-button (click)="showdata()">{{c_status}}</button>
      <button ion-button icon-only  (click)="downldexcl()" type="submit" title="Download Excel File">
        <ion-icon  name="ios-download-outline" class="top-icon"></ion-icon>
        </button>
    </ion-buttons>
  </ion-navbar>
</ion-header>

home.ts

import { UserProvider } from '../../providers/user/user';

...//some code 
  downldexcl()
{
  this.user.exlDwnld().subscribe(datac => {
      console.log(datac,"list");
      console.log(datac);
      //document.location.href = this.user._url+"download.php?file="+datac;
    });
}

user.ts

import { HttpClient } from '@angular/common/http';
import { Injectable } from '@angular/core';
import { Http,Response,Headers } from '@angular/http';
import 'rxjs/add/operator/map';
import {LoadingController, ToastController, ModalController, AlertController} from "ionic-angular";

...//some code 
    exlDwnld()
      {
       // let params1_c = '&t1label=' + t1label+'&t1data=' +encodeURIComponent(t1data)+'&h1colnum=' + h1colnum+'&t2label=' + t2label+'&t2data=' + encodeURIComponent(t2data)+'&h2colnum=' + h2colnum+'&total1=' + total1+'&total2=' + total2+'&fromdt=' + fromdt+'&todt=' + todt+'&filename=' + filename+'&topheader=' + topheader+'&subheader1=' + subhead1+'&subheader2=' + subhead2;
        var headers = new Headers();
        headers.append('Content-Type', 'application/x-www-form-urlencoded');
        return this._http.post(this._url + "exportData.php", {headers: headers})
          .map((response: Response) => response.json());
      }

为什么单击 Ionic/Angular 页面中的按钮时，Excel 没有被下载。

【问题讨论】：

datac 的控制台日志记录是什么？
它正在显示数据，prnt.sc/pcpaju
从截图看来exportData.php 正在返回原始 tsv 数据？您可能不想将其映射到 json，并且您需要在响应中实际使用它。如果您希望它的行为类似于基本的 html 示例，您可以将 http 客户端替换为 window.open(this._url + "exportData.php?" + params) 之类的东西 - 这应该直接打开 php 文件，就像 html 示例中的表单提交一样

标签： angular typescript ionic-framework ionic2 ionic3

【解决方案1】：

您在 Angular 中使用 post 请求方法而不是 get。尝试改变它。

return this._http.post(this._url + "exportData.php", {headers: headers})

到

return this._http.get(this._url + "exportData.php", {headers: headers})

这应该可以解决问题。

如果您使用的是旧的 http 模块，请从 '@angular/common/http' 导入新的 HttpClientModule

并删除到 response.json 的映射，新模块会为您完成。

【讨论】：

按照您的指导完成，但仍然没有下载 excel，请参阅我的回复 - prnt.sc/pcrjtq，我们也安装了新的 HttpClientModule，更新我的问题，请让我知道下一步我该怎么做