angularjs1.6.8版本跨域

<!DOCTYPE html>

<html ng-app="test">

  <head>

    <meta charset="utf-8">

    <title></title>

    <script src="angular.js" charset="utf-8"></script>

    <script>

    let mod=angular.module('test', []);

    mod.controller('main', function ($scope, $http, $sce){

      $scope.arr=[];

      $scope.word='';

      $scope.$watch('word', function (){

        let res=$sce.trustAsResourceUrl(`https://sp0.baidu.com/5a1Fazu8AA54nxGko9WTAnF6hhy/su?wd=${$scope.word}`);

        $http.jsonp(res, {jsonpCallbackParam: 'cb'}).then(res=>{

          $scope.arr=res.data.s;

        }, ()=>{

          alert('错了');

        });

      });

    });

    </script>

  </head>

  <body ng-controller="main">

    <input type="text" ng-model="word">

    <ul>

      <li  ng-repeat="str in arr">{{str}}</li>

    </ul>

  </body>

</html>

angularjs，Jsonp跨域访问页面的更多相关文章

  1. Jsonp跨域访问

    很早之前看过好几篇跨域访问的文章,然后做项目的时候基本没有遇到跨域访问的问题.不过该来的还是会来,前些天终于让我遇到了.于是重温了一下原理这些,再进行实战.于是现在也敢通过实战后的一些理解来和大家分享 ...

  2. 在ASP.NET MVC3 中利用Jsonp跨域访问

    在ASP.NET MVC3 中利用Jsonp跨域访问 在信息系统开发的时,根据相关业务逻辑难免会多系统之间互相登录.一般情况下我们需要在多系统之间使用多个用户名和密码.这样客户就需要在多个系统之间重复 ...

  3. jquery ajax怎么使用jsonp跨域访问

    在项目中使用接口的比较多,在客户端跨域访问,jquery中只能使用jquery ajax的jsonp方法. 值得注意的是,jQuery.ajax()只支持get方式的跨域,post的方式是不支持的.& ...

  4. 【AngularJs】---JSONP跨域访问数据传输

    大家会自然想到只有一个字母之差的JSON吧~ JSON(JavaScript Object Notation)和JSONP(JSON with Padding)虽然只有一个字母的差别,但其实他们根本不 ...

  5. 【AngularJs】---JSONP跨域访问数据传输（JSON_CALLBACK）

    大家会自然想到只有一个字母之差的JSON吧~ JSON(JavaScript Object Notation)和JSONP(JSON with Padding)虽然只有一个字母的差别,但其实他们根本不 ...

  6. Jsonp跨域访问原理和实例

    >>什么是跨域 出于安全方面的考虑,页面中的JavaScript无法访问其他服务器上的数据,当前域名的js只能读取同域下的窗口属性,即同源策略.而跨域就是通过某些手段来绕过同源策略限制,实 ...

  7. 从前端和后端两个角度分析jsonp跨域访问（完整实例）

    一.什么是跨域访问 举个栗子:在A网站中,我们希望使用Ajax来获得B网站中的特定内容.如果A网站与B网站不在同一个域中,那么就出现了跨域访问问题.你可以理解为两个域名之间不能跨过域名来发送请求或者请 ...

  8. JSONP跨域访问百度实现搜索提示小案例

    一.JSONP简介 JSONP 全称 JSON with padding(填充式 JSON 或参数式 JSON),JSONP实现跨域请求的原理,就是动态创建<script>标签,然后利用& ...

  9. AJax与Jsonp跨域访问

    一.JavaScript的AJax AJAX即"Asynchronous Javascript And XML"(异步JavaScript和XML) 设计AJax使用的一种重要技术 ...

随机推荐

  1. MySQL 5.7 Invalid default value for 'CREATE_TIME'报错的解决方法

    出处:http://blog.itpub.net/15498/viewspace-2136006/ 由于数据库的升级,今天在执行从MySQL 5.6导出来的SQL文件时报错: mysql> so ...

  2. iOS-微信分享多张图片（UIActivityViewController多图分享和多图分享失败）

    前言 微信分享到朋友圈,可分享的类型有:文字类型.图片类型.音乐类型.视频类型和网页类型,但是我们在做图片分享的时候发现微信给的API只能分享一张图片,达不到一些APP的需求,而产品汪或者Boss想要 ...

  3. SDI初识

    SDI初识 SDI接口,即“数字分量串行接口(Serial Digital Interface)”.按照速率可以分为: 标准清晰度SD-SDI,速率为270Mb/s; 高清标准HD-SDI,速率为1. ...

  4. MySQL 内存溢出

    select EVENT_NAME ,SUM_NUMBER_OF_BYTES_ALLOC from memory_summary_global_by_event_name order by SUM_N ...

  5. jQuery 筛选器 链式编程操作

    $('#i1').next() 下一个标签$('#i1').nextAll() 兄弟标签中,所有下一个标签$('#i1').nextUntil('#ii1') 兄弟标签中,从下一个标签到id为ii1的 ...

  6. 黄聪：CR2格式批量转换JPG（美图看看）

  7. npm yarn安装包

  8. DS图--最小生成树

    题目描述 根据输入创建无向网.分别用Prim算法和Kruskal算法构建最小生成树.(假设:输入数据的最小生成树唯一.) 输入 顶点数n n个顶点 边数m m条边信息,格式为:顶点1 顶点2 权值 P ...

  9. “Hello world! ”

    12.1第一篇笔记 Python  方向:1.web全栈    2.人工智能 (java基础)   3. 爬虫开发   4.数据分析(金融) 6个月学习:需完成8-10万行代码的目标 下一步学习方向 ...

  10. tesseract 中文二次训练

    tesseract4.0以上版本可参考 https://github.com/tesseract-ocr/tesseract/wiki/TrainingTesseract-4.00#tutorial- ...