javascript - Codeigniter jquery/ajax 外部文件 403

Question

我正在使用 Codeigniter 3，我有一个脚本，在我的 HTML 中使用时可以正常工作。如果我将代码放入外部文件中，我会收到 403 错误。

我的js文件位于root/jquery/js/myfile.js

错误为“403 Forbidden - localhost/mywebsite/main/explode_link”。

下面是外部 javascript 的开头。

$(document).ready(function(){
        $('.mashed_row a').click(function () {
            var link_id = $(this).attr('link_id');

         $.ajax({
                  type: 'POST',
                   url: 'main/explode_link',
                   data: {'<?php echo $this->security->get_csrf_token_name(); ?>' : '<?php echo $this->security->get_csrf_hash(); ?>', link_id},
                   dataType: 'json',
                   success : function(data) {
                       if(data){

这是我的外部链接。

        <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.3/jquery.min.js"></script>
    <script src="<?php echo base_url().'jquery/cookie.js'; ?>"></script>
    <script type="text/javascript" src="<?php echo base_url().'jquery/js/rating.js'; ?>"></script>
    <script type="text/javascript" src="<?php echo base_url().'jquery/js/mashed.js'; ?>"></script>
    <?php echo (isset($include_js))? $include_js : ''; ?>   
    <script src="<?php echo base_url().'js/bootstrap.min.js'; ?>"></script>

在 HTML 中运行良好的脚本如下。

        <script type="text/javascript">
        $('.mashed_row a').click(function () {
            var link_id = $(this).attr('link_id');

         $.ajax({
                  type: 'POST',
                   url: '<?php echo base_url(); ?>main/explode_link',
                   data: {'<?php echo $this->security->get_csrf_token_name(); ?>' : '<?php echo $this->security->get_csrf_hash(); ?>', link_id},
                   dataType: 'json',
                   success : function(data) {

Answer 1

403禁止是由于csrf检查失败造成的。发生这种情况是因为在外部文件中对 $this->security 进行了两次调用，其中 $this 没有上下文。换句话说，外部js不知道$this的含义(与 View html不同)，并且无法将有用的数据放入用于设置data的对象中。

有几种解决方案。一种是在 view html 页面中创建一个 var 供外部 js 可以使用。

<script>
var csrf = {'<?= $this->security->get_csrf_token_name(); ?>' : '<?= $this->security->get_csrf_hash(); ?>'};
</script>

在外部js中使用上面的var

$(document).ready(function(){
  $('.mashed_row a').click(function () {
    var link_id = $(this).attr('link_id');

    $.ajax(
       {
          type: 'POST',
          url: 'main/explode_link',
          //combine csrf with link_id   
          data: $.extend(csrf, {link_id: link_id}),
          dataType: 'json',
          success : function(data) {
              if(data){

其他选项包括使用 JQuery 从 DOM 中提取 csrf 哈希。但是，您要么必须对 token 名称进行硬编码，要么如上所示传递它。

另一个选项是向 csrf 隐藏输入添加一个 id 属性，该属性可用于 jquery 选择器。但这与在 js 中硬编码 take 名称没有太大区别。

希望这有帮助。