واکشی و خواندن اطلاعات از پایگاه داده در AngularJS

واکشی و خواندن اطلاعات از پایگاه داده در AngularJS

کدهای آورده شده در مبحث قبلی را می توان از پایگاه داده نیز خواند.

واکشی اطلاعات از یک سرویس دهنده ی PHP که پایگاه داده ی MySQL بر روی آن مستقر است:

<!DOCTYPE html> <html> <head> <title></title> <script src="Angular.js"></script> <style> table, th, td { border: 1px solid grey; 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="x in names"> <td>{{ x.Name }}</td> <td>{{ x.Country }}</td> </tr> </table> </div> <script> var app = angular.module('myApp', []); app.controller('customersCtrl', function ($scope, $http) { $http.get("customers.htm") .then(function (response) { $scope.names = response.data.records; }); }); </script> </body> </html>

واکشی اطلاعات از یک سرویس دهنده ی ASP.NET که SQL بر روی آن مستقر است:

<!DOCTYPE html> <html> <head> <title></title> <script src="Angular.js"></script> <style> table, th, td { border: 1px solid grey; 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="x in names"> <td>{{ x.Name }} </td> <td>{{ x.Country }}</td> </tr> </table> </div> <script> var app = angular.module('myApp', []); app.controller('customersCtrl', function ($scope, $http) { $http.get("customers.htm") .then(function (response) { $scope.names = response.data.records; }); }); </script> </body> </html>

نمونه هایی از کد سرور

قسمت زیر فهرستی از کدهای سرور را نمایش می دهد که از آنها جهت واکشی اطلاعات SQL استفاده می شود:

استفاده از PHP و MySQL برگرداندن JSON

استفاده از PHP و MS Access برگرداندن JSON

استفاده از ASP.NET و VB و MS Access بازیابی JSON

استفاده از ASP.NET و Razor و SQL Lite بازگرداندن JSON

درخواست های HTTP از چندین سایت / cross-site

درخواست اطلاعات از سرور متفاوت(جدا از سرور صفحه‌ی درخواست کننده) ، درخواست HTTP به صورت سایت متقابل اطلاق می گردد.

درخواست های Cross-site (درخواست http از چندین سایت) در وب رایج هستند. صفحات بسیاری وجود دارند که CSS ،تصاویر و نیز پردازه‌های (script) خود را از سرورهای دیگر می‌گیرند.

در مرورگرهای نوین درخواست های cross-site از پردازه ها (script) ، به منظور رعایت مسائل امنیتی، به خود همان سایت محدود شده اند.

خط زیر به منظور فراهم آوردن امکان دسترسی cross-site به مثال های PHP اضافه شده است:

1- کد سرور 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); ?>

2- کد سرور PHP و MS Access

<?php header("Access-Control-Allow-Origin: *"); header("Content-Type: application/json; charset=ISO-8859-1"); $conn = new COM("ADODB.Connection"); $conn-> open("PROVIDER=Microsoft.Jet.OLEDB.4.0;Data Source=Northwind.mdb"); $rs = $conn->execute("SELECT CompanyName, City, Country FROM Customers"); $outp = ""; while (!$rs->EOF) { if ($outp != "") {$outp .= ",";} $outp .= '{"Name":"' . $rs["CompanyName"] . '",'; $outp .= '"City":"' . $rs["City"] . '",'; $outp .= '"Country":"'. $rs["Country"] . '"}'; $rs->MoveNext(); } $outp ='{"records":['.$outp.']}'; $conn->close(); echo ($outp); ?>

3- کد سرور PHP و MS Access

<?php header("Access-Control-Allow-Origin: *"); header("Content-Type: application/json; charset=ISO-8859-1"); $conn = new COM("ADODB.Connection"); $conn->open("PROVIDER=Microsoft.Jet.OLEDB.4.0;Data Source=Northwind.mdb"); $rs = $conn->execute("SELECT CompanyName, City, Country FROM Customers"); $outp = ""; while (!$rs->EOF) { if ($outp != "") {$outp .= ",";} $outp .= '{"Name":"' . $rs["CompanyName"] . '",'; $outp .= '"City":"' . $rs["City"] . '",'; $outp .= '"Country":"'. $rs["Country"] . '"}'; $rs->MoveNext(); } $outp ='{"records":['.$outp.']}'; $conn->close(); echo ($outp); ?>

4- کد سرور ASP.NET ، VB Razor و SQL Lite

@{ Response.AppendHeader("Access-Control-Allow-Origin", "*") Response.AppendHeader("Content-type", "application/json") var db = Database.Open("Northwind"); var query = db.Query("SELECT CompanyName, City, Country FROM Customers"); var outp ="" var c = chr(34) } @foreach(var row in query) { if outp <> "" then outp = outp + "," outp = outp + "{" + c + "Name" + c + ":" + c + @row.CompanyName + c + "," outp = outp + c + "City" + c + ":" + c + @row.City + c + " ," outp = outp + c + "Country" + c + ":" + c + @row.Country + c + "}" } outp ="{" + c + "records" + c + ":[" + outp + "]}" @outp

5- کد سرور ASP.NET ، VB Razor و SQL Lite

@{ Response.AppendHeader("Access-Control-Allow-Origin", "*") Response.AppendHeader("Content-type", "application/json") var db = Database.Open("Northwind"); var query = db.Query("SELECT CompanyName, City, Country FROM Customers"); var outp ="" var c = chr(34) } @foreach(var row in query) { if outp <> "" then outp = outp + "," outp = outp + "{" + c + "Name" + c + ":" + c + @row.CompanyName + c + ", " outp = outp + c + "City" + c + ":" + c + @row.City + c + " ," outp = outp + c + "Country" + c + ":" + c + @row.Country + c + "}" } outp ="{" + c + "records" + c + ":[" + outp + "]}" @outp



نظرات کاربران



عبارت امنیتی : حاصل 3 × 3 می شود :
متن پیام :