Axios 使用 vuejs cli 获取 php 文件不起作用答案

【问题标题】：Axios get to php file using vuejs cli doesn't workAxios 使用 vuejs cli 获取 php 文件不起作用
【发布时间】：2018-11-26 16:52:34
【问题描述】：

每次我在 vuejs cli 上使用 axios 对 php 文件发出 get 请求时，它都不会运行脚本，而是会在不实际运行脚本的情况下转储完整的 php 脚本。但是，如果我尝试使用浏览器地址栏中所需的参数访问该地址，它会返回正确的响应。

这是我的代码：发出 get 请求的 Vue 组件

<script>
import axios from 'axios'
export default{
    data(){
        return{
            id : this.$route.params.id,
            post:{}
        }
    },
    created(){
        axios.get('../../php/ajaxfile.php?postid='+this.id).then((response)=>{
            this.post = response.data;
            console.log(response.data);
        }).catch((error) =>{
            console.log(error);
        });
    }
}

PHP 脚本：

<?php
include 'config.php';
if(isset($_GET['postid'])){
    $condition  = " id=".$_GET['postid'];
}
$userData = mysqli_query($con,"select * from blogpost WHERE ".$condition );

$response = array();

while($row = mysqli_fetch_assoc($userData)){

    $response[] = $row;
}

echo json_encode($response);
exit;

请帮我弄清楚我做错了什么

【问题讨论】：

标签： javascript php vue.js vuejs2 axios

【解决方案1】：

如果您在开发环境中，您可能通过http://localhost:8080 访问您的 vue 应用程序。

你的 axios 应该调用你本地 web 服务器的真实 url：

axios.get(process.env.ROOT_API+'/ajaxfile.php?postid='+this.id)

并将 ROOT_API 定义添加到您的 dev 和 prod 配置（/config/dev.env.js 和 /config/prod.env.js）：

这是我的 dev.env.js ：

'use strict'
const merge = require('webpack-merge')
const prodEnv = require('./prod.env')

module.exports = merge(prodEnv, {
  NODE_ENV: '"development"',
  ROOT_API: '"http://my-local-domaine.ltd"',
})

【讨论】：