AngularJS Codeigniter base_url 路径设置

Posted

技术标签:

【中文标题】AngularJS Codeigniter base_url 路径设置【英文标题】:AngularJS Codeigniter base_url path settings 【发布时间】:2016-12-11 19:40:27 【问题描述】:

我正在使用 Codeigniter 3 和 AngularJs 创建一个网站。在 delevolping 时,我在 codeigniter 中遇到了一些基本 url 的问题。我附上了我的目录结构的图像文件。

在我的主页(views/home.php)中,我放置了一个用于加载不同页面的 ng-view。这里我使用 angularjs ngRoute 进行路由。

这是我的代码。

 var myApp = angular.module("myApp",["ui.bootstrap","ui.router","ngRoute"]);
 myApp.config(function($routeProvider) 
   $routeProvider
   .when("/", 
    templateUrl : "application/pages/mainpage.php"
    )
   .when("/about", 
    templateUrl : "application/pages/about.html"
    )
   .when("/services", 
    templateUrl : "application/pages/services.html"
    )
   .otherwise("/",
    templateUrl:  "application/pages/mainpage.php"
   );
 );

在 mainpage.php 中,我列出了一些位于 json 文件(datas/data.json)中的配置文件内容(虚拟内容)。并且所有的内容都列出来了。在这个清单中,我放置了一个带有 ng-click="myName"

的按钮

代码如下:

  <div class="container" ng-controller="ListController">

<div class="row">
    <div class="col-lg-12 text-center">
        <h1>Starter Template</h1>
        <p class="lead">Complete with pre-defined file paths that you won't have to change</p>

        <div class="row">
            <div class="col-sm-6 col-md-4 wow zoomIn" data-wow-delay="0.5s" ng-repeat="items in artists">
                <div class="thumbnail">
                    <img ng-src="settings.base_url/application/assets/images/profile/items.shortname.jpg" >

                    <div class="caption">
                        <h3>items.name</h3>
                        <p>items.bio</p>
                        <p><a href="javascrip:void(0);" class="btn btn-primary" ng-click="myName()" role="button">Button</a> <a href="#" class="btn btn-default" role="button">Button</a></p>
                    </div>
                </div>
            </div>


        </div>
    </div>
  </div>

  <!-- /.row -->
 </div>

我所有的 js 代码都写在 app.js(assets/js/app.js) 中,包括 Angular Js。在这个 js 文件中,我设置了一个与 codeigniter config.php 文件中相同的 base_url 变量

$config['base_url'] = 'http://localhost/AngularExPack/Angular_Bootstrap_CI_1/';

在 app.js 中

var base_url='http://localhost/AngularExPack/Angular_Bootstrap_CI_1/'

当我使用 ng-click="myName" 单击按钮时,我想获得一个控制器(Codeigniter 控制器)并希望在该控制器内执行一个功能。这里我使用 auth.php(controllers/auth.php) 和函数名作为 functionOne();

    public function functionOne()
    
        /*$this->load->view('home1');*/
         echo "hai";
    

为此,我使用 $hhtp.post 和 var base_url 作为路径。但我没有得到那个输出,它没有传递给那个控制器。

       myApp.controller('ListController', ['$scope', '$http', 'settings', function($scope, $http) 

                 $http.get('application/datas/data.json').success(function(data) 
                     $scope.artists = data;
                 );

                 $scope.myName = function() 
                     alert("hai1");
                     /**/
                     $http.post(base_url + 'auth/functionOne').success(function(response) 
                         $scope.data = response
                         console.log($scope.data);
                         alert($scope.data);
                     );

                 

             ]);

ng-click="myName" 功能正常。 但它没有传递给该控制器 auth.php 中的函数 functionOne。 我认为问题可能与 base_url 路径有关。如果有人知道这个请帮助我解决这个问题。

【问题讨论】:

它可能与 $config['csrf_protection'] = TRUE;您在 codeigniter 配置文件中找到的 感谢您的评论。我试过了,但没用。 【参考方案1】:

好吧,我不知道这会对你有所帮助,但我就是这样做的:

我在服务中有这个功能:

 saveFunction: function(obj, user, securityToken)  
            return $http(
            method: 'POST',
            url: 'index.php/controller/saveFUnction',
            data: $.param(
                postID: obj.id  ,
                csrfTokenName: securityToken,
                postName: obj.name,
                .....
                userID: user.id                 
            ),
            headers:  'Content-Type': 'application/x-www-form-urlencoded' 
        );
    

如果您的 csrfToken 在 codeigniter 配置中处于活动状态,您需要在表单中将其作为隐藏类型字段传递。此外,您必须在标题中设置内容类型。

【讨论】:

以上是关于AngularJS Codeigniter base_url 路径设置的主要内容,如果未能解决你的问题,请参考以下文章

AngularJS Codeigniter base_url 路径设置

AngularJS |如何将 Json 的数据发送到 Codeigniter 中的数据库

Codeigniter + Angular Js:如何接收 JSON 数据

如何使用angularjs在新窗口中打开链接

入侵和攻击模拟(BAS)实践

OAuth 无效的 Bas64