php前端怎麼調用後端介面,php服務端介面實現流程

本文目錄一覽：

• 1、前端vue與後端Thinkphp在伺服器的部署
• 2、前端與後台如何連接起來，就是html和php，怎麼連接起來？
• 3、如何將前台與PHP後台連接起來
• 4、微信小程序，後端用php寫完介面，怎麼把數據給前端，要帶什麼參數

前端vue與後端Thinkphp在伺服器的部署

vue在服務端部署時，我們都知道通過npm run build 指令打包好的dist文件，通過http指定是可以直接瀏覽的，Thinkphp通過域名指向index.php文件才可以瀏覽。要使前端正常調用後端數據，有兩種方法：1、前端跨域調用後端數據，2、前端打包文件部署在後端的伺服器文件夾下（同域）。

web伺服器： apache

一、跨域

在伺服器配置站點：

在路徑/home/www/  下創建test項目文件夾，用來放項目文件。  

找到httpd-vhosts.conf文件配置站點  

前端站點：  

    ServerName test.test.com  

    DocumentRoot “/home/www/test/dist”    

    DirectoryIndex index.html  

後端站點：  

    ServerName test.testphp.com  

    DocumentRoot “/home/www/test/php”    

    DirectoryIndex index.php  

將前端打包好的dist文件放在/home/www/test/ 文件夾下，運行可瀏覽，當路徑改變時，刷新會出現404錯誤。此時dist文件下創建一個.htaccess文件，當路徑不存在時，路徑指向能解決此問題。

  RewriteEngine On  

  RewriteBase /  

  RewriteRule ^index\.html$ – [L]  

  RewriteCond %{REQUEST_FILENAME} !-f  

  RewriteCond %{REQUEST_FILENAME} !-d  

  RewriteRule . /index.html [L]  

在/home/www/test文件夾下創建項目根目錄php文件夾，將thinkphp文件放在php下。TP5的入口文件在public文件下，在這將public下的入口文件index.php挪到php文件夾下（個人習慣將入口文件放在項目根目錄）, 後端綁定Index模塊。

前端調用後端介面，存在跨域，跨域解決方法有好幾種，在這我將在後端php做配置，解決跨域問題，在公用控制器設置跨域配置：

class Common extends Controller  

{  

    public $param;  

    // 設置跨域訪問  

    public function _initialize()  

    {  

        parent::_initialize();  

        isset($_SERVER[‘HTTP_ORIGIN’]) ? header(‘Access-Control-Allow-Origin: ‘.$_SERVER[‘HTTP_ORIGIN’]) : ”;  

        header(‘Access-Control-Allow-Credentials: true’);  

        header(‘Access-Control-Allow-Methods: GET, POST, PUT, DELETE, OPTIONS’);  

        header(“Access-Control-Allow-Headers: Origin, X-Requested-With, Content-Type, Accept, authKey, sessionId”);  

$param =  Request::instance()-param();  

$this-param = $param;  

    }  

}  

前端調用登錄介面： this.axios.post(”, {user: ”, password: ”})。

(可在webpack.base.conf.js文件下可定義介面：)

二、同域

後端配置同上，公共配置器中的header配置注釋。將前端的dist文件下的所有文件（包含.htaccess），放在php文件夾下。將後端index控制器的index方法的路徑重定向php下的index.html文件：

namespace app\index\controller;  

use think\Controller;  

class Index extends Controller  

{  

    public function index() {  

$this-redirect(‘/index.html’);  

    }  

}  

前端調用登錄介面： this.axios.post(‘/index.php/base/login’, {user: ”, password: ”})

轉自：

前端與後台如何連接起來，就是html和php，怎麼連接起來？

只能夠使用POST或者是GET來傳輸吧，PHP語言其實還是後端的，我們鏈接也只能夠模擬表單，建議添加pjax插件，然後javascript模擬表單點擊傳輸數據

具體服務端PHP代碼：

?php if($_GET[‘virtual_get’]){

    //Code You Want To Run

}

具體Javascript代碼：

var FormElement = document.createElement(‘form’);

var submit = document.createElement(‘input’);

FormElement.setAttribute(‘method’,’get’);

FormElement.setAttribute(‘action’,’?’);

submit.setAttribute(‘type’,’submit’);

FormElement.appendChild(submit);

submit.click()

如何將前台與PHP後台連接起來

進入php源程序目錄中的ext目錄中，這裡存放著各個擴展模塊的源代碼，選擇你需要的模塊，比如curl模塊：cd curl

執行phpize生成編譯文件，phpize在PHP安裝目錄的bin目錄下

/usr/local/php5/bin/phpize

運行時，可能會報錯：Cannot find autoconf. Please check your autoconf installation and

the $PHP_AUTOCONF

environment variable is set correctly and then rerun this

script.，需要安裝autoconf：

yum install autoconf（RedHat或者CentOS）、apt-get install

autoconf（Ubuntu Linux）

/usr/local/php5/bin/php -v

執行這個命令時，php會去檢查配置文件是否正確，如果有配置錯誤，

這裡會報錯，可以根據錯誤信息去排查！

微信小程序，後端用php寫完介面，怎麼把數據給前端，要帶什麼參數

1、首先在 index.js中想寫邏輯代碼。

2、其中page裡面的data裡面是前台展示時的一些數據，而onload裡面是調用的介面。

3、調用的方式為get調用，返回的數據存在res裡面。

4、返回的數據，而data中就是需要的數據。

5、data：一個入參method：請求方式，如果是POST請求必須按上面寫，默認是get請求，不用處理。complete：頁面請求完成後的方法，通過that.setData將數據傳遞給WXML頁面。success：頁面載入成功後的執行方法。