অ্যাঙুলারজেএস এসকিউএল - AngularJS SQL
ডাটাবেজ থেকে ডাটা দেখানোর জন্য AngularJS উপযুক্ত। শুধু নিশ্চিত হোন যে ডাটা জেসন ফরম্যাটে আছে।
MySQL দ্বারা PHP সার্ভার থেকে ডাটা ফেচ(Fetch) করা
উদাহরণ
<!DOCTYPE html>
<html lang="en">
<head>
<script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.6.5/angular.min.js">
</script>
<title>AngularJS উদাহরণ</title>
<style>
table, th , td {
border: 1px solid blue;
border-collapse: collapse;
padding: 5px;
}
table tr:nth-child(odd) {
background-color: #f1f1f1;
}
table tr:nth-child(even) {
background-color: #ffffff;
}
</style>
</head>
<body>
<div ng-app="myApp" ng-controller="customersCtrl">
<table>
<tr ng-repeat="a in names">
<td>{{ a.Name }}</td>
<td>{{ a.Country }}</td>
</tr>
</table>
</div>
<script>
var app = angular.module('myApp', []);
app.controller('customersCtrl', function($scope, $http) {
$http.get("customers_mysql.html")
.then(function (response) {$scope.names = response.data.records;});
});
</script>
</body>
</html>
ফলাফল
সার্ভার সাইড কোড
SQL ডাটাকে ফেচ(fetch) করার জন্য PHP এবং MySQL ব্যবহার করে JSON এ ডাটা রিটার্ন করা হয়।
Cross-Site HTTP রিকুয়েস্ট
অন্য সার্ভার থেকে ডাটা রিকুয়েস্ট করাকে Cross-Site HTTP রিকুয়েস্ট
Cross-site রিকুয়েস্টে অনেক পেজ সিএসএস, ইমেজ, ও স্ক্রিপ্ট অন্য সার্ভার থেকে লোড করে।
বর্তমান ব্রাউজারগুলোতে Cross-site HTTP রিকুয়েস্টে স্ক্রিপ্ট শুধুমাত্র একই সাইটে ব্যবহার করা যাবে।
Cross-site এক্সেস পাওয়ার জন্য নিম্নের লাইনটি যুক্ত করতে হবে।
header("Access-Control-Allow-Origin: *");
সার্ভার কোড PHP এবং MySQL
<?php
header("Access-Control-Allow-Origin: *");
header("Content-Type: application/json; charset=UTF-8");
$conn = new mysqli("myServer", "myUser", "myPassword", "Northwind");
$result = $conn->query("SELECT CompanyName, City, Country FROM Customers");
$outp = "";
while($rs = $result->fetch_array(MYSQLI_ASSOC)) {
if ($outp != "") {$outp .= ",";}
$outp .= '{"Name":"' . $rs["CompanyName"] . '",';
$outp .= '"City":"' . $rs["City"] . '",';
$outp .= '"Country":"'. $rs["Country"] . '"}';
}
$outp ='{"records":['.$outp.']}';
$conn->close();
echo($outp);
?>