i am using vs code as ide. this is the app code.
<template>
<div class="hello">
<!-- Select All records -->
<input type='button' @click='allRecords()' value='Select All users'>
<br><br>
<!-- Select record by ID -->
<input type='text' v-model='userid' placeholder="Enter Userid between 1 - 24">
<input type='button' @click='recordByID()' value='Select user by ID'>
<br><br>
<!-- List records -->
<table border='1' width='80%' style='border-collapse: collapse;'>
<tr>
<th>Username</th>
<th>Name</th>
<th>Email</th>
</tr>
<tr v-for='user in users'>
<td>{{ user.username }}</td>
<td>{{ user.name }}</td>
<td>{{ user.email }}</td>
</tr>
</table>
</div>
</template>
<script>
import axios from 'axios';
export default {
name: 'HelloWord',
data: {
users:"",
userid: 0
},
methods: {
allRecords: function () {
axios.get('api/ajaxfile.php')
.then(function (response) {
app.users = response.data;
})
.catch(function (error) {
console.log(error);
});
},
recordByID: function () {
if (this.userid > 0) {
axios.get('ajaxfile.php', {
params: {
userid: this.userid
}
})
.then(function (response) {
app.users = response.data;
})
.catch(function (error) {
console.log(error);
});
}
}
}
}
</script>
running the app code, chrome dev tools, like resposnse displays me the source code of the php file (which doesn't run). The php file in another environment, using html including axios.js vue.js files as src (CDN) script works fine. where am I wrong or how should I configure the vs code environment?
Because localhost:8080 runs no PHP server you must use a server which is running PHP, either on your local machine (e.g. MAMP) or on your public server. If the project resides under the folder my_project and the PHP file under the subfolder static, the proxyTable must look like:
proxyTable: {
'/static/dserver.php': {
target: 'http://localhost/my_project',
changeOrigin: true
}
which resolves in http://localhost/my_project/static/dserver.php .